目录
25.数组操作keys()、values()、entries()的使用与区别
1.isArray()
（1）定义和用法
isArray() 方法确定对象是否为数组。
如果对象是数组，则此函数返回 true，否则返回 false
（2）语法
Array.isArray(obj) //obj, 必需。需测试的对象。(3)代码实例
//返回的都是true
console.log(Array.isArray([]));
console.log(Array.isArray([1,2,3]));
console.log(Array.isArray(new Array()));
// 下面的函数调用都返回 false
console.log(Array.isArray());
console.log(Array.isArray(null));
console.log(Array.isArray(undefined));
console.log(Array.isArray('Array'));
console.log(Array.isArray(true));
var obj = {
a: 1,
b: 2};（4）注意事项
返回值类型是布尔值。如果对象是数组则返回 true，否则返回 false
2.push()
（1）定义和用法
push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度
（2）语法
array.push(item1, item2, ..., itemX)（3）代码实例
var arr = []var length = arr.push('first')
console.log(arr) // ['first']
console.log(length) // 1 （4）注意事项
push方法会改变原有数组，且返回改变后数组的长度
3.pop()
(1)定义和用法
pop() 方法用于删除并返回数组的最后一个元素。即pop() 方法将删除 arrayObject 的最后一个元素，把数组长度减 1，并且返回它删除的元素的值。
（2）语法
array.pop()（3）实例
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop(); // "Mango"（4）注意事项
如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。
4.unshift()
（1）定义和用法
unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。
即unshift() 方法将把它的参数插入 数组 的头部，并将已经存在的元素顺次地移到较高的下标处，以便留出空间。该方法的第一个参数将成为数组的新元素 0，如果还有第二个参数，它将成为新的元素 1，以此类推。
（2）语法
array.unshift(item1, item2, ..., itemX)（3）代码实例
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var after = fruits.unshift("Lemon", "Pineapple");
console.log(after) //6
console.log(fruits) //[ 'Lemon', 'Pineapple', 'Banana', 'Orange', 'Apple', 'Mango' ]（4）注意事项
返回值是把指定的值添加到数组的开头之后的新长度。
5.shift()
（1）定义与用法
shift() 方法移除数组的第一个元素，并返回所删除的元素
（2）语法
array.shift()（3）代码实例
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift(); // 返回 "Banana"（4）注意事项
- 无参数。
- shift() 方法会改变数组的长度。
- shift 方法的返回值是被移除的项目。
- shift() 方法会改变原始数组。
6.find()
(1)定义和用法
find() 方法是 JavaScript 中用于在数组中查找特定条件的第一个元素，如果找到一个元素使得回调函数返回true，则该元素作为结果返回；如果没有找到这样的元素，则返回undefined，该函数不会修改原始数组
(2)语法
array.find(function(currentValue, index, arr),thisValue)
(3)代码实例
let test = [1, 2, 3, 4, 5,6];
let a = test.find(item => item > 3);
console.log(a); //4
let c = test.find(item => item == 0);
console.log(c); //undefined(4)注意事项
- find() 方法会遍历整个数组，直到找到满足条件的元素或者遍历完整个数组。
- 如果数组为空，那么返回 undefined。
- 当多个元素符合条件时，find() 方法只会返回第一个符合条件的元素。
- find() 对于空数组，函数是不会执行的。
- find() 并没有改变数组的原始值
7.includes()
（1）定义和用法
includes() 方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。
（2）语法
arr.includes(searchElement, fromIndex)| searchElement | 必须。需要查找的元素值。 |
| fromIndex | 可选。从该索引处开始查找 searchElement。如果为负值，则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。 |
（3）代码实例
const arr = ['a','b','c','d','abc']
console.log(arr.includes('a'),arr.includes('e'));
// 结果 true，false（4）注意事项
该方法的第二个参数表示搜索的起始位置，默认为 0 。如果第二个参数为负数，则表示倒数的位置，如果这时它大于数组长度（比如第二个参数为 -3 ，但数组长度为 2），则会重置为从 0 开始。
console.log([1, 2, 3].includes(3, 2)) // true
console.log([1, 2, 3].includes(1, -2)); // false8. findIndex()
(1)定义和用法
findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1
(2)语法
arr.findIndex(callback[, thisArg])
//针对数组中的每个元素, 都会执行该回调函数, 执行时会自动传入下面三个参数:
//element 当前元素。
//index 当前元素的索引。
//array 调用findIndex的数组。
//thisArg 可选。执行callback时作为this对象的值.(3)代码实例
const arr = [1, 2, 3, 4, 5, 3, 3, 2, 4, 5 ]
// 可以这么写
const index = arr.findIndex(item => {
return item > 2
})
console.log(index) // 2
// 也可以这么写
const index = arr.findIndex(item => item > 2)
console.log(index) // 2(4)注意事项
- 返回值是首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1
- 这要注意的是findIndex()会给数组中的每一项执行一个函数来判断是否满足表达式，如果满足条件后，剩下的元素则不再执行
- 如果你需要非基本类型数组(例如对象)的索引，或者你的查找条件比一个值更复杂，可以使用这个方法。
9.indexof()
(1)定义和用法
indexOf() 方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。
(2)语法
arr.indexOf(searchElement[, fromIndex])searchElement是要查找的元素，fromIndex是可选参数，表示从哪个索引开始查找。当找到指定元素时，indexof方法会返回该元素所在数组中的索引，如果没有找到则返回-1。
(3)代码实例
let arr = [1,2,3,4,5,4,3,2,1];
console.log(arr.indexOf(1)); // 没有填fromIndex所以默认从索引为0的位置开始往后查找
// 0
console.log(arr.indexOf(1,1)); // 表示从索引为1的位置开始往后查找
// 8(4)注意事项
indexOf 与 findIndex 区别
indexOf：查找值作为第一个参数，采用===比较，更多的是用于查找基本类型，如果是对象类型，则是判断是否是同一个对象的引用findIndex：比较函数作为第一个参数，多用于非基本类型(例如对象)的数组索引查找，或查找条件很复杂
10.lastIndexOf()
(1)定义和用法
lastIndexOf()方法可以返回某个子字符串在字符串中最后出现的位置。
(2)语法
stringObject.lastIndexOf(searchvalue,fromindex)
| 参数 | 描述 |
|---|---|
| searchvalue | 必需。规定需检索的字符串值。 |
| fromindex | 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的最后一个字符处开始检索。 |
(3)代码实例
let str = "Hello world!"
console.log(str.lastIndexOf("Hello"))//0
console.log(str.lastIndexOf("World"))//-1
(4)注意事项
- indexOf和lastIndexOf语法是一样的，但查找的顺序相反，indexOf是从前往后查，而lastIndexOf是从后往前查。
- 返回值：如果检索到就返回所在的位置，没有检索到则返回-1
11.filter()
-
（1）定义和作用
filter过滤器：用于把Array的某些元素过滤掉，返回剩下的元素
filter()它用于把Array的某些元素过滤掉，然后返回剩下的元素。
filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
（2）语法
array.filter(function(currentValue,index,arr), thisValue)参数说明
- function(currentValue, index,arr)必须。函数，数组中的每个元素都会执行这个函数
- thisValue 可选。执行 function(currentValue,index,arr) 时的用于 this 的值。
- currentValue 必须。当前元素的值
- index 可选。当前元素的索引值
- arr 可选。当前元素属于的数组对象
- thisValue：可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"；
正常函数写法:
filter(function(item){
return 筛选条件
})
回调函数写法:
filter(item => 筛选条件)
这种写法可以省略function、（）、{}、return ；
当然需要满足一定的条件：{}里只有一句代码、（）只有一个参数；
filter(item => 筛选条件)
参数：
filter参数是一个回调函数
回调函数的参数是item，这个item指的是每一项元素：
返回结果是数组 （3）代码实例
let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let res = nums.filter((num) => {
return num > 5;
});
console.log(res); // [6, 7, 8, 9, 10]
（4）注意事项
- filter() 不会对空数组进行检测。
- filter() 不会改变原始数组。
12. map()
（1）定义和作用
map() 方法是数组原型的一个函数，该函数用于对数组中的每个元素进行处理，将其转换为另一个值，最终返回一个新的数组，该数组包含了经过处理后的每个元素
（2）语法
array.map(callback(currentValue[, index[, array]])[, thisArg])
- callback ：表示对数组中的每个元素要执行的函数。该函数包含三个参数：
- currentValue：表示正在处理的当前元素。
- index：可选参数，表示正在处理的当前元素的索引。
- array：可选参数，表示正在处理的当前数组。
- thisArg：可选参数，表示执行 callback 函数时的 this 值。
（3）代码实例
//参数分别为item（当前每一项），index（索引值）,index可省略不写
let b=[1,2,3].map((item,index)=>{
return item*2
})
console.log(b)//[2,4,6]
简写成
let b=[1,2,3].map((item,index)=> item*2 )
console.log(b)//[2,4,6]
（4）注意事项
map()不会对空数组进行检测map()不会改变原始数组（返回新数组）map()不会为数组中缺少的元素调用回调函数- 除数组对象外，
map()可由具有length属性且具有已按数字编制索引名的任何对象使用（如字符串对象）
13.forEach()
（1）定义和作用
forEach 更多的用来遍历数组、集合，forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数，总返回undefined
（2）语法
（3）代码实例
var array = ['a', 'b', 'c'];
array.forEach(function(element) {
console.log(element);
}); //输出为a b c（4）注意事项
- map()和foreach()的区别
- forEach()会修改原来的数组。map() 会分配内存空间存储新数组并返回，forEach() 不会返回数据
- forEach() 的执行速度 < map() 的执行速度
- forEach() 适合并不打算改变数据的时候，而只是想用数据做一些事情---比如存入数据库或者打印出来。 map() 适合你要改变数据值的时候
14.reduce()
（1）定义和作用
reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
reduce() 方法对数组中的每个元素执行一个由您提供的reduce函数(升序执行)，将其结果汇总为单个返回值。reduce方法可做的事情特别多，就是循环遍历能做的，reduce都可以做，比如数组求和、数组求积、数组中元素出现的次数、数组去重等等。
（2）语法
arr.reduce(function(prev,cur,index,arr){
...
}, init);
参数：
- prev 必需。累计器累计回调的返回值; 表示上一次调用回调时的返回值，或者初始值 init;
- cur 必需。表示当前正在处理的数组元素；
- index 可选。表示当前正在处理的数组元素的索引，若提供 init 值，则起始索引为- 0，否则起始索引为1；
- arr 可选。表示原数组；
- init 可选。表示初始值。
（3）代码实例
let arr = [1,2,3,4,5]
console.log(arr.reduce((a,b) => a + b)) // 15
console.log(arr.reduce((a,b) => a * b)) // 120（4）注意事项
reduce() 对于空数组是不会执行回调函数的。
15.some
（1）定义和作用
some方法的作用：判断数组中至少存在一个元素满足指定条件（函数提供）
some() 方法会依次执行数组的每个元素：
- 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
- 如果没有满足条件的元素，则返回false
（2）语法
array.some(function(currentValue,index,arr),thisValue)
（3）代码实例
var a = [11,50,40,3,5,80,90,4]
function some(item,index,array){
console.log(item); //11
return item>10
}
console.log(a.some(some)); //true
或者简写成
var a = [11,50,40,3,5,80,90,4]
console.log(a.some(item =>item>10)) //true（4）注意事项
- 返回的是true或false ,而不是具体的元素
- some如果遇到 true 就不在执行了。
- 如果都为 false 返回false。
- 不会改变原数组
16.every()
（1）定义和作用
- every()方法用于检测数组中的所有元素是否都满足指定条件（该条件为一个函数）。
- every()方法会遍历数组的每一项，如果有有一项不满足条件，则表达式返回false,剩余的项将不会再执行检测；如果遍历完数组后，每一项都符合条，则返回true。
（2）语法
array.every(function(currentValue,index,arr), thisValue)
参数说明：
- 第一个参数为一个回调函数，必传，数组中的每一项都会遍历执行该函数。
- currentValue：必传，当前项的值
- index：选传，当前项的索引值
- arr：选传，当前项所属的数组对象
- 第二个参数thisValue为可选参数，回调函数中的this会指向该参数对象。
（3）代码实例
var a = [11,50,40,3,5,80,90,4]
console.log(a.every(item =>item>10)) //false（4）注意事项
- every() 不会对空数组进行检测
- every() 不会改变原始数组
17.join()
（1）定义和作用
join() 方法主要是用于把数组中的所有元素转换一个字符串。
元素是通过指定的分隔符进行分隔的。
（2）语法
arrayObject.join(separator);
//separator可选，指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符（3）代码实例
let s = Array('Apple','is','on','my','table')
console.log((s.join())) //Apple,is,on,my,table
console.log((s.join(" "))) //Apple is on my table
console.log((s.join("/"))) //Apple/is/on/my/table（4）注意事项
如果省略分隔符，则默认使用逗号作为分隔符
18.split()
（1）定义和作用
split() 方法用于把一个字符串分割成字符串数组。
（2）语法
（3）代码实例
var arr="apple"
console.log(arr.split("")) //[ 'a', 'p', 'p', 'l', 'e' ]
console.log(arr.split("",4)) //[ 'a', 'p', 'p', 'l' ]
var arr = "a:b:c:d:e:f"
console.log(arr.split(":")) //[ 'a', 'b', 'c', 'd', 'e', 'f' ]（4）注意事项
- 该数组是通过在 separator 指定的边界处将字符串 stringObject 分割成子串创建的。
- 返回的数组中的字串不包括 separator 自身。
19.slice()
（1）定义和作用
slice() 方法用于返回一个包含该数组的一部分的新数组，它不修改原始数组，而是返回一个新数组
slice 方法可以用于数组和字符串，表示 “切片”。
（2）语法
arr.slice([begin[, end]])- begin: 从该索引处开始提取原数组中的元素,如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取， slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。如果省略 begin ，则 slice 从索引 0 开始。
- end: 在该索引处结束提取原数组元素（从0开始）。 slice 会提取原数组中索引从 begin 到 end 的所有元素（包含begin，但不包含end）。
（3）代码实例
var str=["a","b",3,"c","apple","d"]
console.log((str.slice(-2))) //[ 'apple', 'd' ]
console.log((str.slice(2))) //[ 3, 'c', 'apple', 'd' ]
console.log((str.slice(1,4))) //[ 'b', 3, 'c' ]
var str="Hello happy world!"
console.log((str.slice(6,11))) //happy
(4)注意事项
不修改原数组
20.splice()
（1）定义和作用
splice 方法用于数组或伪数组，根据参数个数和形式的不同，可以在数组中删除指定元素或者插入元素、替换元素。
（2）语法
1.参数个数为1的情况
arr.splice(i)
2.参数个数为2的情况
arr.splice(i, j)
3.参数个数为3或3个以上的情况
a.splice(i, j, e1, e2, ...)
i：整数，表示索引的起始位置
j：整数，表示删除的个数
e1、e2、...：删除相应元素之后要添加的元素
当 splice 方法有 3 个参数时，表示从索引为 i 位置开始删除 j 个元素，然后在从 i 位置添加 e1,e2,...，返回删除的元素，原地修改。
若 j 为 0，则表示一个元素也不删除，则元素从 i 前一个位置开始插入
若 j > 0，则表示从 i 位置开始（包括 i 位置）删除 j 个元素，然后从 i 后面开始插入。
（3）代码实例
var a = [1, 2, 3, 4, 5]
a.splice(-2, 2)
console.log(a) // [1, 2, 3]
var a = [1, 2, 3, 4, 5]
a.splice(1, 1, 'a', 'b', 'c')
console.log(a) //[1, 'a', 'b', 'c',3, 4, 5]
（4）注意事项
使用的时候很容易混淆 splice 和 slice 方法，记住 splice 方法只能用于数组，而 slice 方法可以用于数组和字符串，表示 “切片”。
21.contat()
（1）定义和作用
concat（）方法是用于连接两个或多个数组
（2）语法
array1.concat(array2,array3,...,arrayX)
（3）代码实例
var a = ["hello", "word"];
var b = ["java", "C++", "C#"];
var c = ["name"];
var d = a.concat(c,b);
console.log(d) //[ 'hello', 'word', 'name', 'java', 'C++', 'C#' ]（4）注意事项
该方法不会改变现有的数组
22.sort()
（1）定义和作用
sort() 方法用于对数组的元素进行排序。在默认情况下，sort()方法按升序排列数组——即最小的值位于最前面，最大的值排在最后面。为了实现排序，sort()方法会调用每个数组项的toString()转型方法，然后比较得到的字符串，以确定如何排序。即使数组中的每一项都是数值，sort()方法比较的也是字符串，
（2）语法
语法：arrayObject.sort(sortby)- sortby：可选。规定排序顺序。必须是函数。
- 返回值：数组在原数组上进行排序，不生成副本。
- 如果调用该方法时没有使用参数，按照字符编码的顺序进行排序。
Sort()比较函数排序
sort还可接收一个比较函数作为参数，以方便指定哪个值在前，哪个值在后。
比较函数接收两个参数，如果第一个参数应该位于第二个之前则返回一个负数，如果两个参数相等则返回0，如果第一个参数应该位于第二个之后则返回一个正数。
（3）代码实例
升序
function compare(a,b){
return a-b;
}
var values = [0,8,1,10,7];
values.sort(compare);
console.log(values); //[ 0, 1, 7, 8, 10 ]降序
function compare(a,b){
return b-a;
}
var values = [0,8,1,10,7];
values.sort(compare);
console.log(values); //[ 10, 8, 7, 1, 0 ]
（4）注意事项
- 当
return a-b;时，为升序排序。 - 当
return b-a;时，为降序排序。
23.reverse()
（1）定义和作用
reverse()方法用于反转（颠倒）数组中的元素。
（2）语法
arrayObject.reverse()
（3）代码实例
var arr = ['aa1', 'bb2', 'cc3'];
console.log(arr.reverse()); //[ 'cc3', 'bb2', 'aa1' ]
console.log(arr); //[ 'cc3', 'bb2', 'aa1' ]（4）注意事项
该方法会改变原数组。
24.fill()
（1）定义和作用
fill()方法的作用是使用一个固定值来替换数组中的元素。该固定值可以是字母、数字、字符串、数组等等。
（2）语法
array.fill(value, [start_index], [end_index]);
start_index是一个可选参数，它指定填充数组的起始索引，其默认值为0。其中第2、3个参数是可选的。表示替换的起始位置和结束位置（注：不包含结束位置本身所在的元素）
（3）代码实例
var arr3 = [12,23,34,45,56];
arr3.fill(123);
console.log(arr3) // [123,123,123,123,123]
const arr = [1, 2, 3, 4, 5, 6, 7]
console.log(arr.fill(0, 2, 4)); //[1, 2, 0, 0,5, 6, 7]
（4）注意事项
- 返回修改后的数组
- 如果start为负数，则开始索引被计算为length+start
- 如果end为负数，则结束索引被计算为length+end
- start和end参数是可选的，默认值分别为0和arr.length
- 当一个对象被传递给fill方法时，填充数组的是这个对象的引用
25.数组操作keys()、values()、entries()的使用与区别
都以数组形式返回
1、Object.keys(Array )：对键名的遍历。
2、Object.values( Array)：对键值的遍历。
3、Object.entries( Array)：对键值对的遍历。
//对象
var test1 = {aa:2,bb:4,cc:7}
console.log(Object.keys(test1)); //[ 'aa', 'bb', 'cc' ]
console.log(Object.values(test1)); //[ 2, 4, 7 ]
console.log(Object.entries(test1)); //[ [ 'aa', 2 ], [ 'bb', 4 ], [ 'cc', 7 ] ]
//数组
var test2= [1,2,3,6]
console.log(Object.keys(test2)); //[ '0', '1', '2', '3' ]
console.log(Object.values(test2)); //[ 1, 2, 3, 6 ]
console.log(Object.entries(test2)); //[ [ '0', 1 ], [ '1', 2 ], [ '2', 3 ], [ '3', 6 ] ]
398
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
