重学Javascript之引用类型

注意： 本文章为 《重学js之JavaScript高级程序设计》系列第五章【JavaScript引用类型】。 关于《重学js之JavaScript高级程序设计》是从新回顾js基础的学习。

引用类型的值（对象）是引用类型的一个实例。在ES中，引用类型是一种数据结构，用于将数据和功能组织在一块儿，也被称之为类。但这并不稳当，引用类型有时候也被称为对象定义，由于它们描述的是一类对象所具备的属性和方法。

对象是某个特定引用类型的实例。新对象是使用 new 操做符跟一个 构造函数来建立的。构造函数自己就是一个函数，只不过该函数是出于建立新对象的目的而定义的，以下：

var person = new Object();
复制代码

上面这行代码建立了 Object 引用类型的一个新实例，而后把该实例保存在变量person中。使用的构造函数是 Object ，它只为新对象定义了默认的属性和方法。

一、object类型

建立object实例的方式有两种。第一种使用new操做符后跟object函数，第二种使用对象字面量表示法，对象字面量是对象定义的一种简写形式。

// 第一种方法

var person = new Object()
person.name = 'nice'
person.age = 20

// 第二种方法

var p = {
    name : 'nice',
    age: 29
}
复制代码

咱们能够经过两种方式来访问对象的属性

p.name = nice
p['name'] = nice
复制代码

二、Array类型

在ES 中数组的每一项能够保存任何类型的数据，也就是说，能够用数组的第一个位置来保存字符串，第二个位置来保存数值，第三个位置保存对象。另外数组的大小是能够动态调整的，能够随着数据的添加自动增加以容纳新的数据。

建立数组的两种方式

1. 使用Array构造函数

var c = new Array()     // 初始值是  undefined
var b = new Array(20)   // 建立一个包含20个元素的数组
var a = new Array('a', 'b')     // 包含 a b 两个元素的数组
复制代码

2. 使用数组字面量表示法

var a = [1,2,3]  // 包含3个数字的数组
var n = []      // 一个空数组
var v = ['a', 'c']  // 两个字符串的数组
复制代码

3. 读取数组的值

a[0]    // 1  方括号中的值就是数组的索引。返回数组对应的值
a[4]    // 若是值超过了数组的长度，则会增长到该索引值加1的长度  
n[2]    // [undefined, undefined]
复制代码

注意： 数组的length不是制度的，能够经过设置这个属性来往数组中增长删除项。数组的最后一项的索引 永远是 length -1,所以下一项的位置就是length。另外数组最多能够包含 4294967295个项，

2.1 转换方法

在以前的描述中，全部的对象都具备 toLocaleString()、toString() 和 value() 方法，其中调用数组的 toString()和 valueOf() 方法会返回相同的值，即由数组中每一个值的字符串形式拼接而成以逗号分隔的字符串。以下：

var a = ['a', 'b', 'c'];
a.toString()    // a,b,c
a.valueOf()     // a,b,c
复制代码

数组继承的 toLocaleString()、toString()、valueOf 方法 在默认状况下都会以逗号分隔的字符串形式返回数组项。若是使用 ‘join’ 方法，则可使用指定的分隔符来构建这个字符串。它只接受一个参数，用做分隔符的字符串，返回包含全部数组项的字符串。以下

var c = ['a', 'b', 'c']
c.join(',')     // a,b,c
c.join('/')     // a/b/c
复制代码

注意： 数组中的某一项的值是null 或者 undefined，那么该值在join()、toLocaleString()、toString()、valueOf()方法返回的字符串中以空表示

2.2 栈方法

在 ES 中 为数组也提供了一个让数组的行为相似于其余数据结构的方法，就是说数组能够表现的像栈同样呢，能够限制插入和删除的数据结构。 栈的特性就是 后进先出 ，最新添加的项最先被删除。栈中项的插入 和 移除只发生在栈的顶部。ES 为数组提供了 pop() 和 push() 方法

push() 是插入项，每次添加在数组的末尾，能够插入任意参数

let a = [1,2]
a.push(3)   // [1,2,3]

pop() 删除数组的最后一项

a.pop() //  [1,2]
复制代码

2.3 队列方法

栈数据结构是遵循 先进后出 ，而队列数据结构的访问规则 是 先进先出。队列的末端添加项，从列表的前端移除项。因为 push() 是想数组末端添加项的方法，若是要获取数组的首端项， 则 须要 shift() 方法。同时还有 unshift() 方法，在数组的最前端添加。

let a = [1,2]
a.shift()   //  1   a => [2]

a.unshift(3)    // a => [3,2]
复制代码

2.4 重排序方法

数组中能够用 reverse() 和 sort() 对数组进行排序，其中 reverse() 是对数组反转。sort() 默认是对数组升序排列，可是也能够由条件进行控制。

let a = [1,2,3,4]
a.reverse() // a => [4,3,2,1]

let a = [1,3,5,2,7]
a.sort()    // a => [1,2,3,5,7]
复制代码

2.5 操做方法

ES 为数组提供了不少方法， concat() 是基于当前数组建立一个新数组。

规则：

1. 默认建立当前数组的副本，而后将接受到的参数添加到这个副本的末尾，返回新建的数组
2. 没有传递参数，就复制当前的数组并返回
3. 传递了一个或多个数组，则将这些数组的每一项添加到结果数组中。若是传递的值不是数组，则会将值添加到数组末尾

slice() 基于当前数组中的一个或多个项建立新数组。接受 一到两个参数，即返回数组的开始和结束位置。若是只有一个参数，则返回的是起始位置到数组结束位置的全部值。它不会影响原数组。另外若是是两个参数，它返回的是第一个值到最后一个值前一个之间的值。

let a = [1,2,3,4,5,6,7,8]

a.slice(2,4)    // [3, 4]
复制代码

splice() 用来 删除、插入、替换数组的值。

1. 删除 能够删除任意数量的项，只须要指定2个参数，要删除的第一个位置 和 要删除的数量。 splice(0,2) 删除数组的前两个
2. 插入 能够向指定位置插入任意数量的项，须要提供3个参数。 起始位置、0、要插入的项。splice(2,0,'a') 从数组的 第二个项插入 'a'
3. 替换 能够向指定位置插入任意数量的项，同时删除任意数量的项。须要三个参数：起始位置、要删除的项数、要插入的任意数量。插入的数量没必要与删除的项数相等。

3. Date 类型

建立一个日期对象 var now = new Date() 能够 经过 Date.parse() 和 Date.UTC() 来获取特定的日期和时间对象

Date.parse() 接受一个表示日期的字符串参数。
Date.UTC() 返回表示日期的毫秒数
复制代码

3.1 继承的方法

跟其余类型同样，Date类型也重写了 toLocaleString()、toString() 和 valueOf()方法。在不一样浏览器，不一样时区，toLocalString() 返回值不一样。

3.2 日期的格式方式

Date类型为日期格式化为字符串提供了以下方法：

• toDateString() 以特定于实现的格式显示星期几、月、日和年
• toTimeString() 以特定于实现的格式显示时、分、秒和时区
• toLocaleDateString() 以特定于地区的格式显示星期几、月、日和年
• toLocaleTimeString() 以特定于实现的格式显示时、分、秒
• toUTCString() 以特定于实现的格式完整的UTC时间

4. RegExp类型

经过RegExp 类型支持正则表达式

g 表示全局模式，即模式被应用于全部字符串，而非发现的第一个匹配项时当即中止

i 表示不区分大小写模式，即在肯定匹配项时忽略模式与字符串的大小写

m 表示多行模式，即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项

5. Function类型

每个函数都是Function类型的实例，并且都与其余引用类型同样具备属性和方法。因为函数是对象，所以函数名实际上也时一个指向函数对象的指针，不会与某个函数绑定，函数一般是使用函数声明语法定义的。以下：

function a (b,c){
    return b + c
}

// 函数表达式声明

var s  = function(a,b){
    return a + b
}
复制代码

5.1 没有重载

若是命名两个相同 function 那么后一个将会覆盖前一个

function a(b) {
    retrun b + 100
}

function a(b){
    return b + 200
}

a(100)  // 300
复制代码

5.2 函数表达式和函数声明

在执行环境中加载数据的时候，对于函数表达式和函数声明，解析器优先读取函数声明，并使其在执行任何代码以前可用，至于函数表达式，则必须等到解析器执行到它所在的代码行，才会真正的被执行。

5.3 做为值的函数

由于ES 中的函数名自己就是变量，因此函数也能够做为值来使用，也就是说，不只能够像传递参数同样把一个函数 传递给另一个函数，并且能够将一个函数做为另一个函数的结果返回。

5.4 函数内部属性

在函数内部，有两个特殊的对象：arguments 和 this。其中，arguments 是一个类数组对象，包含着传入函数中的全部参数，虽然 arguments 的主要用途是保存函数参数，可是这个对象还有一个名叫 callee 的属性，该属性是一个指针，指向拥有这个 arguments对象的函数。

this 引用的是函数据以执行操做的对象，或者说 this 是函数在执行时所处做用域，若是是全局 this 指向 window

注意： 函数的名字仅仅是一个包含指针的变量而已。

5.4 函数属性和方法

ES 中函数是对象，所以函数也有属性和方法，每一个函数都包含两个属性：length 和 prototype。其中length 表示 函数但愿接收的命名参数的个数。

prototype 是保存它们全部实例方法的真正所在，换句话说，诸如 toString() 和 valueOf() 等方法实际上保存在prototype名下。只不过经过各自对象的实例访问。

每一个函数都包含两个非继承而来的方法： apply() 和 call()。这两个方法的用途都是特定的做用域中调用函数，实际上等于设置函数内 this 对象的值。

apply()

接受两个参数：一个是其运行函数的做用域，另外一个是参数数组。
其中第二个参数能够是 Array 的实例也能够是 arguments对象。 

call()

和 apply() 的做用相同，只是接受参数的方式不一样，第一个参数同
apply(), 第二个参数是一个参数列表而不是数组。
复制代码

6. 基本包装类型

为了便于操做基本类型值，ES 还提供了3个特殊的引用类型： Boolean、Number 和 String。

6.1 Boolean 类型

Boolean 类型是布尔值对应的引用类型。要建立Boolean对象，能够像下面这样调用Boolean构造函数并传入 true 或 false 值。

let a = new Boolean(true)
复制代码

注意： 基本类型与引用类型的布尔值还有两个区别，首先，typeof操做符对基本类型返回“boolean”,而对引用类型返回“object”。其次，因为Boolean对象是Boolean类型的实例，因此使用 instanceof操做符 测试 Boolean 对象会返回 true，而测试基本类型的布尔值则返回 false。

6.2 Number 类型

Number 是数字值对应的引用类型。要建立Number对象，能够在调用Number构造函数是向其中传递相应的数值。以下：

let n = new Number(10)
复制代码

Number 提供了 toFixed() 方法，来格式化为字符串

在使用 typeof操做符测试基本类型数值时，始终返回 number ，而在测试 Number 对象时，则返回 object。Number 对象是 Number 类型的实例。而基本类型的数值则不是。

6.3 String 类型

String 类型是字符串的对象包装类型，以下：

let s = new String('zifuchuan')
复制代码

1. 字符方法

charAt() // 接收一个参数，基于0的字符位置。以单字符串的形式返回给定位置的哪一个字符。

let s = 'abc'

a.charAt(1) // a

charCodeAt()    // 也是接受一个参数，可是返回的是字符串的编码

a.charCodeAt()  // 97
复制代码

2. 字符串操做方法

concat()    // 接受任意字符串，将字符串进行拼接
slice()     // 截取字符串 从第一个参数 到第二个参数结束，如没有第二个参数则到最后一位
substring() // 同上
substr()    // 同上
复制代码

3. 字符串的位置方法

indexOf()   // 都是从第一个字符串中搜索给定的子字符串
lastIndexOf()
复制代码

4. 字符串大小写转换

toLocaleUpperCase()     // 转为大写
toUpperCase()   //  同上
toLocaleLowerCase()     // 转为小写
toLowerCase()   // 同上
复制代码

5. 字符串的模式匹配方法

match() // 接受一个参数，要么为正则表达式，要么为RegExp 对象。
复制代码

6. localeCompare() 方法

比较两个字符串，返回以下：
    
    - 若是字符串在字母表中应该排在字符串参数以前，则返回负数
    - 若是字符串等于字符串参数，返回0，
    - 若是字符串在字母表中排在字符串参数以后，返回一个正数。
复制代码

7. 内置对象

不依赖于宿主环境的对象，这些对象在ES程序执行以前就已经存在了。即没必要显式地实例化内置对象。

7.1 Global对象

不属于任何其余对象的属性和方法，最终都是它的属性和方法。没有全局变量或全局函数，全部在全局做用域中定义的属性和函数，都是Global对象的属性。

7.2 Math对象

ES中为了保存数学公式和信息提供了一个公共位置，即Math对象。

8. 总结

• 引用类型与传统面向对象程序设计中的类类似，但实现不一样
• Object 是一个基础类型，其余全部类型都从Object继承了基本的行为。
• Array 类型是一组值的有序列表，同时还提供了操做和转换这些值的功能
• Date 类型提供了有关日期和时间信息，包括当前日期和时间以及相关的计算功能
• RegExp 类型是ES 支持正则表达式的一个接口，提供了基本的和一些高级的正则表达式功能。
• 函数其实是 Function 类型的实例，所以函数也是对象，而这一点正是 Javascript 最有特点的地方。因为函数也是对象，全部函数也拥有方法。
• 每一个包装类型都映射到同名的基本类型
• 在读取模式下访问基本类型值时，就会建立对应的基本包装类型的一个对象，从而方便了数据操做。
• 操做基本类型值的语句一经执行完毕，就会当即销毁新建立的包装类型
• 在全部代码执行以前，做用域中就已经存在两个内置对象 Global 和 Math.

欢迎关注 公众号【小夭同窗】

重学js系列

重学js之JavaScript简介

重学 JS 之在 HTML 中使用 JavaScript

重学js之JavaScript基本概念（上）=> 数据类型

重学js之JavaScript基本概念（中）=> 操做符

重学js之JavaScript基本概念（下）=> 运算符

重学js之JavaScript变量、做用域和内存问题

ES6入门系列

ES6入门之let、cont

ES6入门之变量的解构赋值

ES6入门之字符串的扩展

ES6入门之正则的扩展

ES6入门之数值的扩展

ES6入门之函数的扩展

ES6入门之数组的扩展

ES6入门之对象的扩展

ES6入门之Symbol

Git教程

前端Git基础教程