13-ES6类的本质.html

最新推荐文章于 2024-06-14 11:01:38 发布

倾馨1314

最新推荐文章于 2024-06-14 11:01:38 发布

阅读量60

点赞数

文章标签： javascript 原型模式前端

本文链接：https://blog.csdn.net/m0_59556655/article/details/126860288

版权

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // ES6之前 通过 构造函数+原型实现面向对象编程

        // (1)构造函数有原型对象prototype
        // (2)搞糟函数原型对象prototype里面有constructor 指向构造函数本身
        // (3)构造函数可以通过原型对象添加方法
        //  (4)构造函数常见的实例对象有__proto__ 原型，指向构造函数的原型对象
        // ES6通过 类 实现面向对象编程
        class Star {

        }
        // console.log(typeof Star);//function
        // 1.类的本质其实还是一个函数，我们也可以简单的认为，类就是构造函数的另外一种写法

        // (1)类有原型对象prototype
        console.log(Star.prototype);
        // (2)类原型对象prototype 里面有constructor 指向类本身
        console.log(Star.prototype.constructor);
        // (3)类可以通过原型对象添加方法
        Star.prototype.sing = function () {
            console.log('冰雨');
        }
        var ldh = new Star();
        console.dir(ldh);
        // (4)类创建的实例对象有__proto_- 原型，指向类的原型对象
        console.log(ldh.__proto__ === Star.prototype); //true

    </script>
</body>

</html>
<!-- 

    类其实就是语法糖
    语法糖：语法糖是一种便捷写法，简单理解，用两种方法可以实现同样的功能，但是一种写法更加清晰，方便，那么这个方法就是语法糖
 -->