数组常用函数整理

总结自：zh.javascript.info/

数组操作 pop/push/shift/unshift：

• push 在末端添加一个元素.
• shift 取出队列首端的一个元素，整个队列往前移，这样原先排第二的元素现在排在了第一。
• pop 从末端取出一个元素.
• unshift 在数组的首端添加元素：

这几种方法都会改变数组

pop

取出并返回数组的最后一个元素：

let fruits = ["Apple", "Orange", "Pear"];

alert( fruits.pop() ); // 移除 "Pear" 然后 alert 显示出来

alert( fruits ); // Apple, Orange
复制代码

push

在数组末端添加元素：

let fruits = ["Apple", "Orange"];

fruits.push("Pear");

alert( fruits ); // Apple, Orange, Pear
复制代码

shift

取出数组的第一个元素并返回它：

let fruits = ["Apple", "Orange", "Pear"];

alert( fruits.shift() ); // 移除 Apple 然后 alert 显示出来

alert( fruits ); // Orange, Pear

复制代码

unshift

在数组的首端添加元素：

let fruits = ["Orange", "Pear"];

fruits.unshift('Apple');

alert( fruits ); // Apple, Orange, Pear
复制代码

push 和 unshift 方法都可以一次添加多个元素：

let fruits = ["Apple"];

fruits.push("Orange", "Peach");
fruits.unshift("Pineapple", "Lemon");

// ["Pineapple", "Lemon", "Apple", "Orange", "Peach"]
alert( fruits );
复制代码

数组方法

splice

会改变数组

arr.splice(start[, deleteCount, elem1, ..., elemN])
它从索引 `start` 开始修改 `arr`：删除 `deleteCount` 个元素并在当前位置插入 `elem1, ..., elemN`。最后返回已被删除元素的数组。
复制代码

示例：

用法1：

//用法1
let arr = ["I", "study", "JavaScript"];

console.log(arr.splice(1, 1)); ; // ['study']

console.log(arr); // ["I", "JavaScript"]
复制代码

用法2：移除并替换

let arr = ["I", "study", "JavaScript", "right", "now"];

// 删除数组的前三项，并使用其他内容代替它们
arr.splice(0, 3, "Let's", "dance");

alert( arr ) // 现在 ["Let's", "dance", "right", "now"]
复制代码

用法3：添加,将第二个参数设置为0，则可以添加（注意是在前面添加）

let arr = ["I", "study", "JavaScript", "right", "now"];

arr.splice(1, 0, "Let's", "dance");

console.log( arr);// 现在 ['I', 'Let's', 'dance', 'study', 'JavaScript', 'right', 'now']
复制代码

用法4：允许负向索引，

let arr = [1, 2, 5];

// 从索引 -1（尾端前一位）
// 删除 0 个元素，
// 然后插入 3 和 4
arr.splice(-1, 0, 3, 4);

alert( arr ); // 1,2,3,4,5
复制代码

slice

不会改变数组

arr.slice([start], [end])
复制代码

它会返回一个新数组，将所有从索引 start 到 end（不包括 end）的数组项复制到一个新的数组。start 和 end 都可以是负数，在这种情况下，从末尾计算索引。

let arr = ["t", "e", "s", "t"];

alert( arr.slice(1, 3) ); // e,s（复制从位置 1 到位置 3 的元素）

alert( arr.slice(-2) ); // s,t（复制从位置 -2 到尾端的元素）
复制代码

其他用法：

//数组复制
let arr = [1,2,3];
//不传参数
let arr2 = arr.slice()
alert(arr2)//[1,2,3]
复制代码

concat

创建一个新数组，其中包含来自于其他数组和其他项的值。

语法：

arr.concat(arg1, arg2...)
复制代码

concat()的参数中可以放入数组、值

let arr = [1, 2];


console.log( arr.concat([3, 4]) ); // 1,2,3,4

console.log( arr.concat([3, 4], [5, 6]) ); // 1,2,3,4,5,6

console.log( arr.concat([3, 4], "5", true,null,undefined,12,{name:"we"},v=>v) ); // [1, 2, 3, 4, '5', true, null, undefined, 12, {…}, ƒ]


复制代码

如果类似数组的对象具有 Symbol.isConcatSpreadable 属性，那么它就会被 concat 当作一个数组来处理

let arr = [1, 2];

let arrayLike = {
  0: "something",
  1: "else",

[Symbol.isConcatSpreadable]: true,

  length: 2
};

alert( arr.concat(arrayLike) ); // 1,2,something,else
复制代码

forEach()

arr.forEach(function(item, index, array) {
  // ... do something with item
});
复制代码

数组中搜索

indexOf/lastIndexOf 和 includes

• arr.indexOf(item, from) 从索引 from 开始搜索 item，如果找到则返回索引，否则返回 -1。
• arr.lastIndexOf(item, from) —— 和上面相同，只是从右向左搜索。
• arr.includes(item, from) —— 从索引 from 开始搜索 item，如果找到则返回 true（译注：如果没找到，则返回 false）。

==这些方法使用的是严格相等 === 比较。所以如果我们搜索 false，会精确到的确是 false 而不是数字 0。==

includes可以正确处理NaN

const arr = [NaN];
alert( arr.indexOf(NaN) ); // -1（应该为 0，但是严格相等 === equality 对 NaN 无效）
alert( arr.includes(NaN) );// true（这个结果是对的）
复制代码

find 和 findIndex

find 语法：

let result = arr.find(function(item, index, array) {
  // 如果返回 true，则返回 item 并停止迭代
  // 对于假值（falsy）的情况，则返回 undefined
});
/*
- `item` 是元素。
- `index` 是它的索引。
- `array` 是数组本身。
*/

//用法
//find只返回找到的第一个元素
let users = [
  {id: 1, name: "John"},
  {id: 2, name: "Pete"},
  {id: 3, name: "Mary"}
];

let user = users.find(item => item.id == 1);

alert(user.name); // John
复制代码

arr.findIndex方法（与 arr.find 方法）基本上是一样的，但它返回找到元素的索引，而不是元素本身。并且在未找到任何内容时返回 -1。

filter

find只能找一个，用filter可以找到所有匹配的元素

语法：

let results = arr.filter(function(item, index, array) {
  // 如果 true item 被 push 到 results，迭代继续
  // 如果什么都没找到，则返回空数组
});
复制代码

用法：

let users = [
  {id: 1, name: "John"},
  {id: 2, name: "Pete"},
  {id: 3, name: "Mary"}
];

// 返回前两个用户的数组
let someUsers = users.filter(item => item.id < 3);

alert(someUsers.length); // 2
复制代码

数组加工

**map

会改变数组

它对数组的每个元素都调用函数，并返回结果数组。

let result = arr.map(function(item, index, array) {
  // 返回新值而不是当前元素
})
复制代码

let lengths = ["Bilbo", "Gandalf", "Nazgul"].map(item => item.length);
alert(lengths); // 5,7,6
复制代码

sort

对数组进行原位排序，即在数组内排序而非生成新的数组

sort如果不传入参数，则将元素转换为字符串排序：

let arr = [ 1, 2, 15 ];

// 该方法重新排列 arr 的内容
arr.sort();

alert( arr );  // 1, 15, 2
复制代码

正常情况下需要传入一个函数，返回值为 正数 0 负数

function compare(a, b) {
  if (a > b) return 1; // 如果第一个值比第二个值大
  if (a == b) return 0; // 如果两个值相等
  if (a < b) return -1; // 如果第一个值比第二个值小
}

let arr = [ 1, 2, 15 ];

arr.sort(compareNumeric);

alert(arr);  // 1, 2, 15

//简化：
arr.sort( (a, b) => a - b );
复制代码

从小到大a-b 从大到小b-a；

reverse

颠倒数组元素

let arr = [1, 2, 3, 4, 5];
arr.reverse();

alert( arr ); // 5,4,3,2,1
复制代码

split

通过给定的分隔符将字符串切割成数组

let names = 'Bilbo, Gandalf, Nazgul';
let arr = names.split(', ');
console.log(arr);//['Bilbo', 'Gandalf', 'Nazgul']
复制代码

第二个参数可以指定数组的长度，对多余的部分进行切割：

let names = 'Bilbo, Gandalf, Nazgul';

let arr = names.split(', ',1);
console.log(arr);// ['Bilbo']
复制代码

join

与split相反，它可以将数组粘合成字符串

let arr = ['Bilbo', 'Gandalf', 'Nazgul'];

let str = arr.join(';'); // 使用分号 ; 将数组粘合成字符串

alert( str ); // Bilbo;Gandalf;Nazgul
复制代码

reducer

本质上是一个累加器

语法

let value = arr.reduce(function(accumulator, item, index, array) {
  // ...
}, [initial]);

/*
- `accumulator` —— 是上一个函数调用的结果，第一次等于 `initial`（如果提供了 `initial` 的话）。
- `item` —— 当前的数组元素。
- `index` —— 当前索引。
- `arr` —— 数组本身。
*/
复制代码

用reducer实现累加：

let arr = [1, 2, 3, 4, 5];

let result = arr.reduce((sum, current) => sum + current, 0);

alert(result); // 15
复制代码

如果不传初始值，==那么accumulator的初始值为arr[0],item值为arr[1],index为1==

还有一个redueRight方法，用法与reducer一样，只不过是从右往左遍历

判断数组的方法

Array.isArray(arr); // true
arr.__proto__ === Array.prototype; // true
arr instanceof Array; // true
Object.prototype.toString.call(arr); // "[object Array]"
复制代码

其他方法

Array.form

**Array.from()** 方法对一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。

fill

**fill()** 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

const array1 = [1, 2, 3, 4];

// fill with 0 from position 2 until position 4
console.log(array1.fill(0, 2, 4));
// expected output: [1, 2, 0, 0]

// fill with 5 from position 1
console.log(array1.fill(5, 1));
// expected output: [1, 5, 5, 5]

console.log(array1.fill(6));
// expected output: [6, 6, 6, 6]
复制代码

字符串常用函数整理

改变大小写

toLowerCase() 和 toUpperCase()

alert( 'Interface'.toUpperCase() ); // INTERFACE
alert( 'Interface'.toLowerCase() ); // interface
复制代码

查找字符串

str.indexOf

第一个方法是 str.indexOf(substr, pos):==它从给定位置 pos 开始，在 str 中查找 substr，如果没有找到，则返回 -1，否则返回匹配成功的位置==。

includes，startsWith，endsWith

str.includes(substr, pos)根据 str 中是否包含 substr 来返回 true/false。

如果我们需要检测匹配，但不需要它的位置，那么这是正确的选择：

alert( "Widget with id".includes("Widget") ); // true

alert( "Hello".includes("Bye") ); // false
复制代码

str.includes 的第二个可选参数是开始搜索的起始位置：

alert( "Midget".includes("id") ); // true
alert( "Midget".includes("id", 3) ); // false, 从位置 3 开始没有 "id"
复制代码

方法 str.startsWith和 str.endsWith 的功能与其名称所表示的意思相同：

alert( "Widget".startsWith("Wid") ); // true，"Widget" 以 "Wid" 开始
alert( "Widget".endsWith("get") ); // true，"Widget" 以 "get" 结束
复制代码

获取字符串

str.slice(start [, end])

返回字符串从 start 到（但不包括）end 的部分。

例如：

let str = "stringify";
alert( str.slice(0, 5) ); // 'strin'，从 0 到 5 的子字符串（不包括 5）
alert( str.slice(0, 1) ); // 's'，从 0 到 1，但不包括 1，所以只有在 0 处的字符
复制代码

如果没有第二个参数，slice 会一直运行到字符串末尾：

let str = "stringify";
alert( str.slice(2) ); // 从第二个位置直到结束
复制代码

start/end 也有可能是负值。它们的意思是起始位置从字符串结尾计算：

let str = "stringify";

// 从右边的第四个位置开始，在右边的第一个位置结束
alert( str.slice(-4, -1) ); // 'gif'
复制代码

str.substring(start [, end])

返回字符串在 start 和 end 之间 的部分。

这与 slice 几乎相同，但它允许 start 大于 end。

例如：

let str = "stringify";

// 这些对于 substring 是相同的
alert( str.substring(2, 6) ); // "ring"
alert( str.substring(6, 2) ); // "ring"

// ……但对 slice 是不同的：
alert( str.slice(2, 6) ); // "ring"（一样）
alert( str.slice(6, 2) ); // ""（空字符串）
复制代码

不支持负参数（不像 slice），它们被视为 0。

str.substr(start [, length])

返回字符串从 start 开始的给定 length 的部分。

与以前的方法相比，这个允许我们指定 length 而不是结束位置：

let str = "stringify";
alert( str.substr(2, 4) ); // 'ring'，从位置 2 开始，获取 4 个字符
复制代码

第一个参数可能是负数，从结尾算起：

let str = "stringify";
alert( str.substr(-4, 2) ); // 'gi'，从第 4 位获取 2 个字符
复制代码

其他方法

• str.codePointAt(pos)

  返回在 pos 位置的字符代码 :// 不同的字母有不同的代码 alert( "z".codePointAt(0) ); // 122 alert( "Z".codePointAt(0) ); // 90

• String.fromCodePoint(code)

  通过数字 code 创建字符alert( String.fromCodePoint(90) ); // Z我们还可以用 \u 后跟十六进制代码，通过这些代码添加 unicode 字符：// 在十六进制系统中 90 为 5a alert( '\u005a' ); // Z

• str.trim()

  trim() 方法会从一个字符串的两端删除空白字符。在这个上下文中的空白字符是所有的空白字符 (space, tab, no-break space 等) 以及所有行终止符字符（如 LF，CR等）。