【JS基础】JS中的原型和原型链

发布时间 2023-06-14 21:37:11作者: zjy4fun

在 JavaScript 中,每个对象都有一个原型(prototype)属性,它指向另一个对象。

对象可以继承其原型对象的属性和方法。原型是 JavaScript 实现对象继承的基础概念之一,而原型链则是一种通过多层级原型连接起来的机制。

每个 JavaScript 对象(除了 null 和 undefined )都有一个原型对象,原型对象本身也是一个对象,它可以拥有自己的原型,形成原型链。

 

原型链是由对象的原型属性所组成的,当我们试图访问一个对象的属性或方法时,JavaScript 会首先在该对象自身上查找,如果找不到,就会去原型对象上查找;

如果还找不到,就会继续在原型对象的原型上查找,以此类推,知道找到该属性或方法,或者到达原型链的末尾(原型为 null)

下面是一个示例用来说明原型和原型链的概念:

const person = {
    name: 'jack'
}
// 创建一个新对象,并将其原型设置为 person
const student = Object.create(person)
student.id = 123

console.log(student.name)//jack
console.log(student.id)//123

// 在 student 对象中查找 age 属性,但是找不到
// 然后在 person 对象中查找,也找不到
console.log(student.age)        // undefined
// 最终在 Object.prototype 中找到 toString 方法
console.log(student.toString()) // [object Object]

上面的示例中,我们创建了一个 person 对象,并将其作为 student 对象的原型。

student 对象继承了 person 对象的属性和方法,包括 name 属性。

当我们访问 student.name 时,由于 student 对象本身没有 name 属性,JavaScript 会通过原型链在 person 对象中找到该属性并返回。

 

原型链的终点是 Object.prototype ,它是所有对象的原型。

Object.prototype 没有自己的原型,形成了原型链的最后一个环节。

在上述示例中,当我们调用 student.toString() 时,student 对象无法在自身和 person 对象中找到 toString 方法,但在原型链中的 Object.prototype 中找到了该方法。

 

原型链的概念是 JavaScript 实现继承的基础。

通过在原型链上查找属性和方法,对象可以共享和继承它们呢,这种机制使得对象之间可以实现属性和行为的复用,提高了代码的灵活性和可维护性。