为什么使用速记方法语法的方法不包含原型对象 [英] Why does a method using the shorthand method syntax not contain a prototype object

问题描述

在下面的代码片段中， func2 应该是

我看了这个和 __ proto __ 和原型之间区别的proto-vs-prototype-in​​-javascript>这个问题但我的问题是关于为什么在使用一个应该等效的语法后，后者不存在的原因。

解决方法案

为什么 obj1.bar 包含 .prototype 对象和 obj2.bar 不？

因为它是方法定义。方法不是构造函数，它们不需要构造函数。 （ class 方法和用于箭头功能，顺便说一句。）

在 obj2 中你使用了一个函数表达式，它创建一个可以用作构造函数的函数（在ES5中一直如此）。

这三个对象都是原型对象吗？

对象不是原型对象 。每个对象都可以用作其他对象的原型。

为什么 obj2的事实。 bar 没有 .prototype 不会影响它绑定它的方式？

为什么会这样？它仍然是一个应该具有动态此值的方法，否则无法共享。

仅限您在 obj3 中使用的箭头函数在这方面有特殊行为。有关详细信息，请参阅 ES6对象中的方法：使用箭头功能。

In the code snippet below func2 is supposed to be the shorthand method syntax for func1.

Question 1: Why does obj1 contain the prototype Object and obj2 does not (while both have the __proto__ object)?

Question 2: Are all three objects prototype objects?

Question 3: Why does the fact of obj2 not having a prototype function not influence the way in which it binds this?

Concerning obj3: obj3 is there for reference because it is equivalent to obj2 in terms of not having a prototype function. It just binds this differently (In obj1 and obj1 this is determined "by the invocation, but not by the enclosing context" and in obj3 this is lexically bound to the window object. Both is nicely described in this article.).

The code snippet:

// Using the basic method definition
const obj1 = {
  foo: function() {
    console.log("This is foo");
  },
  bar: function() {
    console.log("This is bar");
    this.foo();
  }
};

// Using shorthand method syntax
const obj2 = {
  foo() {
    console.log("This is foo");
  },
  bar() {
    console.log("This is bar");
    this.foo();
  }
};

// Using arrow function
const obj3 = {
  foo: () => console.log("This is foo"),
  bar: () => {
    console.log("This is bar"); this.foo();
  }
};


/* Test */
obj1.bar(); // works!
obj2.bar(); // works!
obj3.bar(); // throws TypeError (this.foo is not a function)

How I found that func1 is a prototype function and func2 not:

I looked at both in the console of Chrome Dev Tools and found the prototype object only contained in one of them:

I looked at this and this question about the difference between __proto__ and prototype but my question here is about why the later is not present after using a syntax which should be equivalent.

解决方案

Why does obj1.bar contain the .prototype Object and obj2.bar does not?

Because it's a method definition. Methods are no constructors, they don't need one. (It's the same for class methods and for arrow functions, btw.)
In obj2 you used a function expression, which creates a function that can be used as a constructor (as has been always the case in ES5).

Are all three objects prototype objects?

An object is not a "prototype object". Every object can be used as the prototype of some other object or not.

Why does the fact of obj2.bar not having a .prototype not influence the way in which it binds this?

Why would it? It's still a method that is supposed to have a dynamic this value, otherwise it could not be shared.

Only the arrow functions that you used in obj3 have special behaviour in this regard. See Methods in ES6 objects: using arrow functions for details.

这篇关于为什么使用速记方法语法的方法不包含原型对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！