JS里的原型和继承（ES6里的class和extends）

最新推荐文章于 2023-09-04 09:56:03 发布

qq_42022647

最新推荐文章于 2023-09-04 09:56:03 发布

阅读量964

点赞数 1

分类专栏： JavaScript 文章标签： js javascript prototype class

本文链接：https://blog.csdn.net/qq_42022647/article/details/115919261

版权

本文介绍了JavaScript中的原型和继承机制，包括原型的作用、原型链的形成，以及不同继承方式如原型链继承、构造函数继承和组合继承。还探讨了ES6中使用`class`和`extends`关键字实现的类继承，它解决了早期继承方式的一些问题。

摘要由CSDN通过智能技术生成

JS原型和继承

原型

原型作用：给实例提供共享的方法和属性
1.任何一个函数，都默认会自带一个属性为prototype
2.这个prototype属性对应的值是一个对象
3.只要是通过构造函数new出来的对象可以直接访问原型上的所有属性

在这里插入图片描述

原型链

一个实例会有原型对象，原型对象也有自己的原型对象，一层一层向上追朔则形成原型链。所有对象的原型链尽头：object.prototype。

继承

1.原型链继承
解决了共同方法继承的问题（一般不继承属性）
将属性和方法挂载到原型上，然后将要继承的对象赋值给其prototype对象，将原型替换掉（换爹）。
2.借用构造函数继承
解决了共同属性的继承问题
即增加：共享构造函数名.call(this，参数一，参数二)
具体见案例
3.组合继承
原型链继承加上借用构造函数继承

组合继承案例

 <script>
        //创建公共构造函数
        function Animal(color, sort) {
   
            this.color = color
            this.sort = sort
        }
        //将公共方法挂载到其原型上
        Animal.prototype.eat = function() {
   
            console.log('我在吃')
        }
        Animal.prototype.sleep = function() {
   
            console.<