javascript常用的数组方法(javascript常用的数据类型)

javascript常用的数组方法 文章目录-1 序言0. delete 数组元素的删除1. push 数组元素的添加2. pop 删除数组末尾元素3. unshift 数组最前面添加元素4. shift 删除数组最前面的元素5 . splice 数组元素的截取6. reverse 数组元素的反转7. sort 数组元素的排序8. concat 数组的拼接9. join 数组元素的拼接10. split 字符串的切割11. indexOf 数组元素的查找13. lastIndexOf 数组元素的查找13. includes 数组元素的查找14. slice 数组的截取16. isArray 判断是否为数组16. toString17. flat 数组的扁平化18. Array 创建一个数组实例19. fill 数组的填充20. from 转换类数组为标准的数组21 fouEach 数组的遍历22. map 数组的遍历并映射23. filter 数组的遍历并过滤24. reduce-1 序言本文档统计了数组的常用方法,其中有参数可能不完整.请转至mdn查看0. delete 数组元素的删除a.语法: delete arr[2]b.描述 删除数组的某一项的内容,或者说将某一项的内容置为空,c.返回值d.特点 改变原数组,长度不发生变化 var arr = [1,6,8,9,6] delete arr[3] console.log(arr) // [1, 6, 8, empty, 6] console.log(arr[3]) // undefined1. push 数组元素的添加a.语法 arr.push(1,2,5)b.描述 向数组末尾追加 一个 或 多个 元素c.返回值 追加元素之后的数组的 长度d.特点 改变原数组,长度发生变化2. pop 删除数组末尾元素a.语法 arr.pop()b.描述 删除数组 末尾 的 一个 元素c.返回值 被删除的元素d.特点 改变原数组,长度发生变化3. unshift 数组最前面添加元素a.语法 arr.unshift(1,2,3)b.描述 在数组最前面添加 一个 或 多个 元素c.返回值 追加元素之后的数组的 长度d.特点 改变原数组,长度发生变化4. shift 删除数组最前面的元素a.语法 arr.shift()b.描述 删除数组最前面的一个元素c.返回值 被删除的那个元素d.特点 改变原数组,长度发生变化5 . splice 数组元素的截取a.语法 arr.splice(索引位置,[截取个数],[追加的新元素])b.描述 截取数组元素。​ 第一个参数:从索引位置,包括索引,开始截取​ 第二个参数:截取个数,可选,---- 不写 将当前索引及以后的元素全部截取​ 第三个参数:将截取的元素替换追加为新元素c. 返回值 一个数组,数组中为截取的元素d.特点 改变原数组,返回新数组var arr = [1,5,6,6,9,7,8,25,4]var newArr = arr.splice(2) arr = [1,5] newArr = [6,6,9,7,8,25,4]var newArr = arr.splice(2,3) arr = [1,5,7,8,25,4] newArr = [6,6,9]var newArr = arr.splice(2,3,'aa',5,'6','bb') arr = [1,5,'aa',5,'6','bb',7,8,25,4] newArr = [6,6,9]6. reverse 数组元素的反转a.语法 arr.reverse()b.描述 反转数组c.返回值 反转后的数组 === arrd.特点 改变原数组var arr = [1,5,6,9]var newArr = arr.reverse() console.log(arr === newArr) //true console.log(arr) [9,6,5,1] console.log(newArr) [9,6,5,1]7. sort 数组元素的排序a.语法 arr.sort(function(a,b){return a-b}) // 升序a.语法 arr.sort(function(a,b){return b-a}) // 降序b.描述 数组排序 可选参数，不传按照字符编码 升序 排序c.返回值 反转后的数组 === arrd.特点 改变原数组 var arr = [1,2,3,5,'6',8,7,'22',23,45] var newArr = arr.sort() console.log(arr === newArr) //true console.log(arr) [1, 2, "22", 23, 3, 45, 5, "6", 7, 8,] console.log(newArr) [1, 2, "22", 23, 3, 45, 5, "6", 7, 8,] arr.sort(function(a,b){return a-b}) // 升序 console.log(arr) [1, 2, 3, 5, "6", 7, 8, "22", 23, 45] console.log(newArr) [1, 2, 3, 5, "6", 7, 8, "22", 23, 45] arr.sort(function(a,b){return b-a}) // 降序 console.log(arr) [45, 23, "22", 8, 7, "6", 5, 3, 2, 1] console.log(newArr) [45, 23, "22", 8, 7, "6", 5, 3, 2, 1]8. concat 数组的拼接a.语法 : arr.concat(arr1,arr2,arr3)b.描述 : 数组拼接,将多个数组拼接成一个数组c.返回值 : 一个拼接后的新数组d.特点 : 不改变原数组 var arr = [1,2,3] var arr1 = [25,36,78] var arr2 = [25,78,1,45] var newArr = arr.concat(arr1,arr2)console.log(arr) [1, 2, 3]console.log(newArr) [1, 2, 3, 25, 36, 78, 25, 78, 1, 45]console.log('newArr===arr1',newArr===arr1) // false9. join 数组元素的拼接a.语法 : arr.join('分隔符')b.描述 : 将数组内元素以一定分隔符拼接成字符串,分隔符如下案例c.返回值 : 字符串d.特点 : 不改变原数组e.案例 var arr = [1,2,3] var newArr = arr.join() console.log(newArr) // 1,2,3 var newArr = arr.join('') console.log(newArr) // 123 var newArr = arr.join('aa') console.log(newArr) // 1aa2aa310. split 字符串的切割a.语法 : str.split('分隔符')b.描述 : 将字符串 以一定分隔符号转换成数组c.返回值 : 返回切割好的数组 var str = '465a76a986a6769' var arr = str.split() console.log(arr) // ["465a76a986a6769"] var arr = str.split('') console.log(arr) // ["4", "6", "5", "a", "7", "6", "a", "9", "8", "6", "a", "6", "7", "6", "9"] var arr = str.split('6') console.log(arr) // ["4", "5a7", "a98", "a", "7", "9"] var arr = str.split('a') console.log(arr) // ["465", "76", "986", "6769"]11. indexOf 数组元素的查找a.语法 : arr.indexOf('内容')b.描述 : 用来查找数组中某一项的索引,c.返回值 : 若查找的内容在数组中不存在,则返回 -1 ,存在返回 顺序开始找到的 索引 var arr = [1,6,8,9,6]var newArr = arr.indexOf(3) // -1 console.log(newArr) var newArr = arr.indexOf(6) console.log(newArr) // 113. lastIndexOf 数组元素的查找a.语法 : arr.lastIndexOf('内容')b.描述 : 用来查找数组中某一项的索引,c.返回值 : 若查找的内容在数组中不存在,则返回 -1 ,存在返回 倒序 开始找到的 索引 var arr = [1,6,8,9,6]var newArr = arr.indexOf(3) // -1 console.log(newArr) var newArr = arr.indexOf(6) console.log(newArr) // 413. includes 数组元素的查找a.语法 : arr.includes('内容')b.描述 : 判断内容是否数组中存在c.返回值 : 若查找的内容在数组中不存在,则返回 false ,存在返回 truevar arr = [1,2,3,5]var a = arr.includes(6) // falsevar a = arr.includes(2) // true14. slice 数组的截取a.语法 : const newArr = arr.slice([start],[end])b.参数: start 开始索引 end 结束索引b.描述 : 对数组元素从一定位置进行截取,返回一个截取后的新数组,不改变原数组,不包含结束索引c.返回值 : 截取后的新数组const arr = [1,2,3]const newArr = arr.slice(1,2)console.log('aa1',newArr) // aa1 [ 2 ]console.log('aa2',arr) // aa2 [ 1, 2, 3 ]16. isArray 判断是否为数组a.语法 : Array.isArray(arr)b.描述 : 判断传入的对象是否是一个数组c.返回值 : false truevar arr = [1,2,3]console.log(Array.isArray(arr)) // truevar arr = {name:123}console.log(Array.isArray(arr)) // false16. toStringa.语法 : arr.toString()b.描述 : 将数组转化为字符串c.返回值 : 转化后的字符串let arr = [1, 2, 3, 4, 5]; let str = arr.toString() console.log(str)// 1,2,3,4,517. flat 数组的扁平化数组的扁平化按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。不改变原数组 返回新数组const arr1 = [0, 1, 2, [3, 4]];console.log(arr1.flat()); // 默认depth 为1const arr2 = [0, 1,undefined,null,'', 2, [[[3, 4]]]];// 全局属性 Infinity 是一个数值，表示无穷大。console.log('Infinity',Infinity) // Infinityconsole.log('Infinity typeof',typeof Infinity) // number// Infinity 展开任意深度console.log(arr2.flat(Infinity)); // [ 0, undefined, null, '', 2, 3, 4 ]const arr = new Array(2) // // flat会移除数组中的空项arr[0] = 'aaaa'console.log(arr.flat()) // [ 'aaaa' ]18. Array 创建一个数组实例

推荐整理分享javascript常用的数组方法(javascript常用的数据类型)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:javascript常用的内置对象有哪些,javascript常用的输出语句有哪些,javascript常用的英文单词,javascript常用的输出语句有哪些,javascript常用的输入/输出语句有哪些?,javascript常用的输出语句,javascript常用的输入/输出语句有哪些?,javascript常用的输出语句,内容如对您有帮助，希望把文章链接给更多的朋友！

数组的构造函数

const arr = new Array(10) console.log('arr',arr) // 创建了一个数组长度为10的数组 console.log(arr[0] === null) // false console.log(arr[0] === undefined) // undefined console.log('1111', typeof arr[0]) // undefined const arr1 = new Array(10,20,30) // 创建一个数组 [10,20,30]19. fill 数组的填充数组的填充用一个固定值填充一个数组中从起始索引到终止索引内的全部元素, 不包括终止索引语法: arr.fill(value,[start],[end])参数: value: 填充的值 start: 开始索引位置 end: 结束索引位置[1, 2, 3].fill(4); // [4, 4, 4][1, 2, 3].fill(4, 1); // [1, 4, 4][1, 2, 3].fill(4, 1, 2); // [1, 4, 3][1, 2, 3].fill(4, 1, 1); // [1, 2, 3][1, 2, 3].fill(4, 3, 3); // [1, 2, 3][1, 2, 3].fill(4, -3, -2); // [4, 2, 3][1, 2, 3].fill(4, NaN, NaN); // [1, 2, 3][1, 2, 3].fill(4, 3, 5); // [1, 2, 3]Array(3).fill(4); // [4, 4, 4]20. from 转换类数组为标准的数组转换类数组为标准的数组对一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例const set = new Set(['foo', 'bar', 'baz', 'foo']);console.log(Array.from(set)) // [ 'foo', 'bar', 'baz' ]function f() { return Array.from(arguments);} console.log( f(1, 2, 3)) // [ 1, 2, 3 ]21 fouEach 数组的遍历遍历数组语法: arr.forEach((ele,[index],[arr]) =>{})参数: ele:每一个元素 index: 数组索引 arr数组本身const arr = [1,2,3]arr.forEach((ele,index,arr) =>{})22. map 数组的遍历并映射数组的映射对原数组进行遍历,并返回一个新的数组,新的数组元素为每一次遍历回调函数的返回值,不改变原数组,返回新数组语法: arr.map((ele,[index],[arr]) =>{ return ele})参数: ele: 数组的每一个元素 index 数组元素索引 arr 数组本身const arr = [1,2,3]const newArr = arr.map((ele,index,arr) =>{ return 1})console.log('11',newArr) // 11 [ 1, 1, 1 ]23. filter 数组的遍历并过滤

数组的过滤

对原数组进行遍历,并返回新的数组,新的数组的元素是遍历时回调函数返回为true时的那一项

不改变原数组,返回新数组

const arr = [1,2,3]const newArr = arr.filter((ele,index,arr) =>{ return ele > 1})console.log('11',newArr) // 11 [ 2, 3 ]24. reduce可以将每一次回调的返回值当作参数传递给下一次的回调对数组中的每个元素按序执行一个由您提供的 reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。语法: const total = arr.reduce((pre,cur,index,arr) =>{return pre + cur},initValue)参数: initValue: 初始值 pre: 上一次的返回值 cur 当前的数组的元素const arr = [1,2,3]const total = arr.reduce((pre,cur,index,arr) =>{ return pre + cur},0)console.log('aa',total) // 6