cvte前端笔试后的js原型总结

　　最近实习生招聘已经开始了，昨天晚上也终于迎来了第一场笔试，笔试的公司是cvte，笔试题总共27题，25道不定项还有2道编程题，虽然出的都是前端题，可是由于以前没有好好准备，仍是不少作的不是很好o(╥﹏╥)o考完试后也总结了一下，考的以node，原型，promise比较多，以前觉得本身原型掌握的还能够，一考才发现问题啊，赶忙总结一下O(∩_∩)O

 

1、从笔试提及

　　你们以为本身原型掌握的怎么样呢？昨天的笔试出了很多原型的题，一个prototype还好，多个加在一块儿真的是有点晕了，下面是记得的一道题，你们以为会输出什么呢？

function f1(){}

typeof f1.prototype;
typeof Object.prototype;
typeof Function.prototype.prototype;
typeof f1.prototype.constructor

　　上面的代码会依次输出"object"，"object"，"undefined"，"function"，若是你们四个都答对的话就不用往下看啦，若是还不会的话就跟着我一块儿从新学习下原型把

 

2、原型

一、原型对象

　　不管何时，只要建立了一个新函数，就会根据一组特定的规则为该函数建立一个prototype属性，这个函数指向函数的原型对象，这个原型对象中包含了全部实例共享的属性和方法，在默认状况下，全部原型对象都会自动得到一个constructor属性，这个属性包含一个指向prototype属性所在函数的指针，咱们拿上面的笔试题为例画图给你们说明一下

　　从上面的图咱们能够看出，第一个例子中，由于f1是个函数，所以会根据一组规则为f1建立一个prototype属性，而且指向f1的原型，这里也就是f1.prototype

　　所以，f1.prototype就是咱们所说的原型对象啦，既然它是对象，那么typeof f1.prototype就会输出object，而第四个例子中，f1.prototype.constructor会指向f1，f1自己是个函数，因此typeof f1.prorotype.constructor会输出function

　　关于第二个例子Object.prototype也是一样的道理，如下面的图为例说明一下：

　　从上面的图咱们能够看出，咱们能够把Object看出是一个构造函数，所以它也有一个prototype属性指向Object的原型对象，而Object.prototype也是一个对象，所以typeof Object.prototype会输出object

　　关于第三个例子就有点复杂啦，首先，typeof Function.prototype会输出什么呢？

　　打开控制台，输入代码，咱们会看到typeof Function.prototype输出的会是Function，这里要说明一点，Function.prototype和其它类型的prototype属性不同，像前两个例子同样，f1.prototype和Object.prototype以及其它类型的prototype都是Object，而Function比较特殊，Function.prototype的类型是Function

　　接下来，typeof Function.prototype.prototype为何会输出undefined呢？这里其实能够这样去理解，这是由于Function.prototype不具有prototype属性，所以会输出undefined，通常来讲，只有函数才会根据必定的规则建立prototype的，而Function.prototype并非函数，所以也不具有prototype属性，一样的道理，typeof f1.prototype.prototype会输出undefined，typeof Object.prototype.prototype也会输出undefined

 

二、实例，原型和构造函数的关系

　　首先，咱们须要先来讲一下__proto__这个属性，当一个对象被实例化的时候，将会包含一个内部属性，咱们把这个内部属性叫作[[Prototype]]，也就是__proto__，这个属性会指向实例化出这个对象函数的prototype，好比有下面的代码

function Person(){}

var person1 = new Person();

　　这个时候Person的构造函数，Person的原型属性和Person的实例之间的关系能够这样表示

　　从上面的图咱们能够看到，Person是构造函数，它将根据一组特定的规则建立prototype属性，而且指向Person的原型对象，而Person.prototype的constructor会指向Person构造函数，而person1是Person的实例，会包含一个内部属性__proto__指向Person.prototype，你们别小看__proto__，正由于有了这个属性，咱们就能够在Person.prototype上添加属性和方法，这些属性和方法将会被全部实例所共享，好比说能够像下面这样在Person的原型上添加属性和方法

function Person() {}

Person.prorotype.sayName = function() {
    console.log(this.name);                    //  在原型上添加方法
}

var person1 = new Person();
var person2 = new Person();

person1.name = "Nicholas";                  //  在实例上添加属性
person2.name = "Greg";                       //  在实例上添加属性

person1.sayName();                             //  Nicholas
person2.sayName();                             //  Greg

　　通常来讲，每当代码读取某个对象的某个属性时，都会指向一次搜索，目标是具备给定名字的属性，搜索首先从对象实例自己开始，若是在实例中找到了具备给定名字的属性，则返回该属性的值，若是没有找到，则继续搜索指针指向的原型对象，在原型对象中查找具备给定名字的属性

　　咱们在Person的原型上添加了sayName方法，而且建立了person1和person2两个实例，这两个实例都有本身的name属性，当执行sayName()方法时，因为其实例上不存在sayName()方法，所以会顺着__proto__指向的原型，在原型上查找sayName()方法，而且指向里面的代码

 

三、怎么判断某个实例和原型之间存在关系

　　在全部实现中都没法访问到[[Prototype]]的，所以咱们不可能经过实例的[[Prototype]]判断其是否和某个原型存在关系，咱们须要使用isPrototypeOf()方法来肯定对象之间是否存在这种关系，从本质上讲，若是[[Prototype]]指向调用isPrototypeOf()方法的对象，那么就返回true

 

Person.prorotype.isPrototypeOf(person1);        //  true
Person.prototype.isPrototypeOf(person2);        //  true

 

　　由于person1和person2内部的[[Prototype]]都指向Person.prototype，因此返回true

 

四、怎么判断属性存在实例仍是原型中

　　前面已经说过，若是在对象的实例上搜索不到某个属性时，将会在原型对象上进行搜索，若是咱们在实例中添加了一个属性，而该属性与实例原型中的一个属性同名，那么该属性将会屏蔽原型中的那个属性，那么，咱们怎么判断一个属性是存在实例仍是存在原型中呢，这里能够用hasOwnProperty进行判断

　　使用hasOwnPrototype方法能够检测一个属性是不是存在于实例中，仍是存在于原型中，旨在给定属性存在于对象实例中时，才会返回true

 

五、再来一个题

　　上面对原型作了一个比较简单的介绍，不知道你们是否是对原型有个了解了，最后，咱们在来看下面的题输出的是什么？

　　你们知道typeof Function.prototype.__proto__又是什么呢？你们本身输出代码试一试，结果会输出object哟，咱们看看下面的代码

Function.prototype.__proto__ === Object.prototype;    // true

　　通常来讲，除了Object.prototype以外的全部对象都会有[[Prototype]]，也就是__proto__属性，会指向实例化出这个对象的构造函数的原型，而为何Object没有呢，由于js的继承机制主要是原型链实现的，而原型链的头就是Object.prototype，而这里Function.prototype其实就是指向了Object.prototype

 

　　今天主要介绍这么多了，接下来要好好准备笔试，准备面试了，其实在笔试和面试中，咱们能够发现本身在哪方面的不足，及时的进行总结，其实面试对于咱们来讲，也是一种不断学习的过程，但愿你们都能加油拿到本身想要的offer