第三章 直接量和构造函数

// start with an empty object
var dog = {};
// add one property
dog.name = "Benji";
// now add a method
dog.getName = function () {
    return dog.name;
};

dog.getName = function () {
    // redefine the method to return
    // a hardcoded value
    return "Fido";
};

delete dog.name;

dog.say = function () {
    return "Woof!";
};
dog.fleas = true;

var dog = {
    name: "Benji",
    getName: function () {
        return this.name;
    }
};

在本书中多次提到“空对象”（“blank object”和“empty object”）。这只是某种简称，要知道JavaScript中根本不存在真正的空对象，理解这一点至关重要。即使最简单的{}对象包含从Object.prototype继承来的属性和方法。我们提到的“空（empty）对象”只是说这个对象没有自己的属性，不考虑它是否有继承来的属性。

• 将对象主体包含在一对花括号内（{ and }）。
• 对象内的属性或方法之间使用逗号分隔。最后一个名值对后也可以有逗号，但在IE下会报错，所以尽量不要在最后一个属性或方法后加逗号。
• 属性名和值之间使用冒号分隔
• 如果将对象赋值给一个变量，不要忘了在右括号}之后补上分号

// one way -- using a literal
var car = {goes: "far"};
// another way -- using a built-in constructor
// warning: this is an antipattern
var car = new Object();
car.goes = "far";

// Warning: antipatterns ahead
// an empty object
var o = new Object();
console.log(o.constructor === Object); // true
// a number object
var o = new Object(1);
console.log(o.constructor === Number); // true
console.log(o.toFixed(2)); // "1.00"
// a string object
var o = new Object("I am a string");
console.log(o.constructor === String); // true
// normal objects don't have a substring()
// method but string objects do
console.log(typeof o.substring); // "function"
// a boolean object
var o = new Object(true);
console.log(o.constructor === Boolean); // true

var adam = new Person("Adam");
adam.say(); // "I am Adam"

var Person = function (name) {
    this.name = name;
    this.say = function () {
        return "I am " + this.name;
    };
};

• 创建一个空对象，将它的引用赋给this，继承函数的原型。
• 通过this将属性和方法添加至这个对象
• 最后返回this指向的新对象（如果没有手动返回其他的对象）

var Person = function (name) {
    // create a new object
    // using the object literal
    // var this = {};
    // add properties and methods
    this.name = name;
    this.say = function () {
        return "I am " + this.name;
    };
    //return this;
};

Person.prototype.say = function () {
    return "I am " + this.name;
};

// var this = {};

// var this = Object.create(Person.prototype);

var Objectmaker = function () {
    // this `name` property will be ignored
    // because the constructor
    // decides to return another object instead
    this.name = "This is it";
    // creating and returning a new object
    var that = {};
    that.name = "And that's that";
    return that;
};
// test
var o = new Objectmaker();
console.log(o.name); // "And that's that"

// constructor
function Waffle() {
    this.tastes = "yummy";
}
// a new object
var good_morning = new Waffle();
console.log(typeof good_morning); // "object"
console.log(good_morning.tastes); // "yummy"
// antipattern:
// forgotten `new`
var good_morning = Waffle();
console.log(typeof good_morning); // "undefined"
console.log(window.tastes); // "yummy"

function Waffle() {
var that = {};
    that.tastes = "yummy";
    return that;
}

function Waffle() {
    return {
        tastes: "yummy"
    };
}

var first = new Waffle(),
    second = Waffle();
console.log(first.tastes); // "yummy"
console.log(second.tastes); // "yummy"

需要注意的是，这里用的that只是一种命名约定，that不是语言的保留字，可以将它替换为任何你喜欢的名字，比如self或me。

function Waffle() {
    if (!(this instanceof Waffle)) {
        return new Waffle();
    }
    this.tastes = "yummy";
}
Waffle.prototype.wantAnother = true;
// testing invocations
var first = new Waffle(),
    second = Waffle();
console.log(first.tastes); // "yummy"
console.log(second.tastes); // "yummy"
console.log(first.wantAnother); // true
console.log(second.wantAnother); // true

if (!(this instanceof arguments.callee)) {
    return new arguments.callee();
}

// array of three elements
// warning: antipattern
var a = new Array("itsy", "bitsy", "spider");
// the exact same array
var a = ["itsy", "bitsy", "spider"];
console.log(typeof a); // "object", because arrays are objects
console.log(a.constructor === Array); // true

// an array of one element
var a = [3];
console.log(a.length); // 1
console.log(a[0]); // 3
// an array of three elements
var a = new Array(3);
console.log(a.length); // 3
console.log(typeof a[0]); // "undefined"

// using array literal
var a = [3.14];
console.log(a[0]); // 3.14
var a = new Array(3.14); // RangeError: invalid array length
console.log(typeof a); // "undefined"

有些人用Array()构造器来做一些有意思的事情，比如用来生成重复字符串。下面这行代码返字符串包含255个空格（请读者思考为什么不是256个空格）。var white = new Array(256).join(' ');

console.log(typeof [1, 2]); // "object"

Array.isArray([]); // true
// trying to fool the check
// with an array-like object
Array.isArray({
    length: 1,
    "0": 1,
    slice: function () {}
}); // false

if (typeof Array.isArray === "undefined") {
    Array.isArray = function (arg) {
        return Object.prototype.toString.call(arg) === "[object Array]";
    };
}

{"name": "value", "some": [1, 2, 3]}

// an input JSON string
var jstr = '{"mykey": "my value"}';
// antipattern
var data = eval('(' + jstr + ')');
// preferred
var data = JSON.parse(jstr);
console.log(data.mykey); // "my value"

// an input JSON string
var jstr = '{"mykey": "my value"}';
// parse the string and turn it into an object
// using a YUI instance
YUI().use('json-parse', function (Y) {
    var data = Y.JSON.parse(jstr);
    console.log(data.mykey); // "my value"
});

// an input JSON string
var jstr = '{"mykey": "my value"}';
var data = jQuery.parseJSON(jstr);
console.log(data.mykey); // "my value"

var dog = {
    name: "Fido",
    dob:new Date(),
    legs:[1,2,3,4]
};
var jsonstr = JSON.stringify(dog);
// jsonstr is now:
// {"name":"Fido","dob":"2010-04-11T22:36:22.436Z","legs":[1,2,3,4]}

• 使用new RegExp()构造函数
• 使用正则表达式直接量

// regular expression literal
var re = /\\/gm;
// constructor
var re = new RegExp("\\\\", "gm");

• g，全局匹配
• m，多行匹配
• i，忽略大小写的匹配

var re = /pattern/gmi;

var no_letters = "abc123XYZ".replace(/[a-z]/gi, "");
console.log(no_letters); // 123

function getRE() {
    var re = /[a-z]/;
    re.foo = "bar";
    return re;
}
var reg = getRE(),
    re2 = getRE();
console.log(reg === re2); // true
reg.foo = "baz";
console.log(re2.foo); // "baz"

在ECMAScript5中这种情形有所改变，相同正则表达式直接量的每次计算都会创建新的实例对象，目前很多现代浏览器也对此做了纠正（译注：比如在Firefox4就纠正了Firefox3.6的这种“错误”）。

// a primitive number
var n = 100;
console.log(typeof n); // "number"
// a Number object
var nobj = new Number(100);
console.log(typeof nobj); // "object"

// a primitive string be used as an object
var s = "hello";
console.log(s.toUpperCase()); // "HELLO"
// the value itself can act as an object
"monkey".slice(3, 6); // "key"
// same for numbers
(22 / 7).toPrecision(3); // "3.14"

// avoid these:
var s = new String("my string");
var n = new Number(101);
var b = new Boolean(true);
// better and simpler:
var s = "my string";
var n = 101;
var b = true;

// primitive string
var greet = "Hello there";
// primitive is converted to an object
// in order to use the split() method
greet.split(' ')[0]; // "Hello"
// attemting to augment a primitive is not an error
greet.smile = true;
// but it doesn't actually work
typeof greet.smile; // "undefined"

typeof Number(1); // "number"
typeof Number("1"); // "number"
typeof Number(new Number()); // "number"
typeof String(1); // "string"
typeof Boolean(1); // "boolean"

• name：name属性是指创建这个对象的构造函数的名字，通常是“Errora”，有时会有特定的名字比如“RangeError”
• message：创建这个对象时传入构造函数的字符串

try {
    // something bad happened, throw an error
    throw {
        name: "MyErrorType", // custom error type
        message: "oops",
        extra: "This was rather embarrassing",
        remedy: genericErrorHandler // who should handle it
    };
} catch (e) {
    // inform the user
    alert(e.message); // "oops"
    // gracefully handle the error
    e.remedy(); // calls genericErrorHandler()
}

• 对象直接量写法——一种简洁优雅的定义对象的方法，名值对之间用逗号分隔，通过花括号包装起来
• 构造函数——内置构造函数（内置构造函数通常都有对应的直接量语法）和自定义构造函数。
• 一种强制函数以构造函数的模式执行（不管用不用new调用构造函数，都始终返回new出来的实例）的技巧
• 数组直接量写法——数组元素之间使用逗号分隔，通过方括号括起来
• JSON——是一种轻量级的数据交换格式
• 正则表达式直接量
• 避免使用其他的内置构造函数：String()、Number()、Boolean()以及不同种类的 Error() 构造器