ES5 数组方法
1.Array.isArray() 方法用来判断一个值是否为数组。它可以弥补typeof
运算符的不足
2.valueOf() 方法返回数组本身
3.toString() 方法返回数组的字符串形式
4.push() 方法用于在数组的末端添加一个或多个元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。
5.pop() 方法用于删除数组的最后一个元素,并返回该元素。注意,该方法会改变原数组。
6.join() 方法以参数作为分隔符,将所有数组成员组成一个字符串返回。如果不提供参数,默认用逗号分隔。
7.concat() 方法用于多个数组的合并。它将新数组的成员,添加到原数组成员的后部,然后返回一个新数组,原数组不变。
8.shift() 方法用于删除数组的第一个元素,并返回该元素。注意,该方法会改变原数组。
9.unshift() 方法用于在数组的第一个位置添加元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。
10.reverse() 方法用于颠倒数组中元素的顺序,返回改变后的数组。注意,该方法将改变原数组。
11.slice() 方法用于提取原数组的一部分,返回一个新数组,原数组不变。
12.splice() 方法用于删除原数组的一部分成员,并可以在被删除的位置添加入新的数组成员,返回值是被删除的元素。注意,该方法会改变原数组。
splice的第一个参数是删除的起始位置,第二个参数是被删除的元素个数。如果后面还有更多的参数,则表示这些就是要被插入数组的新元素。
13.sort() 方法对数组成员进行排序,默认是按照字典顺序排序。排序后,原数组将被改变。
14.map() 方法对数组的所有成员依次调用一个函数,根据函数结果返回一个新数组。
15.forEach() 方法与map方法很相似,也是遍历数组的所有成员,执行某种操作,但是forEach
方法一般不返回值,只用来操作数据。如果需要有返回值,一般使用map
方法。
forEach
方法的参数与map
方法一致,也是一个函数,数组的所有成员会依次执行该函数。它接受三个参数,分别是当前位置的值、当前位置的编号和整个数组。
16.filter() 方法的参数是一个函数,所有数组成员依次执行该函数,返回结果为true
的成员组成一个新数组返回。该方法不会改变原数组。
17.some(),every()
这两个方法类似“断言”(assert),用来判断数组成员是否符合某种条件。
它们接受一个函数作为参数,所有数组成员依次执行该函数,返回一个布尔值。该函数接受三个参数,依次是当前位置的成员、当前位置的序号和整个数组。
some
方法是只要有一个数组成员的返回值是true
,则整个some
方法的返回值就是true
,否则false
。
18.reduce(),reduceRight()
19.indexOf(),lastIndexOf()
indexOf 方法返回给定元素在数组中第一次出现的位置,如果没有出现则返回-1
。
lastIndexOf 方法返回给定元素在数组中最后一次出现的位置,如果没有出现则返回-1
。
ES6 数组方法
1.扩展运算符
2.Array.from() 类数组转换成数组
3.Array.of() 方法用于将一组值,转换为数组。
4.copyWithin() 数组实例的 在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组。也就是说,使用这个方法,会修改当前数组。
5. find() 数组实例的 用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true
的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined
。
6. findIndex() 数组实例的 方法的用法与find
方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
。
7.fill() 数组实例的方法使用给定值,填充一个数组。
8.entries(),keys() 和 values() 数组实例的
ES6 提供三个新的方法——entries()
,keys()
和values()
——用于遍历数组。它们都返回一个遍历器对象(详见《Iterator》一章),可以用for...of
循环进行遍历,唯一的区别是keys()
是对键名的遍历、values()
是对键值的遍历,entries()
是对键值对的遍历。
9.includes() 数组实例的 方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes
方法类似。ES2016 引入了该方法。
10.数组的空位指,数组的某一个位置没有任何值。比如,Array
构造函数返回的数组都是空位。
ES5 数组方法
1.Array.isArray() 方法用来判断一个值是否为数组。它可以弥补typeof
运算符的不足
var a = [1, 2, 3]; typeof a // "object" Array.isArray(a) // true
2.valueOf() 方法返回数组本身
var a = [1, 2, 3]; a.valueOf() // [1, 2, 3]
3.toString() 方法返回数组的字符串形式
var a = [1, 2, 3]; a.toString() // "1,2,3" var a = [1, 2, 3, [4, 5, 6]]; a.toString() // "1,2,3,4,5,6"
4.push() 方法用于在数组的末端添加一个或多个元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。
var a = []; a.push(1) // 1 a.push(‘a‘) // 2 a.push(true, {}) // 4 a // [1, ‘a‘, true, {}]
5.pop() 方法用于删除数组的最后一个元素,并返回该元素。注意,该方法会改变原数组。
var a = [‘a‘, ‘b‘, ‘c‘]; a.pop() // ‘c‘ a // [‘a‘, ‘b‘]
对空数组使用pop
方法,不会报错,而是返回undefined
。
6.join() 方法以参数作为分隔符,将所有数组成员组成一个字符串返回。如果不提供参数,默认用逗号分隔。
var a = [1, 2, 3, 4]; a.join(‘ ‘) // ‘1 2 3 4‘ a.join(‘ | ‘) // "1 | 2 | 3 | 4" a.join() // "1,2,3,4"
7.concat() 方法用于多个数组的合并。它将新数组的成员,添加到原数组成员的后部,然后返回一个新数组,原数组不变。
[1, 2, 3].concat(4, 5, 6) // [1, 2, 3, 4, 5, 6] // 等同于 [1, 2, 3].concat(4, [5, 6]) [1, 2, 3].concat([4], [5, 6])
concat
方法也可以用于将对象合并为数组。
[].concat({a: 1}, {b: 2}) // [{ a: 1 }, { b: 2 }] [].concat({a: 1}, [2]) // [{a: 1}, 2] [2].concat({a: 1}) // [2, {a: 1}]
8.shift() 方法用于删除数组的第一个元素,并返回该元素。注意,该方法会改变原数组。
var a = [‘a‘, ‘b‘, ‘c‘]; a.shift() // ‘a‘ a // [‘b‘, ‘c‘]
9.unshift() 方法用于在数组的第一个位置添加元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。
var arr = [ ‘c‘, ‘d‘ ]; arr.unshift(‘a‘, ‘b‘) // 4 arr // [ ‘a‘, ‘b‘, ‘c‘, ‘d‘
10.reverse() 方法用于颠倒数组中元素的顺序,返回改变后的数组。注意,该方法将改变原数组。
var a = [‘a‘, ‘b‘, ‘c‘]; a.reverse() // ["c", "b", "a"] a // ["c", "b", "a"]
11.slice() 方法用于提取原数组的一部分,返回一个新数组,原数组不变。
// 格式 arr.slice(start_index, upto_index); // 用法 var a = [‘a‘, ‘b‘, ‘c‘]; a.slice(0) // ["a", "b", "c"] a.slice(1) // ["b", "c"] a.slice(1, 2) // ["b"] a.slice(2, 6) // ["c"] a.slice() // ["a", "b", "c"] 相当于复制数组
如果slice
方法的参数是负数,则表示倒数计算的位置。
var a = [‘a‘, ‘b‘, ‘c‘]; a.slice(-2) // ["b", "c"] a.slice(-2, -1) // ["b"]
如果参数值大于数组成员的个数,或者第二个参数小于第一个参数,则返回空数组。
var a = [‘a‘, ‘b‘, ‘c‘]; a.slice(4) // [] a.slice(2, 1) // []
12.splice() 方法用于删除原数组的一部分成员,并可以在被删除的位置添加入新的数组成员,返回值是被删除的元素。注意,该方法会改变原数组。
splice的第一个参数是删除的起始位置,第二个参数是被删除的元素个数。如果后面还有更多的参数,则表示这些就是要被插入数组的新元素。
// 格式 arr.splice(index, count_to_remove, addElement1, addElement2, ...); // 用法 var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘, ‘f‘]; a.splice(4, 2) // ["e", "f"] a // ["a", "b", "c", "d"]
var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘, ‘f‘]; a.splice(-4, 2) // ["c", "d"]
上面代码表示,从倒数第四个位置c
开始删除两个成员。
如果只是单纯地插入元素,splice
方法的第二个参数可以设为0。
var a = [1, 1, 1]; a.splice(1, 0, 2) // [] a // [1, 2, 1, 1]
13.sort() 方法对数组成员进行排序,默认是按照字典顺序排序。排序后,原数组将被改变。
[10111, 1101, 111].sort(function (a, b) { return a - b; })// [111, 1101, 10111] [ { name: "张三", age: 30 }, { name: "李四", age: 24 }, { name: "王五", age: 28 } ].sort(function (o1, o2) { return o1.age - o2.age; }) // [ // { name: "李四", age: 24 }, // { name: "王五", age: 28 }, // { name: "张三", age: 30 } // ]
14.map() 方法对数组的所有成员依次调用一个函数,根据函数结果返回一个新数组。map
方法接受一个函数作为参数。该函数调用时,map
方法会将其传入三个参数,分别是当前成员、当前位置和数组本身。
var numbers = [1, 2, 3]; numbers.map(function (n) { return n + 1; }); // [2, 3, 4] numbers // [1, 2, 3]
[1, 2, 3].map(function(elem, index, arr) { return elem * index; }); // [0, 2, 6]
15.forEach() 方法与map方法很相似,也是遍历数组的所有成员,执行某种操作,但是forEach
方法一般不返回值,只用来操作数据。如果需要有返回值,一般使用map
方法。
forEach
方法的参数与map
方法一致,也是一个函数,数组的所有成员会依次执行该函数。它接受三个参数,分别是当前位置的值、当前位置的编号和整个数组。
function log(element, index, array) { console.log(‘[‘ + index + ‘] = ‘ + element); } [2, 5, 9].forEach(log); // [0] = 2 // [1] = 5 // [2] = 9
forEach
方法也可以接受第二个参数,用来绑定回调函数的this
关键字。
var obj = { name: ‘张三‘, times: [1, 2, 3], print: function () { this.times.forEach(function (n) { console.log(this.name); }, this); } }; obj.print() // 张三 // 张三 // 张三
注意,forEach
方法无法中断执行,总是会将所有成员遍历完。如果希望符合某种条件时,就中断遍历,要使用for
循环。
var arr = [1, 2, 3]; for (var i = 0; i < arr.length; i++) { if (arr[i] === 2) break; console.log(arr[i]); } // 2
16.filter() 方法的参数是一个函数,所有数组成员依次执行该函数,返回结果为true
的成员组成一个新数组返回。该方法不会改变原数组。
[1, 2, 3, 4, 5].filter(function (elem) { return (elem > 3); }) // [4, 5]
filter
方法还可以接受第二个参数,指定测试函数所在的上下文对象(即this
对象)。
var Obj = function () { this.MAX = 3; }; var myFilter = function (item) { if (item > this.MAX) { return true; } }; var arr = [2, 8, 3, 4, 1, 3, 2, 9]; arr.filter(myFilter, new Obj()) // [8, 4, 9]
17.some(),every()
这两个方法类似“断言”(assert),用来判断数组成员是否符合某种条件。
它们接受一个函数作为参数,所有数组成员依次执行该函数,返回一个布尔值。该函数接受三个参数,依次是当前位置的成员、当前位置的序号和整个数组。
some
方法是只要有一个数组成员的返回值是true
,则整个some
方法的返回值就是true
,否则false
。
var arr = [1, 2, 3, 4, 5]; arr.some(function (elem, index, arr) { return elem >= 3; }); // true
every
方法则是所有数组成员的返回值都是true
,才返回true
,否则false
。
var arr = [1, 2, 3, 4, 5]; arr.every(function (elem, index, arr) { return elem >= 3; }); // false
注意,对于空数组,some
方法返回false
,every
方法返回true
,回调函数都不会执行。
some
和every
方法还可以接受第二个参数,用来绑定函数中的this
关键字。
18.reduce(),reduceRight()reduce
方法和reduceRight
方法依次处理数组的每个成员,最终累计为一个值。
reduce:
是从左到右处理(从第一个成员到最后一个成员)
reduceRight:
则是从右到左(从最后一个成员到第一个成员),其他完全一样。
这两个方法的第一个参数都是一个函数。该函数接受以下四个参数:
- 累积变量,默认为数组的第一个成员
- 当前变量,默认为数组的第二个成员
- 当前位置(从0开始)
- 原数组
这四个参数之中,只有前两个是必须的,后两个则是可选的。
下面的例子求数组成员之和。
[1, 2, 3, 4, 5].reduce(function(x, y){ console.log(x, y) return x + y; }); // 1 2 // 3 3 // 6 4 // 10 5 //最后结果:15
利用reduce
方法,可以写一个数组求和的sum
方法。
let arr = [234,234,34,34,12] Array.prototype.sum = function () { return this.reduce(function (partial, value) { return partial + value }) } console.log(arr.sum()) //584
如果要对累积变量指定初值,可以把它放在reduce
方法和reduceRight
方法的第二个参数。
[1, 2, 3, 4, 5].reduce(function(x, y){ return x + y; }, 10); // 25
19.indexOf(),lastIndexOf()
indexOf 方法返回给定元素在数组中第一次出现的位置,如果没有出现则返回-1
。
lastIndexOf 方法返回给定元素在数组中最后一次出现的位置,如果没有出现则返回-1
。
var a = [‘a‘, ‘b‘, ‘c‘]; a.indexOf(‘b‘) // 1 a.indexOf(‘y‘) // -1
indexOf
方法还可以接受第二个参数,表示搜索的开始位置。
[‘a‘, ‘b‘, ‘c‘].indexOf(‘a‘, 1) // -1
ES6 数组方法
1.扩展运算符,该运算符主要用于函数调用。
function push(array, ...items) { array.push(...items); } function add(x, y) { return x + y; } const numbers = [4, 38]; add(...numbers) // 42
由于扩展运算符可以展开数组,所以不再需要apply
方法,将数组转为函数的参数了。
// ES5 的写法 function f(x, y, z) { // ... } var args = [0, 1, 2]; f.apply(null, args); // ES6的写法 function f(x, y, z) { // ... } let args = [0, 1, 2]; f(...args);
下面是扩展运算符取代apply
方法的一个实际的例子,应用Math.max
方法,简化求出一个数组最大元素的写法。
// ES5 的写法 Math.max.apply(null, [14, 3, 77]) // ES6 的写法 Math.max(...[14, 3, 77]) // 等同于 Math.max(14, 3, 77);
另一个例子是通过push
函数,将一个数组添加到另一个数组的尾部。
// ES5的 写法 var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; Array.prototype.push.apply(arr1, arr2); // ES6 的写法 let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1.push(...arr2);
扩展应用符的应用
a). 复制数组(克隆数组,修改a2,a1不会改变)
const a1 = [1, 2]; // 写法一 const a2 = [...a1]; // 写法二 const [...a2] = a1;
b). 合并数组
// ES5 [1, 2].concat(more) // ES6 [1, 2, ...more] var arr1 = [‘a‘, ‘b‘]; var arr2 = [‘c‘]; var arr3 = [‘d‘, ‘e‘]; // ES5的合并数组 arr1.concat(arr2, arr3); // [ ‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘ ] // ES6的合并数组 [...arr1, ...arr2, ...arr3] // [ ‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘ ]
c). 与解构赋值结合
const [first, ...rest] = [1, 2, 3, 4, 5]; first // 1 rest // [2, 3, 4, 5] const [first, ...rest] = []; first // undefined rest // [] const [first, ...rest] = ["foo"]; first // "foo" rest // [] // 如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错。 const [...butLast, last] = [1, 2, 3, 4, 5]; // 报错 const [first, ...middle, last] = [1, 2, 3, 4, 5]; // 报错
d). 字符串,扩展运算符还可以将字符串转为真正的数组。
e).实现了 Iterator 接口的对象任何 Iterator 接口的对象(参阅 Iterator 一章),都可以用扩展运算符转为真正的数组。
let nodeList = document.querySelectorAll(‘div‘); let array = [...nodeList];
对于那些没有部署 Iterator 接口的类似数组的对象,扩展运算符就无法将其转为真正的数组。
let arrayLike = { ‘0‘: ‘a‘, ‘1‘: ‘b‘, ‘2‘: ‘c‘, length: 3 }; // TypeError: Cannot spread non-iterable object. let arr = [...arrayLike];
上面代码中,arrayLike
是一个类似数组的对象,但是没有部署 Iterator 接口,扩展运算符就会报错。这时,可以改为使用Array.from
方法将arrayLike
转为真正的数组。
f). Map 和 Set 结构,Generator 函数
扩展运算符内部调用的是数据结构的 Iterator 接口,因此只要具有 Iterator 接口的对象,都可以使用扩展运算符,比如 Map 结构。
let map = new Map([ [1, ‘one‘], [2, ‘two‘], [3, ‘three‘], ]); let arr = [...map.keys()]; // [1, 2, 3]
Generator 函数运行后,返回一个遍历器对象,因此也可以使用扩展运算符。
const go = function*(){ yield 1; yield 2; yield 3; }; [...go()] // [1, 2, 3]
上面代码中,变量go
是一个 Generator 函数,执行后返回的是一个遍历器对象,对这个遍历器对象执行扩展运算符,就会将内部遍历得到的值,转为一个数组。
如果对没有 Iterator 接口的对象,使用扩展运算符,将会报错。
const obj = {a: 1, b: 2}; let arr = [...obj]; // TypeError: Cannot spread non-iterable object
2.Array.from() 类数组转换成数组
3.Array.of() 方法用于将一组值,转换为数组。这个方法的主要目的,是弥补数组构造函数Array()
的不足。因为参数个数的不同,会导致Array()
的行为有差异。
Array.of(3, 11, 8) // [3,11,8] Array.of(3) // [3] Array.of(3).length // 1 Array() // [] Array(3) // [, , ,] Array(3, 11, 8) // [3, 11, 8]
Array.of
基本上可以用来替代Array()
或new Array()
,并且不存在由于参数不同而导致的重载。它的行为非常统一。
Array.of() // [] Array.of(undefined) // [undefined] Array.of(1) // [1] Array.of(1, 2) // [1, 2]
4.copyWithin() 数组实例的 在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组。也就是说,使用这个方法,会修改当前数组。
它接受三个参数。
a). target(必需):从该位置开始替换数据。
b). start(可选):从该位置开始读取数据,默认为 0。如果为负值,表示倒数。
c). end(可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。
// 将3号位复制到0号位 [1, 2, 3, 4, 5].copyWithin(0, 3, 4) // [4, 2, 3, 4, 5] // -2相当于3号位,-1相当于4号位 [1, 2, 3, 4, 5].copyWithin(0, -2, -1) // [4, 2, 3, 4, 5] // 将3号位复制到0号位 [].copyWithin.call({length: 5, 3: 1}, 0, 3) // {0: 1, 3: 1, length: 5} 此处有疑惑 // 将2号位到数组结束,复制到0号位 let i32a = new Int32Array([1, 2, 3, 4, 5]); i32a.copyWithin(0, 2); // Int32Array [3, 4, 5, 4, 5] // 对于没有部署 TypedArray 的 copyWithin 方法的平台 // 需要采用下面的写法 [].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4); // Int32Array [4, 2, 3, 4, 5]
[].copyWithin.call({length: 5, 3: 1}, 0, 3) // {0: 1, 3: 1, length: 5} 此处有疑惑
5. find() 数组实例的 用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true
的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined
。
let arr = [1, 4, -5, 10] console.log(arr.find((n) => n < 0)) // -5
[1, 5, 10, 15].find(function(value, index, arr) { return value > 9; }) // 10
上面代码中,find
方法的回调函数可以接受三个参数,依次为当前的值、当前的位置和原数组。
6. findIndex() 数组实例的findIndex
方法的用法与find
方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
。
[1, 5, 10, 15].findIndex(function(value, index, arr) { return value > 9; }) // 2
这两个方法都可以接受第二个参数,用来绑定回调函数的this
对象。
另外,这两个方法都可以发现NaN
,弥补了数组的indexOf
方法的不足。
[NaN].indexOf(NaN) // -1 [NaN].findIndex(y => Object.is(NaN, y)) // 0
7.fill() 数组实例的方法使用给定值,填充一个数组。
[‘a‘, ‘b‘, ‘c‘].fill(7) // [7, 7, 7] new Array(3).fill(7) // [7, 7, 7]
上面代码表明,fill
方法用于空数组的初始化非常方便。数组中已有的元素,会被全部抹去。
fill
方法还可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置。
[‘a‘, ‘b‘, ‘c‘].fill(7, 1, 2) // [‘a‘, 7, ‘c‘]
8.entries(),keys() 和 values() 数组实例的
ES6 提供三个新的方法——entries()
,keys()
和values()
——用于遍历数组。它们都返回一个遍历器对象(详见《Iterator》一章),可以用for...of
循环进行遍历,唯一的区别是keys()
是对键名的遍历、values()
是对键值的遍历,entries()
是对键值对的遍历。
let arr = [‘a‘, ‘b‘] for (let index of arr.keys()) { console.log(index); } // 0 // 1 for (let elem of arr.values()) { console.log(elem); } // ‘a‘ // ‘b‘ for (let [index, elem] of arr.entries()) { console.log(index, elem); } // 0 "a" // 1 "b"
如果不使用for...of
循环,可以手动调用遍历器对象的next
方法,进行遍历。
let letter = [‘a‘, ‘b‘, ‘c‘]; let entries = letter.entries(); console.log(entries.next().value); // [0, ‘a‘] console.log(entries.next().value); // [1, ‘b‘] console.log(entries.next().value); // [2, ‘c‘]
9.includes() 数组实例的 方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes
方法类似。ES2016 引入了该方法。
[1, 2, 3].includes(2) // true [1, 2, 3].includes(4) // false [1, 2, NaN].includes(NaN) // true
该方法的第二个参数表示搜索的起始位置,默认为0
。如果第二个参数为负数,则表示倒数的位置,如果这时它大于数组长度(比如第二个参数为-4
,但数组长度为3
),则会重置为从0
开始。
[1, 2, 3].includes(3, 3); // false [1, 2, 3].includes(3, -1); // true
没有该方法之前,我们通常使用数组的indexOf
方法,检查是否包含某个值。
if (arr.indexOf(el) !== -1) { // ... }
indexOf
方法有两个缺点,一是不够语义化,它的含义是找到参数值的第一个出现位置,所以要去比较是否不等于-1
,表达起来不够直观。二是,它内部使用严格相等运算符(===
)进行判断,这会导致对NaN
的误判。
[NaN].indexOf(NaN) // -1 [NaN].includes(NaN) // true
另外,Map 和 Set 数据结构有一个has
方法,需要注意与includes
区分。
- Map 结构的
has
方法,是用来查找键名的,比如Map.prototype.has(key)
、WeakMap.prototype.has(key)
、Reflect.has(target, propertyKey)
。 - Set 结构的
has
方法,是用来查找值的,比如Set.prototype.has(value)
、WeakSet.prototype.has(value)
。
10.数组的空位指,数组的某一个位置没有任何值。比如,Array
构造函数返回的数组都是空位。
文章内容转载,参考链接
https://www.cnblogs.com/z-dl/p/8205619.html