个人收集的前端面试题（个人收集，供以后复习）

• doctype的作用是什么
  • doctype是html5标准网页声明，且必须声明在html文档的第一行，告知浏览器的解析器用什么文档标准解析这个文档，不同的渲染模式会影响到浏览器对css代码和js脚本的解析。
• 你对HTML语义化的理解
  • HTML语义化对于开发者而言，它增强了可读性，使开发者更加清晰的看出网页的结构，方便维护和开发。对搜索引擎而且能更好获取有效信息。
• script标签中的defer和async的区别
  • defer：只有浏览器解析完文档之后才会执行脚本。
  • async：脚本加载完成之后会立即执行，所以async属性的脚本是乱序的。
• 前端的储存方式有几种，区别是什么？
  • 前端的储存方式有 cookies、localstorage、sessionstorage
  • 区别：
    • cookies：大小只有4k，使用还需封装，但兼容好。
    • loaclstorage：HTML5加入的以键值对为标准的方式，操作方便，永久性储存，大小为5m
    • sessionStorage: 基本上与loaclstorage相同，区别在于，sessionstorage当页面关闭后会背清理，而且不能在所有同源窗口中共享，是会话级别的储存方式
• 有哪些方式可以隐藏页面元素？
  • opacity： 0。本质上是将元素的透明度设置成0，依然会占据空间
  • visibility： hidden 隐藏元素单身依然会占据空间
  • overflow：hidden 隐藏元素溢出的部分
  • display：none 彻底隐藏元素，元素从文档流中消失，不占据空间
  • z-index： -9999。将层级设置成最低，
  • transform：scale(0,0)： 平面变换，将元素缩放为0，会占据空间
• 什么是BFC以及怎么形成
  • BFC是块级格式化上下文，是一个单独的渲染区域，让处于BFC内容的元素与外部元素相互隔离，也就是说，不会影响到外部元素。
  • BFC的形成：
    • position设置成fixed和absolute
    • float不为none
    • overflow不为visible
    • display的值为inline-block,table-cell,table-caption
• 谈谈你对FLEX的理解
  • flex是弹性布局，flex布局包括两个东西，一个叫做容器，还有一个叫做 flex项目，可以通过给容器和项目添加属性，来达到想要的效果。
• 什么是变量提升
  • js引擎的工作方式是先解析代码，获取所有被声明的变量，然后注行执行。所以所有的变量声明语句都会被提升到代码的头部，这叫变量提升
• 什么是闭包，闭包有什么优缺点
  • 闭包可以简单的理解成定义在一个函数内部的函数，也可以说，闭包就是将函数内部和函数外部链接在一起的方法。
  • 闭包的特点：在一个函数内部定义另外一个函数，并且返回内部函数或者立即执行内部函数。内部函数可以读取外部函数的变量，让变量一直保存在内存中。
  • 闭包的优点：
    • 希望一个变量长期存储在内存中，
    • 避免全家变量的污染
  • 闭包的缺点：
    • 增加了内存的使用量
    • 有内容泄露的风险。
• ES6模块和Common.js模块的区别
  • Common.js是对模块的浅拷贝
  • ES6模块是对模块的引用，不能改变其值。
• 谈谈对原形链的理解
  • 绝大部分函数都有一个prototype属性(属性值是一个对象)，所有对象都有一个_ _ proto _ _ 属性，它指向该对象的构造函数的prototype。
  • 当访问一个对象的某个属性时，会先在这个对象的本事属性上查找，如果没找到，则会去它的_ _ proto _ _指向那个构造函数的prototype中查找，如果还没找到，就会在函数函数的prototype的 _ _ proto _ _指向的prototype中查找，这样一层一层的向上查找直到指向的是null，这样形成一个链式结构，叫做原型链。
• 能否谈谈 this 的作用？
  • this的作用：
    • 当成员变量和局部变量同名时，用来区分成员变量和局部变量
    • 在函数中调用函数或对象
• 谈谈this的了解
  • this的指向不是编写时确认的，而是执行的时候确定的，this的指向遵循一定的规则。
    • 默认情况下，this指向全局对象即window对象
    • 谁调用函数，this就指向谁。
    • call，apply，bind 三个方法也会改变this指向
    • new出来的实例对象，this指向它
    • 箭头函数的this指向的是 定义时的那个对象。
• async/await是什么？
  • async函数，就是generator函数的语法糖，它建立在promise上，并且与所有现在的基于promise的API兼容
  • async 声明一个异步函数
    • 自动将常规函数转换成promise，返回值也是一个promise对象
    • 只有async函数内部的异步操作执行完成之后，才会调用then方法指定的回调函数
    • 异步函数内部可以使用await
  • await 暂停异步的功能执行
    • 放置在promise调用之前，await强制其他代码等待，直到promise完成并返回结果
    • 只能与promise一起使用，不适用与回调
    • 只能在async函数内部使用
• async/await和promise相比有什么优点
  • 代码更好阅读，promise的then链式调用会带来额外的阅读负担
  • promise传递中间值非常麻烦，而async/await几乎是同步的写法，非常便利
  • 错误处理友好，async/await有成熟的try/catch方法
  • 调用友好，promise的调用很差，由于没有代码块，不能设置断点。
• 聊一聊如何在js中实现不可变对象？
  • 深克隆
  • Immutable.js
  • immer
• 浏览器的内核有哪些
  • Chrome浏览器和欧朋浏览器是用 Blink 内核
  • 火狐浏览器是用 gecko内核
  • Safari浏览器是用webkit内核
  • IE是用trident