首先,请记住 JavaScript 主要是一种原型语言,而不是基于类的语言1。Foo
不是一个类,它是一个函数,它是一个对象。您可以使用关键字从该函数实例化一个对象,new
这将允许您创建类似于标准 OOP 语言中的类的东西。
我建议__proto__
大多数时候忽略它,因为它的跨浏览器支持很差,而是专注于了解prototype
工作原理。
如果你有一个从函数2创建的对象的实例,并且你以任何方式访问它的一个成员(方法、属性、属性、常量等),访问将沿着原型层次向下流动,直到它(a)找到成员,或 (b) 没有找到另一个原型。
层次结构从被调用的对象开始,然后搜索其原型对象。如果原型对象有原型,则重复,如果不存在原型,undefined
则返回。
例如:
foo = {bar: 'baz'};
console.log(foo.bar); // logs "baz"
foo = {};
console.log(foo.bar); // logs undefined
function Foo(){}
Foo.prototype = {bar: 'baz'};
f = new Foo();
console.log(f.bar);
// logs "baz" because the object f doesn't have an attribute "bar"
// so it checks the prototype
f.bar = 'buzz';
console.log( f.bar ); // logs "buzz" because f has an attribute "bar" set
在我看来,您至少已经对这些“基本”部分有所了解,但为了确定起见,我需要将它们明确化。
在 JavaScript 中,一切都是对象3。
一切都是对象。
function Foo(){}
不只是定义一个新函数,它还定义了一个可以使用Foo
.
这就是为什么您可以使用 访问Foo
的原型Foo.prototype
。
你也可以做的是设置更多的功能上Foo
:
Foo.talk = function () {
alert('hello world!');
};
可以使用以下方法访问此新功能:
Foo.talk();
我希望现在您已经注意到函数对象上的函数和静态方法之间的相似性。
可以将其f = new Foo();
视为创建类实例、Foo.prototype.bar = function(){...}
为类定义共享方法以及为类Foo.baz = function(){...}
定义公共静态方法。
ECMAScript 2015 为这些类型的声明引入了各种语法糖,使它们更易于实现,同时也更易于阅读。因此,前面的示例可以写为:
class Foo {
bar() {...}
static baz() {...}
}
这允许bar
被称为:
const f = new Foo()
f.bar()
并被baz
称为:
Foo.baz()
1:class
是 ECMAScript 5 规范中的“未来保留字”,但 ES6 引入了使用class
关键字定义类的能力。
2:本质上是一个由构造函数创建的类实例,但是有很多细微差别我不想误导你
3:原始值——包括undefined
、null
、布尔值、数字和字符串——在技术上不是对象,因为它们是低级语言实现。布尔值、数字和字符串仍然像对象一样与原型链交互,因此就本答案而言,即使它们不完全是“对象”,也更容易将它们视为“对象”。