关于js中数组的方法使用一

1. concat() 2. entries() 3. every() 4.fill() 5. filter() 6. find() 7. findIndex()  8. forEach() 9. from() 10. includes()

1. concat() 是 JavaScript 中用于合并数组的方法。它不会改变现有的数组,而是返回一个新的数组,其中包含了原始数组和作为参数传递给 concat() 方法的一个或多个数组或值。

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const array3 = [7, 8, 9];

// 合并多个数组
const newArray = array1.concat(array2, array3);

console.log(newArray); // 输出: [1, 2, 3, 4, 5, 6, 7, 8, 9]

此外,concat() 方法也可以用来连接单个值或者其他非数组对象到一个数组中

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

// 合并单个值到数组中
const newArray = array1.concat(singleValue);

console.log(newArray); // 输出: [1, 2, 3, 4]

2. entries() 是 JavaScript 中数组的一个方法,用于创建一个数组迭代器对象,该对象包含数组中每个元素的索引值和对应的值,以键值对 [index, value] 的形式返回。

const array = ['a', 'b', 'c'];
const iterator = array.entries();

for (const entry of iterator) {
  console.log(entry);
}

// 输出:
// [0, 'a']
// [1, 'b']
// [2, 'c']

3. every() 方法是 JavaScript 数组的一个方法,用于检查数组中的所有元素是否满足指定的条件,如果所有元素都满足条件,则返回 true,否则返回 false

它接受一个函数作为参数,该函数用于定义对数组中每个元素的测试条件。这个函数会接收数组中的每个元素作为参数,并返回一个布尔值。

const array = [2, 4, 6, 8, 10];

// 检查数组中所有元素是否都是偶数
const allEven = array.every(element => element % 2 === 0);

console.log(allEven); // 输出: true,因为所有元素都是偶数

4.fill() 是 JavaScript 数组的方法,用于填充数组的所有元素(从起始索引到结束索引)到一个静态值。

它接受三个参数:

  • value:用于填充数组的值。
  • start(可选):起始索引,默认为 0。
  • end(可选):结束索引,默认为数组的长度。
const array = [1, 2, 3, 4, 5];

// 用 0 填充数组的所有元素
array.fill(0);

console.log(array); // 输出: [0, 0, 0, 0, 0]

你也可以指定开始和结束索引:

const array = [1, 2, 3, 4, 5];

// 用 0 填充数组的索引 1 到 3(不包括索引 3)的元素
array.fill(0, 1, 3);

console.log(array); // 输出: [1, 0, 0, 4, 5]

5. filter() 是 JavaScript 数组的一个方法,用于创建一个新数组,其中包含符合特定条件的所有元素。

它接受一个回调函数作为参数,这个函数会被传递给数组中的每个元素,用于定义筛选条件。这个函数返回 true 则保留该元素,返回 false 则丢弃该元素。

const array = [1, 2, 3, 4, 5];

// 过滤出所有大于 2 的元素
const filteredArray = array.filter(element => element > 2);

console.log(filteredArray); // 输出: [3, 4, 5]

filter() 方法会对数组中的每个元素调用传入的回调函数,将回调函数返回 true 的元素添加到新的数组中,最后返回这个新的数组。

用来做删除再适合不过了:

const array = [1, 2, 3, 4, 5];

// 过滤掉数组中的数字 3
const filteredArray = array.filter(element => element !== 3);

console.log(filteredArray); // 输出: [1, 2, 4, 5]

6. find() 是 JavaScript 数组的方法,用于查找数组中符合特定条件的第一个元素,并返回该元素的值。如果没有符合条件的元素,则返回 undefined

它接受一个回调函数作为参数,这个函数会被传递给数组中的每个元素,用于定义查找条件。这个函数返回 true 表示找到符合条件的元素,find() 方法会返回该元素的值;如果所有元素都不满足条件,则返回 undefined

const array = [10, 20, 30, 40, 50];

// 查找第一个大于 25 的元素
const foundElement = array.find(element => element > 25);

console.log(foundElement); // 输出: 30

在这个例子中,find() 方法会返回数组中第一个大于 25 的元素,即值为 30。

如果没有符合条件的元素,它会返回 undefined:

const array = [10, 20, 30, 40, 50];

// 查找第一个大于 60 的元素
const foundElement = array.find(element => element > 60);

console.log(foundElement); // 输出: undefined

find() 方法常用于查找数组中符合特定条件的第一个元素,可以方便地获取满足条件的元素值。

7. findIndex() 是 JavaScript 数组的方法,类似于 find(),但是它返回符合条件的第一个元素的索引值,而不是元素本身。如果没有找到符合条件的元素,则返回 -1

它也接受一个回调函数作为参数,该函数会被传递给数组中的每个元素,并在满足条件时返回当前元素的索引。

const array = [10, 20, 30, 40, 50];

// 查找第一个大于 25 的元素的索引
const foundIndex = array.findIndex(element => element > 25);

console.log(foundIndex); // 输出: 2

在这个例子中,findIndex() 方法会返回数组中第一个大于 25 的元素的索引,即值为 30 的元素的索引 2。

如果没有找到符合条件的元素,它会返回 -1

const array = [10, 20, 30, 40, 50];

// 查找第一个大于 60 的元素的索引
const foundIndex = array.findIndex(element => element > 60);

console.log(foundIndex); // 输出: -1

findIndex() 方法常用于查找数组中符合特定条件的第一个元素的索引,可以方便地获取满足条件的元素在数组中的位置。

8. forEach() 是 JavaScript 数组的方法,用于对数组中的每个元素执行指定的操作。它接受一个回调函数作为参数,该函数会被传递给数组中的每个元素,并对每个元素执行回调函数定义的操作。

const array = [1, 2, 3, 4, 5];

// 对数组中的每个元素执行操作
array.forEach(element => {
  console.log(element * 2); // 以当前元素的两倍打印出来
});

forEach() 方法遍历数组中的每个元素,并对每个元素执行回调函数中定义的操作。它不会返回新的数组,仅用于对数组中的元素进行遍历和处理。

注意,forEach() 中传递的回调函数可以接受三个参数:element(当前元素的值)、index(当前元素的索引)和 array(当前正在遍历的数组):

const array = [1, 2, 3, 4, 5];

// 对数组中的每个元素执行操作,并输出索引和当前元素的值
array.forEach((element, index) => {
  console.log(`Index ${index}: ${element}`);
});

forEach() 是用于遍历数组的常用方法,用于对数组中的每个元素执行特定操作,例如修改数组元素、对数组元素进行处理或者执行其他操作。

9. from() 是 JavaScript 中用于创建新数组的静态方法。它可以从类数组对象或可迭代对象中创建一个新的数组实例。

从类数组对象创建数组:

const arrayLikeObject = { 0: 'a', 1: 'b', 2: 'c', length: 3 };

// 从类数组对象中创建数组
const newArray = Array.from(arrayLikeObject);

console.log(newArray); // 输出: ['a', 'b', 'c']

从可迭代对象(比如字符串、Set、Map 等)创建数组:

const set = new Set(['foo', 'bar', 'baz']);

// 从 Set 对象中创建数组
const newArray = Array.from(set);

console.log(newArray); // 输出: ['foo', 'bar', 'baz']

Array.from() 接受一个类数组对象或者可迭代对象作为第一个参数,以及一个可选的映射函数和一个可选的上下文对象作为第二个和第三个参数。它会返回一个新的数组,包含传入对象中的元素。

这个方法非常有用,可以将各种类型的对象转换为数组,便于数组的操作和处理。

注解:什么是从类数组对象和从可迭代对象????????
        从类数组对象指的是具有数值键和 length 属性的对象,但不具备数组的原型方法和属性,常见的例子包括函数内部的 arguments 对象和 DOM 元素列表(比如 document.querySelectorAll() 返回的结果)等。这些对象看起来像数组,但是不能直接使用数组的方法和属性。

// 类数组对象
const arrayLikeObject = { 0: 'a', 1: 'b', 2: 'c', length: 3 };

        而可迭代对象则是指那些实现了可迭代接口(Iterable)的对象,它们可以通过迭代器(iterator)来遍历其中的元素。在 JavaScript 中,包括了一些内置的数据结构如字符串、Set、Map 等。

// 可迭代对象的例子

// 字符串
const str = 'Hello';
// Set 对象
const set = new Set([1, 2, 3]);
// Map 对象
const map = new Map([['a', 1], ['b', 2]]);

10. includes() 是 JavaScript 数组的方法,用于判断数组中是否包含某个特定的元素,如果包含则返回 true,否则返回 false

它接受一个参数,用于指定要检查是否存在的值,并返回一个布尔值来表示是否包含该值。

const array = [1, 2, 3, 4, 5];

// 检查数组中是否包含值为 3 的元素
const hasThree = array.includes(3);

console.log(hasThree); // 输出: true,因为数组中包含值为 3 的元素

includes() 方法会返回布尔值 truefalse,用来判断数组中是否存在指定的值。如果数组中包含指定的值,则返回 true,否则返回 false。这个方法会搜索整个数组,只要找到第一个匹配的元素就会停止搜索并返回 true。

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值