zoukankan      html  css  js  c++  java
  • prototype:构造函数的真相、原型链


    函数不是构造函数,但是当且仅当使用 new 时,函数调用会变成 ‘构造函数调用’。那么对 ’构造函数‘ 最准确的解释是:所有带 new 的函数调用。 Nothing 只是一个普通的函数,但使用 new 调用时,它会构造一个对象并赋值给 a ,这个对象通过原型链关联着对象 Nothing。 虽然这和传统的‘类继承’很相似,但是 JavaScript 中的机制有一个核心区别,那就是不会进行复制,对象之间是通过内部的 [[prototype]] 链关联的。 因此,相比以‘继承’结尾的术语(‘原型继承’),‘委托’(‘原型委托’)更能表达 JavaScript 的真实机制,因为对象之间的关系不是复制而是委托。
    Object.create(..)会创建一个新的对象 myObject 并把它关联到指定的对象 anotherObject,这样就可以充分利用 [[prototype]] 机制并避免不必要的麻烦(比如使用 new 的函数调用会生成.prototype 和 .constructor 引用)。
     1 function Nothing() {
     2   console.log( 'Dont mind me' );
     3 }
     4 
     5 // 会输出 'Dont mind me'
     6 var a = new Nothing();
     7 
     8 // 输出 {}
     9 console.log(a);
    10 
    11 // 函数不是构造函数,但是当且仅当使用 new 时,函数调用会变成 ‘构造函数调用’。那么对 ’构造函数‘ 最准确的解释是:所有带 new 的函数调用
    12 // Nothing 只是一个普通的函数,但使用 new 调用时,它会构造一个对象并赋值给 a ,这个对象通过原型链关联着对象 Nothing。
    13 // 虽然这和传统的‘类继承’很相似,但是 JavaScript 中的机制有一个核心区别,那就是不会进行复制,对象之间是通过内部的 [[prototype]] 链关联的。
    14 // 因此,相比以‘继承’结尾的术语(‘原型继承’),‘委托’(‘原型委托’)更能表达 JavaScript 的真实机制,因为对象之间的关系不是复制而是委托。
    15 var anotherObject = {
    16   cool: function() {
    17     console.log( 'cool' );
    18   }
    19 };
    20 
    21 // Object.create(..)会创建一个新的对象 myObject 并把它关联到指定的对象 anotherObject,这样就可以充分利用 [[prototype]] 机制并避免不必要的麻烦(比如使用 new 的函数调用会生成.prototype 和 .constructor 引用)。
    22 var myObject = Object.create( anotherObject );
    23 
    24 // 调用的 myObject.cool() 并不在 myObject 里,这样设计的 API 即不好理解又不容易维护
    25 myObject.cool();
    26 
    27 myObject.doCool = function() {
    28   // 委托设计模式:通过[[prototype]]委托到 anotherObject.cool()
    29   this.cool();
    30 }
    31 
    32 myObject.doCool();
  • 相关阅读:
    SQL server多表联合查询
    Linux at命令
    git用法总结详细
    vue插槽
    vue组件通信
    vue高阶函数
    vue过滤器
    vue侦听器watch
    Vue 计算属性 computed
    Spring事务失效的场景
  • 原文地址:https://www.cnblogs.com/kuangliu/p/6391545.html
Copyright © 2011-2022 走看看