Javascript传播与传承
Javascript spread & inheritance
我对 javascript 开发还很陌生,仍在学习概念。我有一个关于价差 "operator" (...
) 的问题。
它可以用作类似继承的机制还是它有副作用应该让我避免这种情况?
例子
const A = {
prop1: "value1",
prop2: function() {return this.prop1}
}
const B = {
...A,
prop1: "updated_value1",
prop3: "value3"
}
这里的B可以看出继承自A,A.prop2()
returnsvalue1
,B.prop2()
returnsupdated_value1
有一个期望来自任何继承的对象。
这有效吗?
你不能真正称之为内在。这是一个合并。通过写这个
const B = {
...A,
prop1: "updated_value1",
prop3: "value3"
}
来自 A 的 props1
将被来自 B 的 prop1
覆盖。所以是的,B.prop2()
将 return updated_value1
,这是完全公平的。
在你的情况下,我倾向于使用 Object Assign,因为更少的事情会出错:
const A = {
prop1: "value1",
prop2: function() {return this.prop1}
}
cont B = Object.assign(A, {
prop1: "updated_value1",
prop3: "value3"
});
但这仍然不是真正的继承。
我不会调用这个 inheritance.Using 带对象的扩展运算符类似于使用 Object.assign()。此方法的作用是从一个或一个复制所有可枚举的自身属性的值更多的源对象到一个目标对象。
参见 documentation
它可能看起来像继承,但实际上您在这里定义的只是:
const A = {
prop1: "value1",
prop2: function() {return this.prop1}
}
const B = {
prop1: "value1",
prop2: function() {return this.prop1},
prop1: "updated_value1",
prop3: "value3"
}
本质上,您正在覆盖为对象 B 定义的 2 行成员。
它不是继承,因为成员的定义将由对象 B 而不是 B 的原型拥有。当引用 B.prop1 时,引擎将不必查看 属性 的原型,如果您使用 protos
,继承就会这样做
您发布的代码按预期工作,因为属性从 A 复制到 B。但是,这不是继承的示例,它只是一个浅拷贝。
在您的示例中,所有属性都是基元,考虑如果我们添加对 A 的引用会发生什么:
const A = {
prop1: "value1",
prop2: function() {return this.prop1},
obj: { value: 1 }
}
const B = {
...A,
prop1: "updated_value1",
prop3: "value3"
}
现在,更改 A.obj.value
也会修改 B.obj.value
,这实际上会使所有 B 与 A 以及彼此之间共享他们的 obj
。这在某些情况下可能很有用,但不完全是继承。
对于继承最好使用"Javascript classes"
{...A} 只是从 'A' 创建所有键值的副本并将其设置为 'B'。
然后将 'B' 的 属性 prop1 更新为 updated_value1。 'A'保持不变。这完全有效
我对 javascript 开发还很陌生,仍在学习概念。我有一个关于价差 "operator" (...
) 的问题。
它可以用作类似继承的机制还是它有副作用应该让我避免这种情况?
例子
const A = {
prop1: "value1",
prop2: function() {return this.prop1}
}
const B = {
...A,
prop1: "updated_value1",
prop3: "value3"
}
这里的B可以看出继承自A,A.prop2()
returnsvalue1
,B.prop2()
returnsupdated_value1
有一个期望来自任何继承的对象。
这有效吗?
你不能真正称之为内在。这是一个合并。通过写这个
const B = {
...A,
prop1: "updated_value1",
prop3: "value3"
}
来自 A 的 props1
将被来自 B 的 prop1
覆盖。所以是的,B.prop2()
将 return updated_value1
,这是完全公平的。
在你的情况下,我倾向于使用 Object Assign,因为更少的事情会出错:
const A = {
prop1: "value1",
prop2: function() {return this.prop1}
}
cont B = Object.assign(A, {
prop1: "updated_value1",
prop3: "value3"
});
但这仍然不是真正的继承。
我不会调用这个 inheritance.Using 带对象的扩展运算符类似于使用 Object.assign()。此方法的作用是从一个或一个复制所有可枚举的自身属性的值更多的源对象到一个目标对象。 参见 documentation
它可能看起来像继承,但实际上您在这里定义的只是:
const A = {
prop1: "value1",
prop2: function() {return this.prop1}
}
const B = {
prop1: "value1",
prop2: function() {return this.prop1},
prop1: "updated_value1",
prop3: "value3"
}
本质上,您正在覆盖为对象 B 定义的 2 行成员。 它不是继承,因为成员的定义将由对象 B 而不是 B 的原型拥有。当引用 B.prop1 时,引擎将不必查看 属性 的原型,如果您使用 protos
,继承就会这样做您发布的代码按预期工作,因为属性从 A 复制到 B。但是,这不是继承的示例,它只是一个浅拷贝。
在您的示例中,所有属性都是基元,考虑如果我们添加对 A 的引用会发生什么:
const A = {
prop1: "value1",
prop2: function() {return this.prop1},
obj: { value: 1 }
}
const B = {
...A,
prop1: "updated_value1",
prop3: "value3"
}
现在,更改 A.obj.value
也会修改 B.obj.value
,这实际上会使所有 B 与 A 以及彼此之间共享他们的 obj
。这在某些情况下可能很有用,但不完全是继承。
对于继承最好使用"Javascript classes"
{...A} 只是从 'A' 创建所有键值的副本并将其设置为 'B'。 然后将 'B' 的 属性 prop1 更新为 updated_value1。 'A'保持不变。这完全有效