原生js大总结十一

101、请简述prototype、__proto__ constructor三者的关系

 

1、prototype：

    每一个函数都有一个prototype这个属性，而这个属性指向一个对象，这个对象我们叫做原型对象

 

    作用：

        a、节约内存

 

        b、扩展属性和方法

 

        c、可以实现类之间的继承

 

2、__proto__

 

    1、每一个对象都有一个__proto__属性

 

    2、__proto__指向创建自己的那个构造函数的原型对象

 

    3、对象可以直接访问__proto__里面的属性和方法

 

 

 

3、constructor：

    指向创建自己的那个构造函数

 

 

总结：

    当我们创建一个构造函数的时候这个构造函数自带了一个prototype属性，而这个属性指向一个对象，也就是原型对象。

 

    这个原型对象里面有一个constructor构造器，它的作用是指向创建自己的构造函数。除此之外prototype还可以存放公共的属性和方法。

 

    当我们实例化一个对象的时候，这个对象自带了一个__proto__属性，这个__proto__指向创建自己的构造函数的原型对象。可以使用这个原型对象里面的属性和方法

 

102、请写出方法继承的方式

 

1、call 、apply:不建议使用浪费内存

 

2、原型对象继承

 

3、原型拷贝继承

 

4、原型链继承

 

5、混合继承

 

6、继承继承

 

7、ES6 class  super()

 

 

注意：以上方法用代码表示 不允许写文字

 

103、请说出call、apply、bind的区别

 

bind:bind绑定完this的指向后会返回一个新的函数体，不会被立即调用

 

call&apply:绑定完this的指向后会立即调用

 

call与apply的区别：

    call:第一个参数是this的指向，第二个以及后面的所有参数需要一个个进行传递

 

    apply:第一个参数是this的指向，第二个参数是一个数组

 

104、请解释一下什么叫同源策略，以及为什么浏览器会有同源策略

 

同源策略是浏览器的一个安全功能，不同源的客户端在没有授权的情况下，不能读取对方资源

    

为了保障数据的安全，即非同源网页不可请求

 

 

105、什么是闭包？用途？注意的地方？

 

1、闭包就是可以读取其他函数内部变量的函数

 

2、可以读取函数内部的局部变量 2、让这些变量始终保持在内存当中

 

3、由于闭包会使得函数中的变量都被保存在内存当中，内存会消耗很大，所以不能够滥用闭包，否则会造成网页性能的问题

 

106、设计模式(代码自己完善)

 

1、单例模式：

    保证程序中，使用该模式的类只有一个实例

 

    代码....

 

2、代理模式：

    

    代码....

 

3、观察者模式：

    某个人--->观察某件事件---》事情发生变化---》通知这个人---》去做某件事情

 

    代码....

 

107、什么是预加载&&懒加载

 

懒加载：

     当访问一个页面的时候，先把img元素或是其他元素的背景图片路径替换成一张大小为1*1px图片的路径（这样就只需请求一次，俗称占位图），只有当图片出现在浏览器的可视区域内时，才设置图片正真的路径，让图片显示出来。这就是图片懒加载。

 

实现原理：

    1、将图片地址放在元素的自定义属性中

 

    2、当页面加载完成后，根据scrollTop判断图片是否在用户的视野内，如果在就取出属性值放到src属性中

 

 

预加载：