2021年前端最详细面试题-javaScript篇

1、es6的新特性

const let
模板字符串
箭头函数
函数的参数默认值
对象和数组解构
for...of 和 for...in

2、promise的使用，怎么用es5实现promise

3、if有作用域吗

只有函数有作用域，if是没有作用域的。

但是有一种情况会让if看上去有作用域，就是在if {}语句中，使用const、let，他们会有块级作用域。

4、原型链和作用域链的区别

（1）原型链
当访问一个对象的某个属性时，会先在这个对象本身的属性上找，如果没有找到，会去这个属性的__proto__属性上找，即这个构造函数的prototype，如果还没找到，就会继续在__proto__上查找，
直到最顶层，找不到即为undefined。这样一层一层往上找，彷佛是一条链子串起来，所以叫做原型链。

（2）作用域链
变量取值会到创建这个变量的函数的作用域中取值，如果找不到，就会向上级作用域去查，直到查到全局作用域，这么一个查找过程形成的链条就叫做作用域链。

（3）区别
作用域是对变量而言，原型链是对于对象的属性而言
作用域链的顶层是window，原型链的顶层是Object

5、js判断类型

1、typeof
检测不出null 和 数组，结果都为object，所以typeof常用于检测基本类型

2、instanceof
不能检测出number、boolean、string、undefined、null、symbol类型，所以instancof常用于检测复杂类型以及级成关系

3、constructor
null、undefined没有construstor方法，因此constructor不能判断undefined和null。
但是contructor的指向是可以被改变，所以不安全

4、Object.prototype.toString.call
全类型都可以判断

 

6、数据类型怎么检测

1、typeof
例：console.log(typeof true) // boolean

2、instanceof
例：console.log([1,2] instanceof Array) // true

3、constructor
例： console.log([1, 2].constructor === Array) // ture

4、Object.prototype.toString.call
例：Object.prototype.toString.call([1, 2]) // [object Array]

7、普通函数和箭头函数的区别

1、普通函数
可以通过bind、call、apply改变this指向
可以使用new

2、箭头函数
本身没有this指向，
它的this在定义的时候继承自外层第一个普通函数的this
被继承的普通函数的this指向改变，箭头函数的this指向会跟着改变
箭头函数外层没有普通函数时，this指向window
不能通过bind、call、apply改变this指向
使用new调用箭头函数会报错，因为箭头函数没有constructor

8、如何用原生js给一个按钮绑定两个onclick事件？

var btn = document.getElementById('btn')
btn.addEventListener('click', fn1)
btn.addEventListener('click', fn2)

function fn1 () {
  console.log('我是方法1')  
}

function fn2 () {
  console.log('我是方法2')  
}

9、document.write和innerHTML的区别

document.write 将内容写入页面，清空替换掉原来的内容，会导致重绘

document.innerHTML 将内容写入某个Dom节点，不会重绘

10、栈和堆的区别

1、堆
动态分配内存，内存大小不一，也不会自动释放

2、栈
自动分配相对固定大小的内存空间，并由系统自动释放

3、基本类型都是存储在栈中，每种类型的数据占用的空间的大小是确定的，并由系统自动分配和释放。内存可以及时回收。

4、引用类型的数据都是存储在堆中。准确说是栈中会存储这些数据的地址指针，并指向堆中的具体数据。

 

11、undefined 和 null 区别