《JavaScript语言精粹》读书笔记(一)零散记录

Published: 2015-12-21

Tags: Javascript

本文总阅读量
  1. 6个为假条件

  2. typeof()测试类型

  3. 操作符“||”与“&&”

  4. Javascript四种调用模式


1. 6个为假条件

  • false
  • 0
  • null
  • undefined
  • NaN
  • ''

其它任何值均为真

2. typeof()测试类型

  • number
  • string
  • boolean
  • undefined
  • function
  • object

注意事项: 当数据为数组或者null时typeof的值为object

3. 操作符“||”与“&&”

fight.equipment     // undefined
fight.equipment.model     // throw "TypeError"
fight.equipment && fight.equipment.model   // undefined

var middle = stooge["middle-name"] || "none";

还有一个需要值的注意的地方,就是对象获取数据点与中括号,一般情况下建议使用点,当名字中包含减号时使用中括号

4. Javascript四种调用模式

调用一个函数会暂停当前行数的执行,传递控制权和参数给新函数。除了声明时定义的形式参数,每个函数还接收两个附加的参数:this和arguments。参数this在面向对象编程中非常重要,它的值取决于调用的模式。在JavaScript中一共有4中调用模式:方法调用模式、函数调用模式、构造器调用模式和apply调用模式。这些模式在如何初始化关键参数this上存在差异。

(1)方法调用模式

当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时,this被绑定到该对象。如果调用包含一个提取属性的动作(即包含一个. 点表达式或[subscript]下标表达式),那么它就是被当做一个方法来调用。

var myObject = {
  value: 0,
  increment: function (inc) {
    this.value += typeof inc === 'number' ? inc : 1;
  }
}

myObject.increment();
console.log(myObject.value);

myObject.increment(2);
console.log(myObject.value);

(2) 函数调用模式

当一个函数并非一个对象的属性时,那么它就是被当做一个函数来调用的

var sum = add(3, 4);   // sum的值为7

以此模式调用函数时,this被绑定到全局对象。这是语言设计上的一个错误。倘若语言设计正确,那么当内部函数被调用时,this应该仍然绑定到外部函数的this变量。这个设计错误的后果就是方法不能利用内部函数来帮助它工作,因为内部函数的this被绑定了错误的值,所以不能共享该方法对对象的访问权。幸运的是,又一个很容易的解决方案:如果该方法定义一个变量并给它赋值为this,那么内部函数就可以通过那个变量访问到this。按照约定,我把那个变量命名为that

举个栗子

var add = function(a, b) {
    return a + b;
}

var myObject = {
    value:3
};

myObject.func = function() {
    console.log(myObject.value);
    var helper = function() {
        this.value = add(this.value, this.value);
    }
  // 函数调用模式
  helper();
}

// 方法调用模式
myObject.func();

console.log(myObject.value);

在这个例子中,函数中调用方法,this就不会正确的指向这个函数,第一个console记录的是4,但是在helper方法中则this指的是window(在node中为global),所以是undefined,解决方法如下:

var add = function(a, b) {
    return a + b;
}

var myObject = {
    value:3
};

myObject.func = function() {
    var that = this;
    var helper = function() {
        that.value = add(that.value, that.value);
    }
  // 函数调用模式
  helper();
}

// 方法调用模式
myObject.func();

console.log(myObject.value);

通过这种方法,就能成功的让helper函数也能正确的使用this了

我的理解就是,通过方法调用模式this不丢失,函数调用模式则会则会丢失,那么这里的that作用就是作为中转,因为相对于func函数,这个helper也是func函数的方法,那么这个helper当然可以使用func函数中定义的变量。于是可以获得that,也就是myObject里的this,不知道这么理解对不对

(3) 构造器调用模式

如果在一个函数前面带上new来调用,那么背地里将会创建一个连接到该函数得prototype成员得新对象,同时this会被绑定到那个新对象上。

// 创造一个名为Quo的构造器函数。它构造一个带有status属性的对象
var Quo = function (string) {
  this.status = string;
}

// 给Quo的所有实例提供一个名为get_status的公共方法。
Quo.prototype.get_status = function () {
  return this.status;
}

// 构造一个Quo实例
var myQuo = new Quo('ok');

// 输出测试
console.log(myQuo.get_status());

一个函数,如果创建的目的就是希望结合new前缀来调用,那它就被称为构造器函数。作者不推荐使用这种形式的构造器函数。

(4)Apply调用模式

apply方法让我们构建一个参数数组传递给调用函数。它也容许我们选择this的值。apply方法接收两个参数,第1个是要绑定给this的值,第2个就是一个参数数组。

// 创造一个包含status成员的对象。
var statusObject = {
  status: 'A-ok'
}

// statusObject并没有继承自Quo.prototype,但我们可以在statusObject上调用get_status方法
// 尽管statusObject没有一个名为get_status的方法。
var status = Quo.prototype.get_status.apply(statusObject);
console.log(status);

如上的代码将statusObject绑定到了this上

关于apply的还可以发散一下,进一步了解call,apply和bind,这里就不展开了,令起一篇文章记录