84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
例如:
function obg(){ this.name = '默认' } var boom = { "url":"http://xxx.cc/xxxx" }
我的需求是把boom继承new 一个obg对象里的所有属性,能吗?
小伙看你根骨奇佳,潜力无限,来学PHP伐。
首先要理解继承在JS里的实现方式, 在JS中, 判断一个对象object是否为某个构造函数constructor的实例的操作符operator是instanceof, 其逻辑是判断object的内部属性[[Prototype]]链上是否存在constructor的prototype属性. 也就是说, 这个判断会循环进行以下操作:
object
constructor
operator
instanceof
[[Prototype]]
prototype
获取object的[[Prototype]]属性作为新object
如果这个新object为null, 则返回false
null
false
如果constructor.prototype与这个新的object是同一个对象, 则返回true
constructor.prototype
true
这个内部属性[[Prototype]]通过__proto__暴露给了用户程序, 因此可以通过修改__proto__属性来达到继承的目的:
__proto__
function extend(_ctor, _super) { // 直接显式修改 _ctor.prototype.__proto__ = _super.prototype // 隐式修改(不直接操作`__proto__`属性) function temp() { this.constructor = _super } temp.prototype = _super.prototype _ctor.prototype = new temp() } // 使用 function Super() {} function Ctor() { Super.call(this) } extend(Ctor, Super)
需要注意的是Error等built-in对象用这种方式无法实现继承, 得加一些额外的操作, 具体可以参考一下 https://github.com/Microsoft/...
Error
built-in
对于你问题里面的需求, 只能通过直接修改__proto__的方式来实现:
boom.__proto__ = obg.prototype // 这一步已经实现了继承(boom instanceof obg === true) obg.call(boom) // 这里还需要初始化一下对象 boom.constructor = obg
可以使用ES6提供的Object.setPrototypeOf,这比较简单。
Object.setPrototypeOf
Object.setPrototypeOf(boom, new obg());
这实际上是修改原型链来实现扩展,在Chrome或Firefox的实现中相当于:
boom.__proto__ = new obg();
如果不支持ES6,也可以简单使用Object.assign使用mixin的方式扩展boom
Object.assign
mixin
Object.assign(boom, new obg());
此时的实现就不是修改原型链,而是直接扩展boom对象,这种方式在实践中也是很常用的,有可能比修改原型链的方式更加常用,可以称之为mixin。
boom
Object.assign在IE中也是不支持的,可以引入polyfill,或者自制一个。如果使用jQuery的话,可使用$.extend代替。
jQuery
$.extend
$.extend(boom, new obg());
谢邀。
如果简单的copy 属性,Object.assign 足矣。
Object.assign(boom ,new obj)
另外,配送polyfillhttps://github.com/rubennorte...
polyfill
大神,这个是HTML5的新方法?HTML4有没有方法呢?
首先要理解继承在JS里的实现方式, 在JS中, 判断一个对象
object
是否为某个构造函数constructor
的实例的操作符operator
是instanceof
, 其逻辑是判断object
的内部属性[[Prototype]]
链上是否存在constructor
的prototype
属性. 也就是说, 这个判断会循环进行以下操作:获取
object
的[[Prototype]]
属性作为新object
如果这个新
object
为null
, 则返回false
如果
constructor.prototype
与这个新的object
是同一个对象, 则返回true
这个内部属性
[[Prototype]]
通过__proto__
暴露给了用户程序, 因此可以通过修改__proto__
属性来达到继承的目的:需要注意的是
Error
等built-in
对象用这种方式无法实现继承, 得加一些额外的操作, 具体可以参考一下 https://github.com/Microsoft/...对于你问题里面的需求, 只能通过直接修改
__proto__
的方式来实现:可以使用ES6提供的
Object.setPrototypeOf
,这比较简单。这实际上是修改原型链来实现扩展,在Chrome或Firefox的实现中相当于:
如果不支持ES6,也可以简单使用
Object.assign
使用mixin
的方式扩展boom此时的实现就不是修改原型链,而是直接扩展
boom
对象,这种方式在实践中也是很常用的,有可能比修改原型链的方式更加常用,可以称之为mixin
。Object.assign
在IE中也是不支持的,可以引入polyfill,或者自制一个。如果使用jQuery
的话,可使用$.extend
代替。谢邀。
如果简单的copy 属性,Object.assign 足矣。
另外,配送
polyfill
https://github.com/rubennorte...
大神,这个是HTML5的新方法?HTML4有没有方法呢?