js面试一定会出的原型和原型链

js面试一定会出的原型和原型链

我们先来看一段代码，后面的内容都会围绕着出现的代码来讲

 	class People{
            constructor(name){
                this.name=name;
            }
            eat(){
                console.log(`${this.name} eat something`);
            }
        }
     class Student extends People{
            constructor(name,number){
                this.name=name;
                this.number=number;
            }
            sayHi(){
                console.log(`姓名 ${this.name}, 学号${this.number}`)
            }
        }
        const xiaoluo=new Student("夏洛",35);
        console.log(xiaoluo.name);

这里我们先说明一个知识点：Object是所有class类的父类。

原型：

原型中由显示原型和隐式原型。

每个class都有显示原型prototype

每个实例都有隐式原型 _ proto _

基于原型的执行规则

​ // 获取属性xialuo.name或执行xialuo.sayHi()时

​ // 先在自身属性和方法寻找

​ // 如果找不到则自动去 _ proto _中去查找

上述代码中原型的关系如下，xialuo自己本身具有的属性有name,number,而它的隐式原型指向student的显示原型

原型能够理解这张图的意思就能明白了

我们再来看看原型链

这张图就是我们上面代码的原型链。studens的显示原型的隐式原型执行那个people的显示原型。object是所有class类的父级。

上面的代码中第三行输出true。

另外instanceof是基于原型链实现的，为什么？我们说明以下，判断 xialuo.instanceof student 判断为true，xialuo.instanceof people 也为true，object也为true。