javascript自定义对象

摘自MDN

自定义对象

在经典面向对象语言中，对象是指数据和在这些数据上进行的操作的集合。那么让我们来定义一个人名对象，他包括人的姓和名两个域（field）。名字的表示有两种方法：“姓 名”或“名，姓”。

function makePerson(first, last) {    return {        first: first,        last: last    }}function personFullName(person) {    return person.first + ' ' + person.last;}function personFullNameReversed(person) {    return person.last + ', ' + person.first}> s = makePerson("Simon", "Willison");> personFullName(s)Simon Willison> personFullNameReversed(s)Willison, Simon

上面的写法可以满足需要，但是看起来很笨拙。你将会在全局名字空间中写很多函数。我们真正需要的其实是如何使一个函数隶属于一个对象。而函数本身就是对象，那么很容易得到如下示例：

function makePerson(first, last) {    return {        first: first,        last: last,        fullName: function() {            return this.first + ' ' + this.last;        },        fullNameReversed: function() {            return this.last + ', ' + this.first;        }    }}> s = makePerson("Simon", "Willison")> s.fullName()Simon Willison> s.fullNameReversed()Willison, Simon

这里出现了一些我们之前没有见过的东西：关键字'this'，它被使用在函数体内，'this'指代当前的对象，也就是指是在哪个对象里调用了那个函数。如果你在一个对象上使用点或者花括弧，那么这个对象就成为了'this'。如果并没有使用“点”操作符来调用，那么'this'将指向全局对象（global object）。这是一个很常出错的地方。例如：

> s = makePerson("Simon", "Willison")> var fullName = s.fullName;> fullName()undefined undefined

当我们调用fullName()时，'this'实际上是指向全局对象的。而并没有名为first或last的全局变量，那么它们两个的返回值都会是undefined。

下面我们将使用关键字'this'的优势来改进我们的makePerson函数：

function Person(first, last) {    this.first = first;    this.last = last;    this.fullName = function() {        return this.first + ' ' + this.last;    }    this.fullNameReversed = function() {        return this.last + ', ' + this.first;    }}var s = new Person("Simon", "Willison");

我们引入了另外一个关键字：'new'，它和'this'密切相关。它的作用是创建一个崭新的空对象，然后使用指向那个对象的'this'调用制定的函数。被'new'调用的函数成为构造函数。习惯的做法是将这些函数的首字母大写，这样用new调用他们的时候就容易识别了

那么我们的人名对象可以进一步完善了，但还是它们有一些不太好的角落。每次我们创建一个人名对象的时候，我们都在其中创建了两个新的函数对象--那么如果这个代码可以共享不是会更好么？

function personFullName() {    return this.first + ' ' + this.last;}function personFullNameReversed() {    return this.last + ', ' + this.first;}function Person(first, last) {    this.first = first;    this.last = last;    this.fullName = personFullName;    this.fullNameReversed = personFullNameReversed;}

这种写法好在：我们只创建一次方法函数，在构造器中调用它们。那是否还有更好的方法呢？答案是肯定的。

function Person(first, last) {    this.first = first;    this.last = last;}Person.prototype.fullName = function() {    return this.first + ' ' + this.last;}Person.prototype.fullNameReversed = function() {    return this.last + ', ' + this.first;}

Person.prototype是一个可以被Person的所有实例共享的对象。它是一个名叫"prototype chain"的查询链的一部分：当你企图取得一个Person并没有定义的原型时，JavaScript会先检查这个Person.prototype来判断是否存在。所以，任何赋与 Person.prototype 的东西都会为所有通过 this 对象构造的实例可用。

这个工具功能十分强大，JavaScript允许你在程序中的任何时候修改原型（prototype）中的一些东西。也就是说你可以在运行时给已存在的对象添加格外的方法：

> s = new Person("Simon", "Willison");> s.firstNameCaps();TypeError on line 1: s.firstNameCaps is not a function> Person.prototype.firstNameCaps = function() {    return this.first.toUpperCase()}> s.firstNameCaps()SIMON

有趣地是，你还可以给JavaScript的内置函数的原型（prototype）添加东西。让我们给String添加一个方法用来返回逆序的字符串：

> var s = "Simon";> s.reversed()TypeError on line 1: s.reversed is not a function> String.prototype.reversed = function() {    var r = "";    for (var i = this.length - 1; i >= 0; i--) {        r += this[i];    }    return r;}> s.reversed()nomiS

我们的新方法也可以在字符串文本化定义语法（string literals）

> "This can now be reversed".reversed()desrever eb won nac sihT

正如我前面提到的，原型是组成链的一部分。那个链的根节点是Object.prototype，它包括了一个toString()方法--这个方法是在你试图将一个对象展现为字符串时调用的。这对于调试我们的Person对象很有用：

> var s = new Person("Simon", "Willison");> s[object Object]> Person.prototype.toString = function() {    return '<Person: ' + this.fullName() + '>';}> s<Person: Simon Willison>

你是否还记得之前我们说的avg.apply()中的那个第一个参数null？那我们可以回过头来看一看。apply()的第一个参数应该是一个被当作'this'来看待的对象。比如，下面是一个 'new'方法的简单实现：

function trivialNew(constructor) {    var o = {}; // Create an object    constructor.apply(o, arguments);    return o;}

这并不是一个new的精确副本，因为它并没有创建原型（prototype）链。想举例说明apply()有些困难，因为它并不是你会经常使用的函数，但是了解它还是很有用的。

apply()有一个姐妹函数，名叫call，它也可以允许你设置'this'，但是带有一个扩展的参数列表，而不是一个数组。

function lastNameCaps() {    return this.last.toUpperCase();}var s = new Person("Simon", "Willison");lastNameCaps.call(s);// Is the same as:s.lastNameCaps = lastNameCaps;s.lastNameCaps();