关于原型函数的问题 [英] Questions regarding prototype function

问题描述

原型方法是如何工作的?

How does the prototype method work?

var object, u1, u2;
object = function(o) {
    var F = function() {};
    F.prototype = o;
    return new F();
};
u1 = {'name': 'adam'};
u2 = object(u1);
u2.name = 'roman';
delete u1.name;
console.log(u2.name);
delete u2.name;
console.log(u2.name);
u1.name = 'tytus';
console.log(u2.name);

roman
undefined
titus

为什么输出第三个console.log?你能解释一下这种行为吗?

Why is the third console.log being output? Could you explain this behaviour?

推荐答案

这是因为 JS 解析引用或计算表达式的方式.正在发生的事情与此类似:

It's because of the way JS resolves references, or evaluates expressions. What is happening is similar to this:

u2[name] ===> JS checks instance for property name<------------||
    || --> property not found @instance, check prototype (u1)  ||
    ===========> u1.name was found, return its value ----------||
         ||
         || if it weren\'t found here:
         ==========> Object.prototype.name: not found check prototype?
             ||
             =======>prototype of object.prototype is null, return undefined

当您第一次登录 u2.name 时，name 是一个实例属性，因此 JS 将表达式解析为该字符串常量 (roman代码>).然后你删除了它，所以在尝试再次访问它时，JS 解析为 u1.name(u2 的原型)，它也没有 name 属性，也没有找到 Object.prototype.name，因此表达式解析为 undefined.

When you log u2.name the first time round, name was an instance property, so JS resolved the expression to that string constant (roman). Then you deleted it, so upon trying to access it again, JS resolved to u1.name (u2's prototype), which also didn't have the name property, nor did it find Object.prototype.name, hence the expression was resolved to undefined.

在第三种情况下，重复相同的步骤，只是这次u2 did的原型有一个name属性，所以表达式解析为什么.就这么简单，真的.
好吧，公平地说，我也花了一些时间来适应这一点，但是一旦你明白了，这就是纯粹的逻辑.

In the third case, the same steps were repeated, only this time the prototype of u2 did have a name property, so that's what the expression was resolved to. It's as simple as that, really.
Ok, to be fair, it took me some time to get used to this, too, but once you get it, it's pure logic.

顺便说一句，我在这里制作的图表是所谓的原型链"的直观表示.从u2的角度来看，链是u1 ->对象，它根本不是一个很大的链(以防你担心):它与Array 实例的链非常相似:

BTW, the diagram I made here is a visual representation of what is referred to as "the prototype-chain". From the viewpoint of u2, the chain is u1 -> Object, which isn't a very large chain at all (in case you were worried): it's very similar to the chain of an Array instance:

console.log(Object.getPrototypeOf(Array.prototype));//Logs Object

因此，数组实例的原型链，比如 var foo = [];) 看起来像这样:

Hence, the prototype chain of an array instance, say var foo = [];) looks like this:

Array.prototype => Object.prototype

这意味着:

foo = []
foo[123];//does not exists

通过原型链触发类似的查找，以便表达式解析为 undefined:

Triggers a similar lookup through the prototype chain in order for the expression to resolve to undefined:

foo[123] ===> 123 is coerced to string first BTW  <------------||
    || --> property not found @instance, check Array.prototype ||
    ===========> Array.prototype[123] not found                ||
         ||                                                    ||
         ==========> no Object.prototype[123]: check prototype ||
             ||                                                ||
             =======>prototype of object.prototype is null, return undefined

这篇关于关于原型函数的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！