JavaScript数组详细归纳

目录
  • 一、数组归纳
    • 1. 字符串拆分为数组
    • 2. 将集合和映射转换为新数组
    • 3. 对现有数组进行浅复制
    • 4. arguments 对象轻松转换为数组
    • 5. 转换自定义对象
  • 二、迭代器方法
  • 三、数组常用操作方法

一、数组归纳

1. 字符串拆分为数组

 console.log(Array.form("red")) // ["r", "e", "d"]

2. 将集合和映射转换为新数组

 const a1 = new Map().set("name","张三").set("age",18)

    console.log(Array.from(a1)) // [["name","张三"], ["age",18]

3. 对现有数组进行浅复制

 const a1 = [

        {

        name: "小明",

        age: 18,

        gender: "男"

        },

        {

            name: "小明",

            age: 18,

            gender: "男"

        }]

    const a2 = Array.from(a1)

    console.log(a2)

运行结果:

4. arguments 对象轻松转换为数组

 function argumentArray() {

        console.log(Array.from(arguments)) // [1, 2, 3, 4]

    }

    argumentArray(1, 2, 3, 4)

5. 转换自定义对象

let arrayLike = {

        0: '张三',

        1: '18',

        2: '男',

        3: ['猜猜', '是哪'],

        'length': 4

    }

    let arr = Array.from(arrayLike);

    console.log(arr);

运行结果:

Array.of(参数) 将将参数转换为数组

 Array.of(1, 2, 3, 4) // [1, 2, 3, 4]

二、迭代器方法

Array 的原型上有三个用于检索数组的方法:keys()values()entries()

 Array.of(1, 2, 3, 4) // [1, 2, 3, 4] 

 let user = [

        {

            name: "张三",

            age: 18,

            gender: "男"

        },

        {

            name: "李四",

            age: 19,

            gender: "女"

        },

        {

            name: "王五",

            age: 20,

            gender: "女"

        }

    ]

首先使用user.key(),遍历返回数组索引

 console.log(Array.from(user.keys())) // [0, 1, 2]

user.values(),遍历返回数组元素

 console.log(Array.from(user.values()))

user.entries(),遍历返回索引 / 值对

console.log(Array.from(user.entries()))

三、数组常用操作方法

slice(stratIndex,endIndex)

  • 若参数全满,返回从开始索引到结束索引的所有元素;
  • 若只有一个参数,返回从开始索引到结束索引的对应元素。

splice(startIndex, length, new1, new2....)

  • 用于删除、替换或者插入
 let newData = {"username": "ys","age": "22","gender":"计科1902","className":"3班","id":6}

    person.splice(1,1,newData) // 这里是替换的使用

到此这篇关于JavaScript数组详细归纳的文章就介绍到这了,更多相关JavaScript数组内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • JavaScript中常用的数组操作方法

    目录 一.concat() 二.join() 三.push() 五.shift() 六.unshift() 七.slice() 八.splice() 九.substring() 和 substr() 十.sort 排序 十一.reverse() 十二.indexOf 与 lastIndexOf 十三.every 对数组 十四.some 十五.filter 十六.map 十七.forEach 数组遍历 1.find(): 2.findIndex(): 3.fill(): 4.copyWithin(

  • js将多维数组转为一维数组后去重排序

    目录 先说一下多维数组拍平 方法一: flat() 方法二: 用空字符串拼接再用split()分割一下 方法三: toString() 方法四: join() 方法五:递归调用 方法六:使用reduce 数组去重 方法一:创建一个新数组,判断新数组中是否存在该元素如果不存在则将此元素添加到新数组中 方法二:使用Set大法 方法三:使用filter() 数组排序 方法一:使用sort() 整理几个方法,怕后面忘记了又要到处翻笔记 先说一下多维数组拍平 方法一: flat() // 比如说这里有一个

  • JavaScript判断是否为数组的各种方法汇总

    目录 前言 Array.isArray constructor instanceof isPrototypeOf Object.prototype.toString typeof 总结 前言 我们在日常开发中,常常有判断某值类型的需求,今天我们总结一下常见的几种用来判断是否为数组的 JavaScript 方法. Array.isArray Array.isArray() 是ES5新增的方法,用于确定传递的值是否是一个数组,如果是数组,则返回  true,否则返回 false. let arr =

  • JS操作对象数组实现增删改查实例代码

    1.介绍 最近帮朋友弄一个简单的针对json数组的增删改成页面,正好涉及到了js去操作对象数组实现增删改查功能.我估计很多朋友应该也会遇到这类操作,所以记录一下以便分享. 2.数据准备 这里我就以学生对象数组为例了,其实这个数组和json数组操作起来基本一致的,转换一下即可.例如可以使用JSON.parse将一串JSON字符串转换为js对象数组. 测试数据: // 学生对象数组 var students = [ {id:1, name: "张三", age: 14}, {id:2, n

  • JavaScript数组方法-系统性总结详解

    目录 数组常用方法 数组元素增添和删除 操作数组头部 操作数组尾部 任意位置增删 数组拼接 数组转换成字符串 截取数组 数组排序方法 排序 顺序翻转 数组迭代方法 数组遍历查找 返回值为下标 返回值为内容 数组遍历处理 callback(value[,index[,array]]) callback(total,value[,index[,array]]) 数组其他方法 总结 首先总结的意义就是让杂乱无章变得更加井然有序,这样在使用的过程思路会更加清晰. 数组使用方法注意点: 变异方法和非变异方

  • JavaScript数组合并案例讲解

    方法一: var a = [1,2,3]; var b=[4,5] a = a.concat(b); console.log(a); //此处输出为 [1, 2, 3 ,4 ,5] 方法二: // ES5 的写法 var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; Array.prototype.push.apply(arr1, arr2); console.log(arr1)//[0,1,2,3,4,5] 方法三: // ES6 的写法 var arr1 =

  • JS利用map整合双数组的小技巧分享

    目录 前言 模拟数据 合并后数据 合并思路 代码展示&解析 第一步 第二步 第三步 第四步 全部代码 总结 前言 最近因公司业务需求编写ECharts图表展示相关公司阶段型业务相关数据变化,需要服务端进行数据查询返回给前端进行数据展示.但是由于反回的数据不便于前端 ECharts展示所以需要进行数据整合,奈何本人经验不足只能请教公司大佬,在大佬帮助下完成了数据整合,并学到一个前所未闻的合并方法今天分享给大家. 模拟数据 下图是将要被合并的两数组 合并后数据 合并后数据要求以时间为唯一的key进行

  • js 数组 find,some,filter,reduce区别详解

    区分清楚Array中filter.find.some.reduce这几个方法的区别,根据它们的使用场景更好的应用在日常编码中. Array.find Array.find 返回一个对象(第一个满足条件的对象)后停止遍历 const arrTest = [ { id: 1, name: "a" }, { id: 2, name: "b" }, { id: 3, name: "b" }, { id: 4, name: "c" }

  • JavaScript 数组去重详解

    目录 1.数组去重 2.数组去重里面的对象去重 3.根据数组某个字段相同,修改另外字段值 总结 1.数组去重 /********************************************** ╚description: ╚作者: 麒麟社 ╚时间: 2021-09-13 22:26:21 ╚名称: V1.0.5 ***********************************************/ var obj = ['麒麟','社','CC','DD','麒麟','社'

  • JS实现数组过滤从简单到多条件筛选

    目录 单条件单数据筛选 单条件多数据筛选 多条件单数据筛选 多条件多数据筛选 知识点1: Object.key() 获取数组索引或者对象属性 知识点2: js里的falsy 知识点3: Array.every 与 Array.some的区别 知识点4: 数组的深拷贝与浅拷贝 想一想:递归算法的优化 在上家公司工作的时候,有一个需求是在前端部分完成筛选功能,一次拿到所有数据,然后根据条件筛选.通常情况下筛选是后台给接口,在数据量不大的情况下,也有人可能会遇到前端筛选这样的情况,特别写了这篇文章分享

  • javascript数组includes、reduce的基本使用

    目录 前言 Array.prototype.includes 语法 参数 返回值 实例 Array.prototype.reduce 语法 参数 返回值 总结 前言 在过去的几年中,JavaScript语言进行了多次更新.为了跟上技术更新的脚步,时刻保持一颗学习的心.趁着休息的时间学习熟悉一下数组的includes.reduce的使用. Array.prototype.includes ES7添加对此方法的支持,includes() 方法用来判断一个数组是否包含一个指定的值的元素,并返回布尔值t

  • JavaScript数组常用方法实例讲解总结

    目录 数组常用方法 concat() 方法 join() 方法 pop() 方法 push() 方法 reverse() 方法 shift() 方法 slice() 方法 sort() 方法 splice() 方法 toSource() 方法 toString() 方法 toLocaleString() 方法 unshift() 方法 valueOf() 方法 导读:在实际开发中,前端工程师除了写页面布局及样式还要对后端返回的数据进行处理,返回的数据大多数是json格式,一般都是返回一个对象或者

随机推荐