读《JS高级程序设计》笔记

617 阅读9分钟

以下内容为读《JavaScript高级程序设计》的一些笔记。如有不对的地方,欢迎指正。

数据类型

  • 简单数据类型:Undefined、Null、Boolean、Number、String
  • 复杂数据类型:Object

typeOf操作符

  • 调用typeOf null会返回'object',因为特殊值null被认为是一个空对象引用

Undefined

  • 在使用var声明变量但未对其加以初始化时,这个变量的值就是undefined

    var message;       // 变量声明之后默认取得了undefined值
    
    // 下面这个变量没有被声明
    // var age;
    
    alert(message);    // "undefined"
    alert(age);        // 产生错误,"Not Found"
    
  • 尚未声明的变量只有执行一项操作,即typeOf操作符检测其数据类型,返回undefined

Null

  • null值表示一个空对象指针,所以用typeOf判断其类型,返回值为"object"

  • 实际上,undefined值是派生自null值的,因此:

    alert(null == undefined);   // true
    

Boolean

  • Boolean类型的字面值true和false是区分大小写的,True和False都不是Boolean值,只是标识符
  • 将一个值转换为其对应的Boolean值,可以调用转型函数Boolean()

Number

  • 最基本的格式是十进制,还有八进制(以8为基数)、十六进制(以16为基数)

    1. 浮点数

      • 保存浮点数值需要的内存空间是整数值得两倍,条件允许的情况下会自动转换为整数值

      • 极大、极小的数值可以使用科学计数法,如:

        var floatNum = 3.125e7;    // 等于31250000,相当于 3125 * 10000000
        
    2. 数值范围

      • -Infinity(负无穷),访问Number.MIN_VALUE可得到
      • Infinity(正无穷),访问Number.MAX_VALUE可得到
      • isFinite()函数用于判断一个数值是否有穷(即是不是位置最小和最大数值之间)
    3. NaN

      • 即非数值,是一个特殊的数值,这个数值用于一个本来要返回数值的操作,未返回数值的情况(这样就不会抛出错误了)
      • NaN与任何值都不相等,包括NaN自身
      • isNan()函数接受一个参数,该参数可以为任何类型,确定这个函数是否为NaN
    4. 数值转换

      • 转型函数Number()可以用于任何数据类型,ParseInt()ParseFloat()函数专门用于把字符串转为数值

      • Number(null)返回0,Number(undefined)返回NaN

      • parseInt()会忽略字符串前面的空格,直到找到第一个非空格字符。如果第一个字符不是数字或者负号,则返回NaN,所以paresInt('')返回NaN。如果第一个参数是进制形式,那可以传入第二个参数:使用的基数(即多少进制)

        var num = parseInt('0xAF', 16);    // 175
        
      • parseFloat()没有第二个参数所以十六进制始终为0,第一个小数点是有效的,之后的小数点都是无效的,会忽略前导0

        var num1 = parseFloat('123blue');  // 123
        var num2 = parseFloat('0xA');      // 0
        var num3 = parseFloat('22.5');     // 22.5
        var num3 = parseFloat('22.34.5');  // 22.34
        var num4 = parseFloat('0908.5');   // 908.5
        var num5 = parseFloat('3.125e7');  // 32150000
        

String

  • 用于表示有零或多个16位Unicode字符组成的字符序列,可以由双引号("")或单引号('')表示

    var str1 = "someText";
    var str2 = 'someText';
    
  • 任何字符串的长度都可以通过访问其length属性取得

    var text = 'text';
    alert(text.length);   // 4
    
  • 把一个值转换为字符串有两种方法:toString()String()

    var num = 10;
    alert(num.toString());  // '10'
    alert(String(num));     // '10'
    
  • 关于字符串的一个面试题:如何判断一个已知的字符串中出现最多的字符是哪个,出现的次数?

    // 已知字符串
    var str = 'abcaaaaaaaa';
    // 定义一个空对象
    var obj = {};
    // 使用for循环字符串
    for (var i = 0;i < str.length; i++) {
    	if (obj[str[i]]) {
        obj[str[i]] += 1;
      } else {
        obj[str[i]] = 1;
      }
    }
    
    /** 通过循环得到一个新的obj,格式如下:
    *	obj = {
    *	  a: 9,
    *   b: 1,
    *	  c: 1
    * };
    */
    
    // 定义一个最大值:max,一个拥有最多次数的名称:name
    var max = 0, name = '';
    for (var key in obj) {
    	if (obj[key] > max) {
        max = obj[key];
        name = key;
      }
    }
    // '出现次数最多的字符是:a,出现的次数为:9'
    alert('出现次数最多的字符是:' + name + ',' + '出现的次数为:' + max);
    

object类型

  • JS中的对象其实就是一组数据和功能的集合,对象可以通过执行new操作符后跟要创建的对象类型的名称来创建

    var o = new Object();
    
    • constructor():保存着用于创建当前对象的函数。
    • hasOwnProperty('name'):用于检查给定的属性在当前对象实例中是否存在
    • isPrototypeOf(object):用于检查传入的对象是否是当前对象的原型
    • propertyIsEnumerable('name'):用于检查给定的属性是否能够使用for-in语句
    • toLocaleString():返回对象的字符串表示,改字符串与执行环境的地区对应
    • toString():返回对象的字符串表示
    • valueOf():返回对象的字符串、数值或布尔值。通常与toString()方法的返回值相同

操作符

  • 只能操作一个值得操作符叫做一元操作符

    • 前置递增和递减,执行前置递增和递减操作时,变量的值都是在语句被求值以前改变的。(由于前置递增和递减操作与执行语句的优先级相等,因此整个语句是从左至右被求值)

      var age = 19;
      var nextAge = --age + 2;
      
      alert(age);      // 18
      alert(nextAge);  // 20
      
    • 后置递增和递减,执行后置递增和递减操作是,变量的值都是在语句被求职后才执行的

      var num1 = 2;
      var num2 = 20;
      var num3 = num1-- + num2;  // 22
      var num4 = num + num2;     // 21
      
    • 一元加和减操作符:减操作符主要用于表示负数。加操作符:在对给数值使用加操作符时,该操作会像Number()转型函数一样对这个值执行转换。

布尔操作符

  • 逻辑非操作符由一个叹号!表示。同时使用两个逻辑操作符,实际上就会模拟Boolean()转型函数的行为

    alert(!false);    // true
    alert(!true);     // false
    alert(!'blue');   // false
    alert(!0);        // true
    
    alert(!!'blue');  // true
    alert(!!0);       // false
    
  • 逻辑与操作符由两个和号&&表示。不能再逻辑与中使用为定义的值

    var result1 = true && false;   // false
    var result2 = true && true;    // true
    var result3 = false && false;  // false
    var result4 = false && true;   // false
    
  • 逻辑或操作符由两个竖线符号||表示。如果第一个操作数的就职结果为true,就不会对第二个操作数求值了

    var found = true;
    var result = found || someUndefinedThing;   // 不会报错
    alert(result);                              // true
    

乘性操作符

  • 乘法操作符由一个星号*表示,用于计算两个数值的乘积

    var result = 2 * 3;       // 6
    
  • 除法操作符由一个斜线符号/表示,执行第二个操作数除第一个操作数的计算

    var result = 66 / 11;     // 6
    
  • 求模(取余)操作符由一个百分号%表示

    var result = 26 % 5;      // 1
    

加性操作符

  • 加法操作符+

    var r1 = 1 + 2// 3
    var r2 = 1 + '2';    // '12'
    
    var num1 = 5, num2 = 10;
    var mes1 = '5 + 10 = ' + num1 + num2;   // '5 + 10 = 510'
    var mes2 = '5 + 10 = ' + (num1 + num2); // '5 + 10 = 15'
    
  • 减法操作符-

    var r1 = 2 - 1;         // 1
    var r2 = 5 - true;      // 4,true被转换成1
    var r3 = 5 - false;     // 5,false被转换成0
    var r4 = 5 - '';        // 5,''被转换成0
    var r5 = 5 - '2';       // 3,'2'被转换成2
    
    

关系操作符

  • 关系操作符:小于<、大于>、小于等于<=、大于等于>=

    var r1 = 5 < 3;    // false
    var r2 = 5 > 3;    // true
    var r3 = 5 >= 5;   // true
    var r4 = 5 <= 4;   // false
    

相等操作符

  • 相等不相等——先转换在比较,全等不全等——仅比较而不转换

  • 相等==、不相等!=,这两个操作符都会先转换操作数(通常称为强制转换),然后在比较他们的相等性

    null == undefined    // true
    true == 1            // true
    false = 0            // true
    NaN !== NaN          // true
    true !== 2           // true
    true !== 1           // false
    
  • 全等===、不全等!==

    '55' == 55           // true
    '55' === 55          // false
    '55' !== 55          // true
    null === undefined   // false
    

条件操作符

  • 下面代码的意思为:如果num1 > num2成立,则将num1赋值给max,否则将num2赋值给max,类似if(){}else{}

    var num1 = 5, num2 = 10;
    var max = (num1 > num2) ? num1 : num2;   // 10
    

赋值操作符

  • 简单的赋值操作符由等于号=表示,用就是把右侧的值赋给左侧的变量

    var num = 10;
    
  • 如果在等于号=前面在添加乘性操作符、加性操作符,就可以完成复核赋值的操作

    var num = 10;
    num += 10;        // 20
    
    var num1 = 10;
    num1 *= 10;       // 100
    
    var num2 = 10;
    num2 /= 10;       // 1
    
    var num3 = 10;
    num3 %= 10;       // 0
    

逗号操作符

  • 使用逗号操作符,可以在一条语句中执行多个参数

    var num1 = 1, num2 = 2, num3 = 3;
    

语句

if语句

  • if语句语法如下

    if (true) {
      // doSomeThings
    } else {
      // doSomeThings
    }
    
    // 多重判断可以使用 else if
    if (true) {
      // doSomeThings
    } else if (true) {
      // doSomeThings
    } else {
      // doSomeThings
    }
    

do-while语句

  • do-while语句是一种后测试循环语句,在对条件表达式求值之前,循环体内的代码至少会被执行一次

    var i = 0;
    do {
      i += 2;   // i = i + 2, 被执行一次
    } while (i > 10);
    alert(i);   // 2
    

while语句

  • while`语句属于前测试循环语句,也就是在循环体内的代码被执行前,就会对出口的条件求值

    var i = 0;
    while(i > 1) {
      i += 2;    // 永远不会被执行
    }
    alert(i);    // 0
    

for语句

  • for语句也是一种前测试循环,它具有在执行循环之前初始化变量和定义循环后要执行的代码的能力

    var count = 10;
    for (var i = 0; i < 10; i++) {
      alert(i);     // 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
    }
    

for-in语句

  • for-in语句是一种精准的迭代语句,可以用来枚举对象的属性

    var obj = {
      a: 1,
      b; 2c: 3
    };
    for (var key in obj) {
      console.log(key);       // 依次输出:a, b, c
      console.log(obj[key]);  // 依次输出:1, 2, 3
    }
    
    var arr = [1, 2, 3, 4];
    for (var key in arr) {
      console.log(key);       // 依次输出:0, 1, 2, 3
      console.log(arr[key]);  // 依次输出:1, 2, 3, 4
    }
    

label语句

  • 使用label语句可以在代码中添加标签,以便将来使用。下面的例子中定义的start标签可以在将来由breakcontinue语句引用。加标签的语句一般都需要与循环语句配合使用

    start: for (var i = 0; i < 10; i++) {
    	// doSomeTings
    }
    

break和continue语句

  • bereakcontinue语句用于在循环中精确控制代码的执行,其中break语句会立即退出循环,强制继续执行循环后面的语句。continue语句虽然也是立即退出循环,但退出循环后会从循环的顶部继续执行

    var num = 0;
    for (var i = 0; i < 10; i++) {
    	if (i % 5 === 0) {
        break;
      }
      num++;
    }
    alert(num);   // 4
    
    var num1 = 0;
    for (var i = 0; i < 10; i++) {
    	if (i % 5 === 0) {
        continue;
      }
      num++;
    }
    alert(num);   // 8
    

with语句

  • with语句的作用是将代码的作用于设置到一个特定的对象中,定义width语句的目的主要是为了简化多次编写同一个对象的工作。大量使用with语句会导致性能下降

    // 不使用with
    var qs = location.search.substring(1);
    var hostName = location.hostname;
    var url = location.href;
    
    // 使用with
    with(location) {
    	var qs = search.substring(1);
      var hostName = hostname;
    	var url = href;
    }
    

switch语句

  • switch语句与if语句的关系最为密切,switch语句中的每一种情形case的含义是:如果表达式等于这个值,则执行后面的语句。break关键字会导致代码执行流跳出switch语句,如果省略break关键字,就会导致执行完当前case后,继续执行下一个case,最厚default关键字则用于在表达式不匹配前面任何一种情形的时候,switch语句在比较值是使用的全等操作符

    switch (i) {
      case 25:
        alert('25');
        break;
      case 35:
        alert('35');
        break;
      case 45:
        alert('45');
        break;
      default:
        alert('Other');
    }
    
    switch (i) {
      case 25:
        /* 合并两种情形 */
      case 35:
        alert('25 or 35');
        break;
      case 45:
        alert('45');
        break;
      default:
        alert('Other');
    }
    

作者:GanGuiYang