JavaScript 继承魔法

标签 javascript

当我运行这段代码时:

function foo() { 
    console.log("foo"); 
    var self = this; 
    this.a = function() { 
        return arguments.length == 0 ? self.b : (self.b = arguments[0]); 
    }; 
}; 
function bar() {
}; 
bar.prototype = new foo(); 
var a = new bar(); 
var b = new bar(); 
console.log(a.a()); 
b.a(true); 
console.log(a.a());

我得到以下输出:foo, undefined, true

我不明白构造函数 foo 返回的对象如何以某种方式设法为 b 分配新的内存位置。我完全期待最后的输出是 true 因为我只得到 1 个 foo 输出。

这很好用,但感觉太像魔法了。

我的真正问题是我想设置一个初始化顺序(或链)。我意识到 foo 不能接受任何参数,因为它只被调用一次,以提供一个基础(或各种模板)。

我想设计一个非常简单的模式,其中 foo 具有必须从 bar 传递到 foo 的参数(因为 bar 继承 foo)。我对从 bar 调用 foo.apply(this, arguments) 这样的事情很好,但是设置原型(prototype)的调用必须在没有参数的情况下完成,我需要的是一种以某种方式区分两者的流利方式。

但我真的不想围绕创建允许某种继承的对象构建整个服务,我真正关心的唯一事情是正确地构建对象......

最佳答案

附带说明一下,您有时使用 self 有时使用 this...就个人而言,我会更加一致。我喜欢使用 that 因为 this can be confusingself is part of the BOM ,但这只是个人喜好问题。

尝试 parasitic inheritance :

function foo(arg) {
    var that = this;
    that.a = function() { 
        return arguments.length == 0 ? that.b : (that.b = arguments[0]); 
    };
}

function bar(arg) {
    return new foo(arg);
}

bar.prototype = new foo(); 
var a = new bar();  // the `new` is now optional. Personally I'd remove it...
var b = bar();  // ... like I did here!
console.log(a.a()); 
b.a(true); 
console.log(a.a());
console.log(b.a());

...这里的继承行为更经典,在调用构造函数时显式调用父构造函数。

关于JavaScript 继承魔法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7852146/

相关文章:

php - 折线图生成

javascript - Handsontable - 数字列类型

javascript - 在 props 渲染上取消 componentDidMount 中的 setInterval

JavaScript 不喜欢 hashes.to_json?

javascript - Puppeteer - 评估方法中的异步函数引发错误

javascript - 如何在 Javascript 中保存 zip 文件的二进制数据?

javascript - 添加光标 :hand with JavaScript

javascript - 类型错误 : Class extends value undefined is not a constructor or null (React Meteor Data)

javascript - 为什么不在括号中运行我的js代码?

javascript - javascript中数字作为变量名