json继承JS对象怎么写方便？

Question

例如：

function obg(){
    this.name = '默认'
}

var boom = {
    "url":"http://xxx.cc/xxxx"
}

我的需求是把boom继承new 一个obg对象里的所有属性，能吗？

Answer 1

首先要理解继承在JS里的实现方式, 在JS中, 判断一个对象object是否为某个构造函数constructor的实例的操作符operator是instanceof, 其逻辑是判断object的内部属性[[Prototype]]链上是否存在constructor的prototype属性. 也就是说, 这个判断会循环进行以下操作:

1. 获取object的[[Prototype]]属性作为新object

2. 如果这个新object为null, 则返回false

3. 如果constructor.prototype与这个新的object是同一个对象, 则返回true

这个内部属性[[Prototype]]通过__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/...

对于你问题里面的需求, 只能通过直接修改__proto__的方式来实现:

boom.__proto__ = obg.prototype // 这一步已经实现了继承(boom instanceof obg === true)
obg.call(boom) // 这里还需要初始化一下对象
boom.constructor = obg

Answer 2

可以使用ES6提供的Object.setPrototypeOf，这比较简单。

Object.setPrototypeOf(boom, new obg());

这实际上是修改原型链来实现扩展，在Chrome或Firefox的实现中相当于：

boom.__proto__ = new obg();

如果不支持ES6，也可以简单使用Object.assign使用mixin的方式扩展boom

Object.assign(boom, new obg());

此时的实现就不是修改原型链，而是直接扩展boom对象，这种方式在实践中也是很常用的，有可能比修改原型链的方式更加常用，可以称之为mixin。

Object.assign在IE中也是不支持的，可以引入polyfill,或者自制一个。如果使用jQuery的话，可使用$.extend代替。

$.extend(boom, new obg());

Answer 3

谢邀。

如果简单的copy 属性，Object.assign 足矣。

Object.assign(boom ,new obj)

另外，配送polyfill
https://github.com/rubennorte...

Answer 4

大神，这个是HTML5的新方法？HTML4有没有方法呢？