首页 / JAVASCRIPT / JavaScript：对象继承自Function.prototype

JavaScript：对象继承自Function.prototype

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了JavaScript：对象继承自Function.prototype，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含6615字，纯文字阅读大概需要10分钟。

内容图文

我正在测试James Shore的Object Playground,我发现所有方法都继承自Function.prototype,包括全局Object.prototype上的方法.这是如何运作的？那不是通函吗？我的意思是… Object.prototype固有的Function.prototype不是“自身”吗？那么Object如何从Function.prototype继承任何东西呢？函数不仅是Object的子类型吗？对象不应该固有地包含这些行为吗？为什么需要这种继承？

解决方法:

TL; DR

Object.prototype是原型链中的最后一个,它不继承任何东西. Object构造函数是从Function.prototype继承的,因为它只是一个函数.这是一个Function实例.

长版

由于您的问题是一个笼统的问题,因此我将尝试描述一些主题,希望您能回答自己的问题.以下是我将尝试涵盖的主题：

>使用“原型”一词的两种方法.
>如何在JavaScript中创建类.
>功能与方法对象构造函数相关.

注意：很难解释JavaScript的真正工作原理.我希望您能从中学到一些东西.

使用“原型”一词的两种方法

在JavaScript中,“原型”一词可能会有些混乱.这是因为根据上下文,至少有两种使用该词的方法：

1)“另一个对象的原型对象”

另一个对象的原型对象也称为“内部原型”,表示为[[Prototype]]或__proto__；他们都是同一件事.作为示例,我们使用以下数组：nums = [9,8,7];.我们说nums是一个数组…但是为什么呢？

>我们说这是一个数组,因为它是Array构造函数的一个实例(构造函数只是函数,除了我们将它们与new关键字一起使用外).
>我们也说这是一个数组,因为它的原型对象(也称为“内部原型”)是包含在Array.prototype属性内部的对象.

2)“构造函数的原型属性”

继续nums数组示例,Array构造函数具有一个名为prototype的属性,我们可以像这样访问它：Array.prototype.此属性是Array实例的“内部原型”,并提供了我们用于调用数组的所有方法-例如forEach,push,pop,join等.

因此,同样,我的函数foo()或其他任何函数的内部原型都是包含在Function.prototype属性内部的对象.换句话说,Function.prototype是任何函数的“内部原型”对象.同样,我们可以说Function构造函数具有prototype属性,该属性最终是所有函数的“内部原型”.

我要讲的是我们用两种不同的方式谈论一件事(原型).第一种方法是说：对象的“原型/内部原型”,第二种方法是说：“构造函数的原型”属性.

如何在JavaScript中创建类

在JavaScript中,构造函数类似于其他编程语言中的类.好吧,不完全是.实际上,类似于类,JavaScript使用构造函数和另一个称为原型的对象的组合.实际上,每个JavaScript函数都会自动获取原型属性,因为该函数可以用作构造函数或简单地用作函数.当一个函数不被用作构造函数时,它的prototype属性不用于任何东西,而只是悬而未决.

在古典语言中,类同时包含实例变量和实例方法,但是在JavaScript中,构造函数包含实例变量,而其原型对象包含实例方法.

实例变量对于构造函数的特定实例是唯一的(它们包含实例特定的数据),并且实例方法由所有实例共享.换句话说,所有实例都可以执行实例方法,但不能互相访问变量.

因此,JavaScript中的所有对象都是其各自的构造函数的实例.例如,诸如[1,2,3]的数组是Array(){}函数构造函数的实例.诸如{key：’value’}之类的对象是Object(){}函数构造函数的实例. JavaScript函数(例如alert())是Function(){}构造函数的实例……等等.

同样,JavaScript中的所有构造函数都具有prototype属性,并且此属性包括构造函数实例将继承的方法.

例：

// Person constructor to create people instances
function Person(name, age) {
  // Every instance has its own "instance variables", a.k.a. properties. 
  this.name = name;
  this.age  = age;
}


// The "instance methods"
Person.prototype = {
  greet: function() {
    return 'Hello ' + this.name;
  },
  //...
};


// Joe is an instance of the `Person` constructor, and Joe's "prototype"
// is the `Person.prototype` object. We call Joe's "prototype" the 
// "internal prototype". 
var joe = new Person('Joe Doe', 44);
joe.name; //=> Joe Doe
joe.greet(); //=> Hello Joe Doe

功能与方法对象构造函数相关

对象构造函数.

Object构造函数与上面的Person构造函数一样,除了它创建对象实例而不是person实例.

函数构造函数.

Function构造函数就像Person&上面的对象构造函数,除了它创建Function实例,换句话说,它创建函数.

JavaScript中的所有构造函数(例如Person,Object,Array,Function,String,Boolean等)都是函数.由于它们是函数,这意味着它们是使用该语言在内部使用新的Function创建的,并且所有函数方法(如call()和apply())都来自Function.prototype.换句话说,Function.prototype是所有函数的“原型/内部原型”对象,包括构造函数和函数Function本身.

结论：

不要混淆构造函数的prototype属性,该属性包括将来的实例将使用的方法,以及构造函数本身的内部原型.

但是,请记住,构造函数的prototype属性是该构造函数实例的内部[[Prototype]].例如,Function.prototype是Object构造函数的内部[[Prototype]],这很有意义,因为Object构造函数只是另一个函数(一个Function实例).

对于代码结论,请看一下对象与对象之间的关系.函数构造函数是在JavaScript内部创建的：

// Object constructor
// ==============================================
function Object() { /* ... */ }
// Object.keys()
// Object.observe()
// ...


// `Object.__proto__` (internal [[Prototype]])
// -----------------------------------------------
// Since `Object` is a function, it inherits all of Function's 
// instance methods (the ones inside of Function.prototype). 
// 
// In other words the `Object` constructor can use methods 
// like `apply()`, `call()`, `bind()`, and more.
// 
// So we can say that the Object's prototype is the 
// `Function.prototype` object.
Object.__proto__ = Function.prototype;


// `Object.prototype` (instance methods)
// -----------------------------------------------
// The Object's `prototype` property is totally different from  
// the `__proto__` property. This `prototype` property includes 
// methods that all JavaScript objects inherit. So an object
// literal like `var obj = {}` or an array like `var arr = []` 
// or even a function like `alert` can use these methods.
Object.prototype = {
  constructor: Object,
  hasOwnProperty: function() {},
  isPrototypeOf: function() {},
  //...
};



// Function constructor
// ==============================================
function Function() { /* ... */ }
// Function.call()
// Function.apply()
// ...


// [[Prototype]]  +  instance methods
// -----------------------------------------------
// Since `Function` is a function itself and at the same time 
// the constructor for other JavaScript functions, its internal
// [[Prototype]] and the `prototype` property point to the same 
// exact object.
Function.__proto__ = Function.prototype = {
  apply: function() {},
  call: function() {},
  bind: function() {},

  //...

  // Just an object literal, so it inherits the 
  // Object's instance methods.
  __proto__: Object.prototype
};

更多资源

> https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Determining_instance_relationships
> https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype
> https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/proto
> https://es5.github.io/#x15.3.4
> http://people.mozilla.org/~jorendorff/es5.1-final.html#sec-15.3.2.1；将为每个函数自动创建一个原型属性,以提供将该函数用作构造函数的可能性.
> https://www.quora.com/In-JavaScript-what-is-the-logic-behind-the-data-structure-of-function-prototype-proto-and-constructor?share=1

内容总结

以上是互联网集市为您收集整理的JavaScript：对象继承自Function.prototype全部内容，希望文章能够帮你解决JavaScript：对象继承自Function.prototype所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/661452.html

来源：【匿名】