JS难点知识总结(一)

480 阅读3分钟

总结一些JavaScript里面的的一些比较难且很重要的知识。在面试中也经常会遇到。

1、原型和原型链

原型:在构造函数上存在一个prototype属性,指向一个对象,这个对象就是原型对象,所有通过当前构造函数创建的实例都可以访问此对象。任何对象都有一个原型对象,通过__proto__访问;
原型链:当访问实例对象的属性的时候,先从自身查找,自身没有时,就向对应的原型对象查找,一直到Object的原型对象,直到为null

2、new关键字做了哪些事

1.创建一个普通对象{},
2.添加__proto__属性,将该属性链接至构造函数的原型对象,
3.将第一步创建的普通对象作为this的上下文,
4.默认返回this,如果返回的不是一个对象。

3、函数闭包

出现:函数嵌套,内部函数使用了外部函数的变量,就形成闭包。
原因:内部函数使用外层函数的变量,在自身没有找到时,会向外层函数的作用域查询。外层函数在执行结束时,其执行上下文不会被销毁。
作用:局部变量持久化和私有化。在防抖和节流以及vue源码的once都有应用。
缺点:由于外层函数的执行上下文不能及时回收,可能导致内存泄漏。

4、this指向

1.默认指向:window,严格模式下指向undefined
2.隐式指向:当函数作为对象的方法调用时,指向调用方法的对象。
3.特殊指向:在事件的回调函数中,指向绑定事件的元素;箭头函数自身没有this,从父级函数或全局中获取,且无法显示更改;new关键字,this指向创建出来的对象。
4.显示指向:通过方法强制指向某个对象。
call、apply更改this指向并执行函数,bind更改this指向,返回函数,常用于事件绑定。 call和bind传参方式一样call(obj,参数1,参数2),apply(obj,[参数1,参数2])

5、浅拷贝和深拷贝

1.浅拷贝:直接对当前对象的所有属性进行复制,不对其中的引用数据类型做任何处理。可以使用Object.assign(){...obj}
2.深拷贝:对当前对象的所有属性进行复制,如果遇到引用数据类型,对其以进行拷贝,拷贝前后的数据不会相互影响。
实现注意点:对基本数据类型和引用数据类型单独处理,基本数据类型直接返回,不同引用数据类型生成对应的数据结构;循环引用,每遍历一个对象,就存起来,在每次遍历之前,判断当前内容是否遍历过。
实现方式:浏览器内置方法structuredClone();JSON.prase(JSON.Stringify(data))数据中存在undefined时有问题;使用第三方库lodash_.cloneDeep(data)

6、箭头函数的特点

1.没有自己的this,指向的是父作用域的;
2.不能作为构造函数来 new 实例化; 
3.内部没有arguments变量;
4.不能用作 Generator 函数。

总结

对一门语言的核心概念的掌握能提高思维能力和理解各种源码的阅读能力。最好的学习方法就是不断分析总结,重复理解的次数多了,自然就会了。