zoukankan      html  css  js  c++  java
  • 实习面试题

    一、算法部分

    1、基本排序的方式
    冒泡、快排、桶排、堆排序、归并排序、插入排序。
    2、二分搜索等
    3、二叉树遍历相关,例如前序遍历中序遍历后序遍历等,深度优先搜索和广度优先最好掌握。还有二叉树的反转
     

    二、计算机网络部分
    1.最重要的就是http协议

    http报文解构都包含什么(大致就是那个三部分,请求实体、请求头、请求行这些)

    http协议常用的状态码(https://blog.csdn.net/xiaozhuxmen/article/details/51934706)

    http头部关于缓存的字段

    http和https的区别

    https是http+SSL/TSL,是http的安全版,包含对称加密,非对称加密,CA认证,http是超文本传输协议,信息明文传输,有窃听、篡改、冒充风险,https密文传输

    http端口号80,https端口号443

    http建立连接快,https建立连接慢一点,因为它还要和ssl握手

    http1.0 1.1 2 大致的区别

    http1.0每个连接只允许一次请求,耗时

    http1.1每次连接可以多个请求,但是这些请求有顺序,要是前面的有一个传输特别慢就会导致队头阻塞

    http2复用tcp连接,请求无顺序,不用按顺序一一回应,避免了队头阻塞,头信息压缩

    缓存字段和200、404、304之类非常常用的状态码一定要记住。
    2.tcp的三次握手和四次挥手。
    3.udp和tcp的比较等等
    进程和线程
    进程是程序的一次执行,占有一片独有的内存空间,资源分配
    线程,CPU的基本调度单位,是程序执行的一个完整流程,资源调度
    浏览器内核
    chrome,safari:webkit
    firefox:Gecko
    IE:Trident
    360,搜狗等国内浏览器:Trident+webkit
    内核模块组成:
    html/css文档解析模块
    dom/css模块
    布局和渲染模块
    定时器模块
    网络请求模块
    事件响应模块
    三、 html和css基础部分。
    1.盒模型概念
    网页布局就像摆放一个个盒子,盒子由margin, padding, border, content组成
     
    2.position定位属性和相关的关系,例如relative占用文档流,而absolute和fixed却不占用,还有relative和absolute结合使用会有变化,一定要搞懂。
    static,默认
    relative,
      1、开启相对定位后,不设置偏移量元素不会发生任何变化
      2、相对定位元素相对于自身在文档流中的位置进行定位
      3、不会脱离文档流
      4、不会改变元素性质
      5、会提升一个层级
    absolute
      1、...
      2、相对于距离最近的开启了定位的祖先元素进行定位,若都没开启,则直接相对于浏览器窗口定位
      3、会完全脱离文档流
      4、会改变元素性质,内联变块
      5、会使元素提升一个层级
    fixed
      1、是一种特殊的绝对定位,特点大部分和绝对定位一样
      2、不同的是永远相对于浏览器窗口进行定位,不会随滚动条滚动
    层级关系
      1、定位元素>浮动元素>文档流中的元素
      2、元素开启了定位后,可通过z-index设置元素层级
      3、z-index值越高元素越优先显示
      4、如果z-index值一样,则优先显示下面的元素
      5、父元素永远不会盖住子元素  
    3.display相关属性,常用的block、inline、等等。
    flex响应式布局,css3,justify-content设置水平方向排列,align-items设置垂直方向排列
    inline-block转为行内块级元素,使之可以设置宽高
    block转为块级元素
    inline转为行内元素
    none不显示,不保留位置
    4.IFC和BFC问题。
    BFC块级格式化上下文, 开启了BFC的元素不受外界元素干扰,可用来解决垂直塌陷问题,开启方法:
    1、float的值不是none。
    2、position的值不是static或者relative。
    3、display的值是inline-block、table-cell、flex、table-caption或者inline-flex
    4、overflow的值不是visible
    BFC特点:
    • BFC可以包含浮动元素(闭合浮动)
    • BFC所确定的区域不会与外部浮动元素发生重叠
    • 位于同一BFC下的相邻块级子元素在垂直方向上会发生margin重叠
    • 位于不同BFC下的相邻元素之间不会发生margin重叠
     
    5.双飞翼布局。
    6.垂直居中、水平居中的多种方式和方法,这俩个都有很多的方法,尽量每个都记下来4个方法以上,使用line-height的时候需要知道高度等等。而且还有要注意字体的居中和块级元素等居中是不一样的。
    水平居中,行内元素text-aljgn:center, 块级元素margin:0 auto;
    垂直居中,设置line-height和height一样,绝对定位,设置left, top 为50%,margin-left:-元素本身宽度一半,margin-top:-元素本身高度一半
    css3,display:flex; justify-content:
    7.圣杯布局
    8.rem、em的使用。
    rem相对网页根元素字体大小,一般为html, em相对父元素字体大小;
    9.less等预处理语言。
    像写编程语言一样写css, 比如你css里重复用到某个相同属性,那你可以用less写成一个变量,到时候如果要改只需改那个变量值即可,便于维护
    10.媒体查询。
    11.vh和vw,当然这个考的实在太少。
    12.h5的语义化部分。当时就有一个问题问我实现删除线怎么办。当然有html基础标签和css样式了。他就问哪种更好。当时楼主一脸蒙蔽的说html的方式更好。最后被问原因的时候说了一大堆不重要的,最后面试官告诉我是在语义化的方面考虑的。。。
    13.h5 的web worker 还有websocket。这些不需要你真正使用过,但是要明白他们在什么场景下使用。就可以了。自己拿菜鸟教程上代码的实验一下就可以了。websocket内部还有一些关于协议的部分。要自己弄懂。
    14.h5的语义化标签都有什么,大致看一下,记住一部分。还有新加的例如video这些东西。
    header, nav, session, article, footer, audio音频, video视频
     
    15.css3的都很重要,包括transform、transition、animate这些都好好看一下。
    16.css选择器的优先级,也就是class id 元素选择器这些的优先级计算。
    !important>内联1000>id100>class10(伪类)>标签1(伪元素)
    17.css样式表引用的优先级部分。例如link引用或者行内都设置了字体颜色,问字体此时显示什么字体。
    内联样式表>内部样式表>外部样式表
    18.清除浮动。
    19.canves 某些特别的公司部门可能需要,但是我至今没有被问过。
    20.css实现响应式的方式。
    设置字体用相对大小
    高度塌陷
    产生原因:父元素在文档流中高度默认被子元素撑开,当子元素脱离了文档流,将无法撑起父元素高度,也就导致了父元素高度塌陷
    后果:父元素一旦塌陷,所有标准流中元素上移,布局混乱
    方案一:
      开启父元素的BFC
      开启BFC后:
      1、父元素的垂直外边距不会与子元素重叠
      2、开启BFC的元素不会被浮动元素所覆盖
      3、开启BFC的元素可以包含浮动子元素
      4、计算BFC高度时,浮动元素也参与计算
     方案二:
      在塌陷父元素最后添加一个空白的div,然后对该div清除浮动
      clear:none left right both
    方案三:使用after伪类,原理同方案2
      .clearfiix:after{
        content:' ';
        display:block;
        clear:both;
      }
    高度塌陷完善
      1、子元素浮动,父标签高度塌陷
      2、子元素和父元素相邻的垂直外边距会发生重叠,子元素的外边距会传递给父元素,使用空的table标签可以隔离父子元素的外边距,阻止外边距重叠
      3、经过修改后的clearfix是一个多功能的,既可以解决高度塌陷,又可以确保父元素和子元素的垂直外边距不会重叠
    .clearfix::before,
    .clearfix::after{
      content:'';
      display:table;
      clear:both;
    }
    四、js部分
    这个是重中之重了,如果你js掌握的非常非常好,面试官的问题你都回答上来了,那么html、css部分问题没答上也没有什么。毕竟js才是前端的重点。
    1.js的作用域作用域链。
    js没有块级作用域,有函数作用域,函数执行时js引擎会预解析函数内部的变量,将它们提升到所在作用域的顶部,但是赋值操作还在原来位置,当用到某个变量时,js会首先在函数内部查找这个变量,如果没有找到,就去外层找,逐级向上找,直到window, 这就是作用域链,是单向的,也就是外层作用域是没办法访问内层作用域的变量的。
     
    2.js的原型原型链,来一张巨经典的图片。能看懂或者你给面试官讲明白就ok了。还有instanceOf那些判断。
    对象包含实例和原型,实例包含实例属性和实例方法,原型包含原型属性和原型方法,当进行访问对象操作时,首先会访问对象实例,如果对象实例里没找到,就会到对象原型里找,如果对象原型也没找到,就会到创建这个对象的对象的原型库里找,逐级向上,这就是原型链。
     
    3.js的dom元素操作插入删除等等。

    添加:

    someNode.appendChild(newNode);

    移动:

    someNode.insertBefore(newNode,null);

    移除:

    someNode.removeChild(someNode.firstChild);

    someNode.remove()(删除自身)

    复制:

    someNode.cloneNode(true深复制/ false浅复制)

    创建:

    createDocumentFragment() //创建一个DOM片段

    createElement() //创建一个具体的元素 

    createTextNode() //创建一个文本节点

    替换:

    replaceChild()

    查找:

    getElementsByTagName() //通过标签名称 

    getElementsByName() //通过元素的Name属性的值 

    getElementById() //通过元素Id,唯一性

    4.js的垃圾回收机制。(问的比较少)。
    标记清除,引用计数
    5.js中String或者Array或者Math内部常用的方法。这些在菜鸟教程上都可以看的。
     
    6.ajax请求详细怎么实现,和其中的响应状态。
    状态码:0 未初始化,1 初始化, 3 数据传输中, 4 完成
    Ajax status :
    XHR.status>=200&&XHR.status<300||XHR.status==304
    7.js的基础类型和引用类型
    基础类型undefined, null, number, boolean, string, symbol(es6), 引用类型object
    内置对象类型判断
    typeof obj;
    obj.constructor.name;
    object.prototype.toString.call(obj);
    obj.toString();
    8.事件委托、事件冒泡、事件捕获。
    事件委托就是在要监听的元素的父级以上元素设置事件监听,比如要监听li的点击事件,那么可以在ul上监听,这样可以提升性能
    事件冒泡就是事件由比较具体的元素向非具体元素逐级向上传播,直到document
    事件捕获和事件冒泡相反,由非具体元素向具体元素传播
    9.addEventlistener和正常的onclick=()=> 的区别
     
    10.js中new和object.creat区别
    11.除了js中DOM的基础方法还有BOM中的方法。比如通过js直接取出相应的url的端口号,或者是协议名,或者url整体。
    12.浏览器输入url之后最后网页渲染出来经过了什么(https://blog.csdn.net/xiaozhuxmen/article/details/52014901
    DNS解析,将域名解析成IP地址
    TCP三次握手建立连接(为何要三次)
    浏览器向服务器发送请求
    服务器回应请求
    TCP四次挥手断开连接(为何要四次)
    浏览器构建生成渲染树,渲染页面
    13.js跨域实现。我大概回答的有webpack和nginx等代理跨域。CORS和jsonp等。一般这些就可以了
    14.浏览器的同源策略
    浏览器基于安全考虑,仅限同源页面之间可以进行数据交互。所谓同源,即域名,端口,协议相同
    同源对哪些行为有限制:
      1、cookie, localstorage, IndexDB
      2、DOM无法获得
      3、AJAX请求无法发送
    15.浏览器的回流和重绘,就是reflow那些东西。
    回流指元素大小,位置发生了改变,需要重新解析html构建dom树,解析css生成css规则树,二者合并成render树,浏览器重新渲染页面
    重绘指元素颜色等不影响结构的外观样式发生了改变,无需重新构建dom树,回流一定导致重绘,重绘不一定导致回流
    16.call、bind、apply区别。
    改变this指向,call传递参数,apply传递数组
    17.js实现继承怎么实现。原理是? 这个其实和上面的原型链原型是一起的。
    类的创建、继承和闭包
    new 一个Function ,继承通过prototype,超类和子类可以通过子类的prototype=new 超类(),然后把prototype 的constructor指回子类
    继承,子类拥有父类的资源
    原型链继承
      1、每个函数都能构造出一个对象,这个对象内部有个属性指向这个函数的原型对象
      2、原型对象本质也是对象,也是由另一个构造函数构造出来的,也指向那个构造函数的原型对象
    借助构造函数继承
    组合继承(原型链继承加构造函数继承)
    寄生式继承
    18.请求get和post的区别
    get数据量小32k,post数据量大1G,get直接通过url传递参数,不安全
    19.js方法参数argument
    伪数组,具有length属性,也可像真数组一样遍历,但是无法使用数组的一些方法,实质是对象,
    可通过Array.prototype.slice.call(arguments)转为真数组
    Array.from()
    20.深拷贝和浅拷贝,还可以引入序列化。还要明白序列化的缺点。
    对引用类型而言,直接拷贝的话拷贝的是引用地址,二者指向同一个堆内存,对其中一个的操作会影响另一个,即浅拷贝
    object.assign()合并对象
    深拷贝即对原来对象内存里的东西也拷贝出来,这样二者互不影响
    以下都是es6
    21.promise,最好自己声明一个构造函数尝试去实现,这样面试官会觉得你学的很认真。如果实在自己写不出来上网查一下promise的实现原理或者源码应该就有。
    解决异步的方案
    22.闭包
    当一个嵌套的内部函数引用了嵌套函数外部的变量,就形成了闭包。
      1、使用函数内部的变量,在函数执行完后,仍然存活在内存中,延长了局部变量的生命周期。
      2、在函数外部可以操作函数内部的变量
    清除闭包:
    var f=full();//全局变量,调用闭包
    f=null;
    小闭包(封闭作用域/自执行函数)
    (function(){
     
    })();
    闭包场景应用:1、高级排他;2、节流
    缺点:函数执行完后,函数内局部变量没有被释放,占用内存时间会变长,容易造成内存泄漏
    解决办法:及时释放
    内存溢出和内存泄漏
    内存溢出:一种程序运行出现的错误,当程序运行需要的内存超过了剩余的内存时,就会抛出内存溢出的错误
    内存泄漏:占用的内存没有被及时释放,内存泄漏累积多了就容易导致内存溢出
    常见的内存泄漏:
      1、占用内存很大的全局变量;
      2、没有及时清理的计时器/定时器;
      3、闭包
    解决方法:设为null
     
    23.let和const,最好全面一点解释,包括可以说一下变量提升引入一下var,和这些在什么场景下去使用。
    定义变量的新方式,主要可以解决es5中var的一些缺陷,var没有块级作用域,有变量提升,变量可以重复定义赋值,会造成开发中一些问题,let具有块级作用域,不存在变量提升,const只能被定义一次,用来定义常量,声明的常量必须赋值,只在当前代码块有效,作用域不会被提升,不能被重复声明,
    24.generator
    set和map
    set 类似于数组,没有重复元素,开发中用于去除重复元素
    创建一个集合
    let set=new Set();
    console.log(set);//一个空集合
    let set=new Set('张三','张三');//张三
    四个方法
    add(),delete(),has(),clear()
    map数值集合,也可去重
    类似于对象,本质是键值对的集合
    键不局限于字符串,各种类型的值都可以当作键
    四个方法
    set(), get(), delete(), clear()
    25.es6加上symbol的基础数据类型
    26.set类型可以实现数组去重等。
    27.箭头函数 重点,很多时候都会问 包括里面的简便写法和内部的this指针指向等等
    对this的关联。内置this的值,取决于箭头函数在哪里定义,而非箭头函数执行的上下文环境。
    new 不可用。箭头函数不能用new关键字来实例化对象,否则报错。
    this指向不会改变。函数内置this指向不可改变,this在函数体内整个执行环境中为常量。有利于JavaScript引擎优化处理。
    没有arguments对象。不能通过arguments对象访问传入的实参。只能使用显示命名或者其它新特性完成。
    28.解构赋值
    数组解构赋值,一一对应,匹配对应
    let [arr,[arr2,arr3,[arr4,arr5]]];
    console.log(arr1,arr2,arr3,arr4,arr5);
    let name='张三', age=18;
    let[name,age]=['李四',20];
    对象解构赋值
    let {name,age,sex}={name:'张三',age:55};
    console.log(name);//张三
    基本类型的解构赋值
    let [a,b,c,d,e]='我是中国人';
    console.log(a);//我
    29.es6新增加的正则符号。
    class的基本运用 语法糖
    <script>
        //构造函数
        function Person(name,age){
            this.name=name;
            this.age=age;
        }
        Person.prototype={
            constructor:Person,
            print(){
                console.log('我叫'+this.name+'今年'+this.age);
            }
        };
        //实例化
        let person=new Person('张三',19);
        console.log(person);
    </script>
    <script>
        //通过class面向对象,语法糖
        class Person{
            constructor(name,age){
                thsi.name=name;
                this.age=age;
            }
            print(){
                console.log('我叫'+this.name+'今年'+this.age);
            }
        }
    </script>

     

    30.或者直接问你es6有什么新加的东西,说得越多越好
    es6我们可以去http://wiki.jikexueyuan.com/project/es6/这里面去学习。当然想要更深了解的话就需要看一下阮一峰大大的那本书了。但是这个我觉得面向面试足够了。
    以下就是亮点部分了,面试总要有一些亮点告诉面试官你基础很好。因为其实和面试官拽技术没必要的,人家真正搞开发的,真的拽技术能甩你8条大马路(当然真正的大大大佬请无视我这句话),而且我是面向咱们很多还是在蒙圈的同学们写的。都是很基础的东西,毕竟不能说所有人都瞄准bat进发对吧?
    1.js单线程和js具体怎么实现异步的。大概的技术名词有事件队列、执行栈、宏任务、微任务。具体的各位老铁们百度吧。。
    2.webworke做分线程
    3.vue-router原理实现。多看源码之类的
    4.nginx负载均衡。redis共享数据等等等。
    5.asm.js(这个我想很多人没听过都。。这个是我自己看的一个技术。比较有意思的。因为面试官总会问你最近在看什么比较新的技术这样的问题,专门准备的)。
     

    还有一些其他的问题。
    1.跨域。
    2.网络安全,大多就是csrf和xss看明白原理和解决方式就可以了。
    3.数据结构的栈、队列、链表、等等这些基础的数据结构要明白是什么。
    5.数据库相关操作语句(这个问得比较少,但是基础的数据库语句还是要学的,还是菜鸟教程。看一下就行了)
    6.linex基础指令,一般很少问。就算问也是问你知道什么指令
    7.bootstrap实现栅格的原理
    8.webpack相关配置。例如跨域之类的
  • 相关阅读:
    2019暑假集训 windy数
    2019暑假集训 数字游戏
    2019暑假集训 周年纪念晚会
    2019暑假集训 加分二叉树
    0013-求圆柱体体积
    0012-求滑动距离
    0011-绝对值函数
    0010-温度转换
    0009-乘法问题
    0008-三位数倒序问题
  • 原文地址:https://www.cnblogs.com/wenzizaigaoge/p/10583198.html
Copyright © 2011-2022 走看看