原型prototype、原型链、proto

最新推荐文章于 2024-09-23 08:37:48 发布

九九七七

最新推荐文章于 2024-09-23 08:37:48 发布

阅读量45

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/qq_54455551/article/details/124181279

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        Object.prototype.eat = function(){
            console.log('333')
        }
        function Person(){//无参的构造函数
            // this.eat =function(){
            //     console.log('222')
            // }
        }
        // Person.prototype.eat = function(){
        //     console.log('吃饭')
        // }
        console.log(Person.prototype)
        let person1 = new Person()
        let person2 = new Person()
        console.log(person1.prototype)
        console.log(person1.__proto__)
        console.log(Person.prototype===person1.__proto__)//true
        // 对象可以通过__proto__来访问方法构造函数的实例对象的prototype
        console.log(person1.__proto__===person2.__proto__)//true
        person2.eat()
        // 对象访问机制（访问属性）
        // 当访问一个对象的成员的时候，对象本身有就直接返回停止查找，没有就去__proto__访问有就返回 ，找不到就会向上去查找（父亲，继承），直到找到Object
        /* 
            原型链
            一个对象寻找属性的过程，这个过程会一层一层的往上层对象去查找__proto__空间，这个过程叫做原型链
            访问一个对象的成员的时候，对象本身有就直接返回停止查找，没有就去__proto__访问有就返回 ，找不到就会向上一层一层去查找（父亲，继承），直到找到Object
         */
        // __proto__里面有一个属性叫做constructor获取构造函数
        console.log(person1.__proto__.constructor)
        let person3 = new person1.__proto__.constructor()
        person3.name = 'jack'//构造函数没有 不会添加到构造函数 name属于本身
        console.log(person3.__proto__.name)//undefined 设置不会遵从原型链
        person3.eat = function(){
            console.log('444')
        }
        person3.__proto__.eat()
    </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        function Person(){

        }
        // 一般将方法设置到prototype里面
        // prototype的作用：书写一些方法给构造函数的实例对象来使用，其实就是让这个构造函数的每一个实例对象都能访问改构造函数的prototype，解决
        // 每一个函数天生自带一个属性叫做prototype，他是一个对象
        console.log(Person.prototype)
        Person.prototype.age = 18
        Person.prototype.eat = function(){
            console.log('吃饭')
        }
        let person1 = new Person()
        let person2 = new Person()
        console.log(person1)
        console.log(person2)
        console.log(person1.age===person2.age)//true
        console.log(person1.eat===person2.eat)//true
        
    </script>
</body>
</html>