es6面试 Array数组的使用 (1)

map()

将数组的所有成员依次传入参数函数,然后把每一次的执行结果组成一个新数组返回。

var numbers = [1, 2, 3];
numbers.map(function (n) {
  return n + 1;
});
// [2, 3, 4]
numbers
// [1, 2, 3]
//numbers数组的所有成员依次执行参数函数,运行结果组成一个新数组返回,原数组没有变化。
map方法接受一个函数作为参数。该函数调用时,
map方法向它传入三个参数:当前成员、当前位置和数组本身。
[1, 2, 3].map(function(item, index, arr) {
  return item * index;
});
// [0, 2, 6]

forEach()
//forEach( function(item,index,array){})参数是一个函数,该函数同样接受三个参数:当前值、当前位置、整个数组。
//forEach方法与map方法很相似,对数组的所有成员依次执行参数函数。
//但是,forEach方法不返回值,只用来操作数据。
//如果数组遍历的目的是为了得到返回值,那么使用map方法,否则使用forEach方法。

function log(item, index, array) {
  console.log('[' + index + '] = ' + item);
}
[2, 5, 9].forEach(log);
// [0] = 2
// [1] = 5
// [2] = 9

forEach方法也可以接受第二个参数,绑定参数函数的this变量。
var out = [];
[1, 2, 3].forEach(function(elem) {
  this.push(elem * elem);
}, out);
out // [1, 4, 9]
上面代码中,空数组out是forEach方法的第二个参数,结果,回调函数内部的this关键字就指向out。

注意,forEach方法无法中断执行,总是会将所有成员遍历完。如果希望符合某种条件时,就中断遍历,要使用for循环。

var log = function (n) {
  console.log(n + 1);
};
[1, undefined, 2].forEach(log)
// 2
// NaN
// 3
[1, null, 2].forEach(log)
// 2
// 1
// 3
[1, , 2].forEach(log)
// 2
// 3

上面代码中,forEach方法不会跳过undefined和null,但会跳过空位。

undefined + 1  //NAN
null + 1  //1
??undefined与null的差异

undefined与null undefined与null区别

null:Null类型,代表“空值”,代表一个空对象指针,使用typeof运算得到 “object”,
所以你可以认为它是一个特殊的对象值。
undefined: Undefined类型,当一个声明了一个变量未初始化时,得到的就是undefined。

javaScript高级程序设计: 在使用var声明变量但未对其加以初始化时,
这个变量的值就是undefined。   null值则是表示空对象指针
可以看做:undefined是访问一个未初始化的变量时返回的值,
而null是访问一个尚未存在的对象时所返回的值。
因此,可以把undefined看作是空的变量,而null看作是空的对象。
filter()

//使用数组中通过测试的每个元素创建新数组。
它的参数是一个函数,所有数组成员依次执行该函数,返回结果为true的成员组成一个新数组返回。该方法不会改变原数组。

[1, 2, 3, 4, 5].filter(function (elem) {
  return (elem > 3);
})
// [4, 5]

filter方法还可以接受第二个参数,用来绑定参数函数内部的this变量。

var obj = { 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, obj) // [8, 4, 9]

上面代码中,过滤器myFilter内部有this变量,它可以被filter方法的第二个参数obj绑定,返回大于3的成员。

find() findIndex()

//find返回数组中第一个通过测试的元素的值
//findIndex返回数组中第一个通过测试的元素的下标

includes()

//检查数组是否包含指定的元素
定义:includes() 方法用于判断字符串是否包含指定的子字符串---返回的是布尔值
语法:string.includes(searchvalue, start)
searchvalue:必需,要查找的字符串。
start:可选,设置从那个位置开始查找,默认为 0。

var arr1 = ['张三','李四','王五'];
var flag3 = arr1.includes('王五');
var flag4 = arr1.includes('潇洒哥');
console.log(flag3) // true
console.log(flag4) // false

注意: includes() 方法区分大小写。

some() every()

//some检查数组中的任何元素是否通过测试。
//every检查数组中的每个元素是否通过测试。
它们接受一个函数作为参数,所有数组成员依次执行该函数。该函数接受三个参数:当前成员、当前位置和整个数组,然后返回一个布尔值。

var arr = [1, 2, 3, 4, 5];
arr.some(function (elem, index, arr) {
  return elem >= 3;
});
// true
arr.every(function (elem, index, arr) {
  return elem >= 3;
});
// false

some方法是只要一个成员的返回值是true,则整个some方法的返回值就是true,否则返回false
every方法是所有成员的返回值都是true,整个every方法才返回true,否则返回false。

注意,对于空数组,some方法返回false,every方法返回true,回调函数都不会执行。

function isEven(x) { return x % 2 === 0 }
[].some(isEven) // false
[].every(isEven) // true

some和every方法还可以接受第二个参数,用来绑定参数函数内部的this变量。

reduce(),reduceRight()

reduce的用法

//reduce方法和reduceRight方法依次处理数组的每个成员,最终累计为一个值。
//它们的差别是,reduce是从左到右处理(从第一个成员到最后一个成员),
//reduceRight则是从右到左(从最后一个成员到第一个成员),其他完全一样。
[1, 2, 3, 4, 5].reduce(function (a, b) {
  console.log(a, b);
  return a + b;
})
// 1 2
// 3 3
// 6 4
// 10 5
//最后结果:15

reduce 方法和 reduceRight 方法的第一个参数都是一个函数。该函数接受以下四个参数。
1.累积变量,默认为数组的第一个成员
2.当前变量,默认为数组的第二个成员
3.当前位置(从0开始)
4.原数组
注意:函数必须要有返回值
当reduce一个空的数组时,

posted @ 2021-11-29 10:21  xiao旭  阅读(39)  评论(0编辑  收藏  举报