前端面试题说一下原型链
时间: 2023-12-07 15:39:36 浏览: 42
原型链是JavaScript中非常重要的一个概念,它是实现继承的主要方法之一。在JavaScript中,每个对象都有一个原型对象,而原型对象也可以有自己的原型对象,这样就形成了一个原型链。当我们访问一个对象的属性或方法时,如果该对象本身没有这个属性或方法,就会去它的原型对象中查找,如果还没有,就会去原型对象的原型对象中查找,直到找到该属性或方法或者到达原型链的顶端为止。
下面是一个简单的例子,演示了原型链的基本概念:
```javascript
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.sayHello = function() {
console.log("Hello, my name is " + this.name);
};
function Student(name, age, grade) {
Person.call(this, name, age);
this.grade = grade;
}
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
Student.prototype.sayGrade = function() {
console.log("My grade is " + this.grade);
};
var student = new Student("Tom", 18, 3);
student.sayHello(); // 输出:Hello, my name is Tom
student.sayGrade(); // 输出:My grade is 3
```
在上面的例子中,我们定义了一个`Person`构造函数和一个`Student`构造函数,`Student`构造函数继承自`Person`构造函数。我们通过`Object.create`方法将`Student`的原型对象指向`Person`的原型对象,这样就形成了一个原型链。当我们调用`student.sayHello()`方法时,由于`student`对象本身没有`sayHello`方法,就会去它的原型对象`Person.prototype`中查找,找到了该方法并执行。当我们调用`student.sayGrade()`方法时,由于`student`对象本身没有`sayGrade`方法,就会去它的原型对象`Student.prototype`中查找,找到了该方法并执行。
相关推荐
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)