你能帮助澄清Javascript原型继承方法的调用吗?

前端之家收集整理的这篇文章主要介绍了你能帮助澄清Javascript原型继承方法的调用吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在这段代码中:
var Fruit = function() {}

Fruit.prototype = {
    color: function () {
        console.log('Fruit color...')
    }
}

var Apple = function () {}

Apple.prototype = new Fruit()
Apple.prototype.constructor = Apple

var a = new Apple()
Apple.prototype = null // the question!!!
a.color()

当Apple.prototype设置为null时,为什么实例仍然可以调用颜色方法

解决方法

在创建实例a后,您将更改Apple.prototype引用.

此处更改引用不会更改现有实例的引用.

你也会发现

var a = new Apple();
Apple.prototype = {}; // some other object
a instanceof Apple; // false

即因为我们已经改变了Apple的继承链,因此不再被视为Apple.

如果您尝试进行Foo检查实例,设置Foo.prototype = null将导致TypeError

更改Object的属性不会更改对该Object的引用.例如

var foo = {},bar = foo;
foo.hello = 'world';
foo === bar; // true

更改对象本身会更改引用

foo = {hello: 'world'};
foo === bar; // false

或者以更接近于如何从实例引用原型的方式编写,

var Foo = {},// pseudo constructor
    bar = {},baz = {};
var fizz = {}; // fizz will be our pseudo instance

Foo.bar = bar;          // pseudo prototype
fizz.inherit = foo.bar; // pseudo inheritance
Foo.bar = baz;          // pseudo new prototype
fizz.inherit === foo.bar; // false,instance inheritance points elsewhere

设置继承链的当前最佳实践不是使用new,而是使用Object.create

Apple.prototype = Object.create(Fruit.prototype);

如果你需要在Apple实例上调用Fruit构造函数,你会这样做

function Apple() {
    // this instanceof Apple
    Fruit.apply(this);
    // ...
}
原文链接:https://www.f2er.com/js/150566.html

猜你在找的JavaScript相关文章