Javascript 模块继承
Javascript Module inheritence
父模块,
var Component = function () {
var _componentName;
var _test = 'ts';
return {
getName: function(){
console.log('getName() is called');
console.log(this._componentName);
console.log(_test);
return _componentName;
}
};
};
module.exports = Component;
子模块,
var Component = require('./component');
var Skip_button = function () {
var skipBtn = Component();
skipBtn._componentName = 'Skip_Btn';
return skipBtn;
};
module.exports = Skip_button;
在另一个地方,当我打电话
var skipBtn = Skip_button();
skipBtn.getName();
如果在组件中console.log(this._componentName);
,则可以成功打印出该值。但是,如果它console.log(_componentName);
,则会出现未定义错误。知道吗?
[更新]看看这个。它按预期工作。http://jsfiddle.net/nedvedyy/Lvxqjo9v/1 所以问题仍然是,如果console.log(this._componentName);
更改为 console.log(_componentName);
,为什么它在上面的原始代码示例中不起作用
但是,如果是控制台.log(_componentName);,则取消定义错误将是 那里
这是因为当您在匿名方法中return Skip_button;
时,如果Skip_button
不在全局上下文中,那么它将返回undefined
。
如果您只是希望能够从方法继承Skip_button
并希望能够调用getName
那么只需替换
return Skip_button;
跟
return skipBtn ;
演示
var Component = function () {
var _componentName;
var _test = 'ts';
return {
getName: function(){
console.log('getName() is called');
console.log(this._componentName);
console.log(_test);
return _componentName;
}
};
};
var Skip_button = function () {
var skipBtn = Component();
skipBtn._componentName = 'Skip_Btn';
return skipBtn ;
};
var skipBtn = Skip_button();
skipBtn.getName();
在Component
功能_componentName
和_test
不在this
范围内。 但是,您在Skip_button
函数中设置skipBtn._componentName
意味着您在this
范围内设置_componentName
。这就是为什么console.log(this._componentName)
打印"Skip_Btn"的原因
var Component = function () {
var _componentName;
var _test = 'ts';
return {
getName: function(){
console.log('getName() is called');
console.log(this._componentName);
console.log(this._test);
return _componentName;
}
};
};
var Skip_button = function () {
var skipBtn = Component();
skipBtn._componentName = 'Skip_Btn';
return skipBtn ;
};
var skipBtn = Skip_button();
skipBtn.getName();
如果运行上述脚本this._test
将打印"未定义",因为_test
不在this
范围内。
var Component = function () {
var _componentName = 'test';
var _test = 'ts';
return {
getName: function(){
console.log('getName() is called');
console.log(_componentName);
console.log(_test);
return _componentName;
}
};
};
var Skip_button = function () {
var skipBtn = Component();
skipBtn._componentName = 'Skip_Btn';
return skipBtn ;
};
var skipBtn = Skip_button();
skipBtn.getName();
如果你运行上面的代码,console.log(_componentName)
将打印"test",因为它有一些价值
- Javascript,访问一个主要对象模块模式中的每个对象
- 使用外部模块继承Jade模板的好策略,在Express上
- JavaScript:访问继承子模块中的“封闭”变量
- 模块化JS和原型继承
- 如何从TypeScript编译中现有的AMD js类继承到AMD模块
- Node.js/变量和模块的继承
- 复杂的循环节点模块依赖抛出“类型错误:'继承'的超级构造函数必须有一个原型”
- 节点模块和原型继承
- 继承和依赖项注入如何与角度模块一起工作
- 在node.js中使用原型导出模块和导出继承
- 简单的javascript继承使用$.扩展和模块模式
- 可以在Javascript中继承模块
- 把握“OOP"带有继承的模块模式
- Javascript模块不可用,没有从Django模板继承的模板
- Javascript继承:用模块模式和$.extend覆盖功能
- 是否有一种方法可以访问从基本模块继承的dojo功能
- 继承和模块模式
- Node.js模块的继承
- 继承和模块模式错误行为
- Javascript 模块继承