| 123456789101112131415161718192021222324252627282930313233343536373839404142 |
- <!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>01.显式原型与隐式原型</title>
- </head>
- <body>
- <!--
- 1、每个函数function都有一个prototype，即显式原型（显式原型属性）
- 2、每个实例对象都有一个__proto__，可称为隐式原型（隐式原型属性）
- 3、对象的隐式原型的值为其对应构造函数的显式原型的值
- 4、内存结构
- 5、总结：
- *函数的prototype属性：在定义函数时自动添加的，默认值是一个空Object对象
- *对象的__proto__属性：创建对象时自动添加的，默认值为构造函数的prototype属性值
- *程序员能直接操作显式原型，但不能直接操作隐式原型（ES6之前）
- -->
- <script>
- //定义构造函数
- function Fn(){ //内部语句：this.prototype = {}
- }
- // 1、每个函数function都有一个prototype，即显式原型
- console.log(Fn.prototype) //Object
- //2、每个实例对象都有一个__proto__，可称为隐式原型
- //创建实例对象
- var fn = new Fn() //内部语句：this.__proto__ = Fn.prototype
- console.log(fn.__proto__) //Object
- //3、对象的隐式原型的值为其对应构造函数的显式原型的值
- console.log(Fn.prototype === fn.__proto__) //true
- //给原型添加方法
- Fn.prototype.test = function(){
- console.log('test()')
- }
- //通过实例对象调用原型的方法
- fn.test() //输出结果为：test()
- </script>
- </body>
- </html>
|
