当前位置:  首页>> 技术小册>> Javascript重点难点实例精讲(一)

所有的编程语言都存在数据类型的概念。
在JavaScript中,数据类型可以分为基本数据类型和引用数据类型,其中基本数据类型包括Undefined、Null、Boolean、Number、String 5种,在ES6中新增了一种新的基本数据类型Symbol,这个会在第7章中讲到;引用数据类型含有Object、Function、Array、Date等类型,这些将会在第2章和第3章重点讲解。
接下来会详细讲解JavaScript中的基本数据类型。

  1. Undefined类型
    Undefined类型只有一个唯一的字面值undefined,表示的是一个变量不存在。
    下面是4种常见的出现undefined的场景。
    ① 使用只声明而未初始化的变量时,会返回“undefined”。
    var a; console.log(a); // undefined
    ② 获取一个对象的某个不存在的属性(自身属性和原型链继承属性)时,会返回“undefined”。
    var obj = { name: 'kingx' }; console.log(obj.address); // undefined
    ③ 函数没有明确的返回值时,却在其他地方使用了返回值,会返回“undefined”。
    function foo() {} console.log(foo()); // undefined
    ④ 函数定义时使用了多个形式参数(后文简称为形参),而在调用时传递的参数的数量少于形参数量,那么未匹配上的参数就为“undefined”。
    1. function foo(param1, param2, param3) {
    2. console.log(param3);
    3. }
    4. foo(1, 2); // undefined
  2. Null类型
    Null类型只有一个唯一的字面值null,表示一个空指针对象,这也是在使用typeof运算符检测null值时会返回“object”的原因。
    下面是3种常见的出现null的场景。
    ① 一般情况下,如果声明的变量是为了以后保存某个值,则应该在声明时就将其赋值为“null”。
  1. var returnObj = null;
  2. function foo() {
  3. return {
  4. name: 'kingx'
  5. };
  6. }
  7. returnObj = foo();

② JavaScript在获取DOM元素时,如果没有获取到指定的元素对象,就会返回“null”。

  1. document.querySelector('#id'); // null

③ 在使用正则表达式进行捕获时,如果没有捕获结果,就会返回“null”。

  1. 'test'.match(/a/); // null
  1. Undefined和Null两种类型的异同
    Undefined和Null虽然是两种不同的基本数据类型,存在一些不同的特性,但是在某些表现上存在着相同之处,这里就总结了Undefined和Null的相同点和不同点。
    (1)相同点
    · Undefined和Null两种数据类型都只有一个字面值,分别是undefined和null。
    · Undefined类型和Null类型在转换为Boolean类型的值时,都会转换为false。所以通过非运算符(!)获取结果为true的变量时,无法判断其值为undefined还是null。
    · 在需要将两者转换成对象时,都会抛出一个TypeError的异常,也就是平时最常见的引用异常。
  1. var a;
  2. var b = null;
  3. console.log(a.name); // Cannot read property 'name' of undefined
  4. console.log(b.name); // Cannot read property 'name' of null

上面代码表示在通过某个变量引用name属性时,若该变量值实际为undefined或者null,就会抛出异常。
· Undefined类型派生自Null类型,所以在非严格相等的情况下,两者是相等的,如下面代码所示。

  1. null == undened; // true

(2)不同点
· null是JavaScript中的关键字,而undefined是JavaScript中的一个全局变量,即挂载在window对象上的一个变量,并不是关键字。
· 在使用typeof运算符检测时,Undefined类型的值会返回“undefined”,而Null类型的值会返回“object”。

  1. typeof undened; // undefined
  2. typeof null; // object

在通过call调用toString()函数时,Undefined类型的值会返回“[object Undefined]”,而Null类型的值会返回“[object Null]”。

  1. Object.prototype.toString.call(undened); // [object Undefined]
  2. Object.prototype.toString.call(null); // [object Null]

· 在需要进行字符串类型的转换时,null会转换为字符串”null”,而undefined会转换为字符串”undefined”。

  1. undened + ' string'; // undefined string
  2. null + ' string'; // null string

· 在需要进行数值类型的转换时,undefined会转换为NaN,无法参与计算;null会转换为0,可以参与计算。

  1. undened + 0; // NaN
  2. null + 0; // 0

· 无论在什么情况下都没有必要将一个变量显式设置为undefined。如果需要定义某个变量来保存将来要使用的对象,应该将其初始化为null。这样不仅能将null作为空对象指针的惯例,还有助于区分null和undefined。

  1. Boolean类型
    Boolean类型(又称布尔类型)的字面值只有两个,分别是true和false,它们是区分大小写的,其他值(如True和False)并不是Boolean类型的值。
    Boolean类型使用最多的场景就是用于if语句判断。在JavaScript中,if语句可以接受任何类型的表达式,即if(a)语句中的a,可以是Boolean、Number、String、Object、Function、Null、Undefined中的任何类型。
    如果a不是Boolean类型的值,那么JavaScript解释器会自动调用Boolean()函数对a进行类型转换,返回最终符合if语句判断的true或者false值。
    不同类型与Boolean类型的值的转换是Boolean类型的重点,如下所述。
    (1)String类型转换为Boolean类型
    · 空字符串””或者’’都会转换为false。
    · 任何非空字符串都会转换为true,包括只有空格的字符串” “。
    (2)Number类型转换为Boolean类型
    · 0和NaN会转换为false。
    · 除了0和NaN以外,都会转换为true,包括表示无穷大和无穷小的Infinity和
    ```Infinity。
    (3)Object类型转换为Boolean类型
    · 当object为null时,会转换为false。
    · 如果object不为null,则都会转换为true,包括空对象{}。
    (4)Function类型转换为Boolean类型
    · 任何Function类型的值都会转换为true。
    (5)Null类型转换为Boolean类型
    · Null类型只有一个null值,会转换为false。
    (6)Undefined类型转换为Boolean类型
    · Undefined类型只有一个undefined值,会转换为false。
    因为其他类型与Boolean类型的值的转换方式众多,所以大家一定要熟练掌握这些规则。

该分类下的相关小册推荐: