位置: IT常识 - 正文

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

编辑:rootadmin
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常用的输出语句,内容如对您有帮助,希望把文章链接给更多的朋友!

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
本文链接地址:https://www.jiuchutong.com/zhishi/300496.html 转载请保留说明!

上一篇:echarts文档解读(echarts api文档)

下一篇:【学姐面试宝典】前端基础篇Ⅳ(JavaScript)(学长学姐面试要注意哪些细节)

  • 鸿蒙系统怎么结束进程(鸿蒙系统技巧)

    鸿蒙系统怎么结束进程(鸿蒙系统技巧)

  • ipadpro有几个版本(苹果ipadpro共有几代)

    ipadpro有几个版本(苹果ipadpro共有几代)

  • ipone7plus是否升级13.4(苹果7plus建议升级15吗)

    ipone7plus是否升级13.4(苹果7plus建议升级15吗)

  • 抖音不花钱能上热门吗(抖音不花钱上热门的几率)

    抖音不花钱能上热门吗(抖音不花钱上热门的几率)

  • 小红书怎么隐藏自己的点赞(小红书怎么隐藏ip地址)

    小红书怎么隐藏自己的点赞(小红书怎么隐藏ip地址)

  • 微博编辑记录怎么不让别人看到(微博编辑记录怎么隐藏)

    微博编辑记录怎么不让别人看到(微博编辑记录怎么隐藏)

  • 取消关联qq对方知道吗(取消关联qq对方会知道吗)

    取消关联qq对方知道吗(取消关联qq对方会知道吗)

  • 闲鱼上确认收货后还能申请退款吗(闲鱼上确认收货之后发现上当受骗了怎么办)

    闲鱼上确认收货后还能申请退款吗(闲鱼上确认收货之后发现上当受骗了怎么办)

  • 抖音审核未通过影响账号吗(抖音审核未通过会被限流吗)

    抖音审核未通过影响账号吗(抖音审核未通过会被限流吗)

  • 型号是1796是pro几(pro7h是什么型号)

    型号是1796是pro几(pro7h是什么型号)

  • 6s有人像模式吗(6s有人像模式吗怎么用)

    6s有人像模式吗(6s有人像模式吗怎么用)

  • 京东的京豆可以转让吗(京东的京豆可以换钱吗)

    京东的京豆可以转让吗(京东的京豆可以换钱吗)

  • vivox6是骁龙几(vivox6处理器相当于骁龙多少)

    vivox6是骁龙几(vivox6处理器相当于骁龙多少)

  • 苹果手机打开旁白会怎么样(苹果手机打开旁白后屏幕变成黑色了)

    苹果手机打开旁白会怎么样(苹果手机打开旁白后屏幕变成黑色了)

  • 第一次用苹果11怎么激活(第一次用苹果11怎么下载软件)

    第一次用苹果11怎么激活(第一次用苹果11怎么下载软件)

  • 余利宝体验金能干什么(余利宝体验金能消费吗)

    余利宝体验金能干什么(余利宝体验金能消费吗)

  • 苹果延时摄影怎么转换正常(苹果延时摄影怎么调速度)

    苹果延时摄影怎么转换正常(苹果延时摄影怎么调速度)

  • 苹果11发烫正常吗(苹果11发烫是怎么回事?)

    苹果11发烫正常吗(苹果11发烫是怎么回事?)

  • 苹果像素多少万(苹果14pro像素多少万)

    苹果像素多少万(苹果14pro像素多少万)

  • 苹果x如何定位华为手机(苹果x如何定位对方手机所在位置)

    苹果x如何定位华为手机(苹果x如何定位对方手机所在位置)

  • minidump蓝屏解决方法(minidump蓝屏文件怎样彻底清除)

    minidump蓝屏解决方法(minidump蓝屏文件怎样彻底清除)

  • 怎么查qq个人轨迹(如何查qq个人轨迹)

    怎么查qq个人轨迹(如何查qq个人轨迹)

  • 为什么wps是以文档链接分享(为什么wps以文件发送失败)

    为什么wps是以文档链接分享(为什么wps以文件发送失败)

  • 苹果x能无线充电吗(苹果x无线充电功率)

    苹果x能无线充电吗(苹果x无线充电功率)

  • CSS Houdini:用浏览器引擎实现高级CSS效果(css代码怎么在浏览器运行)

    CSS Houdini:用浏览器引擎实现高级CSS效果(css代码怎么在浏览器运行)

  • 已抵扣进项税转出是在哪个属期
  • 什么原始凭证可以填写
  • 建筑工程机械服务有限公司企业
  • 发票报送日志不完整
  • 2021成品油增值税计算
  • 小企业固定资产折旧的账务处理
  • 待报解预算收入计入什么科目
  • 修理办公用复印机好吗
  • 新准则下怎么调整长期股权投资损益调整
  • 会计期末要做的事情
  • 固定资产盘亏是营业外支出吗
  • 向非关联企业捐赠现金会计分录
  • 收到货物记账凭证
  • 公司从银行贷款需要交税吗
  • 企业长期股权投资中发生的相关费用处理方法正确的有
  • 税法是否认可低税收
  • 软件服务类企业
  • 金税三期能查几年前的发票
  • 个人所得税法规定可减征个税的情形有
  • 可税前扣除的捐赠支出
  • 固定成本与变动成本的区别
  • 金融服务收入怎么算
  • 城市维护建设税的计税依据是什么
  • 库存现金出现负数怎么跟客户沟通
  • 应收账款未计提坏账,但是确实收不回来
  • 季度资产总额怎么填写
  • 差旅费津贴可以扣除吗
  • 单位开具发票
  • 图解 http
  • macOSCatalina10.15.5正式版值得升级吗 macOSCatalina10.15.5更新了什么
  • winrar压缩后生成的文件格式
  • 业务招待费汇算清缴扣除标准
  • 资产减值损失结转
  • 资本公积转增资本要交税吗
  • 股东投资款验资后可以转出吗
  • 无形资产的会计处理
  • thinkphp import
  • 业务招待费的账务处理金额
  • php 构造方法
  • thinkphp连接查询少数据
  • html怎么设置隐藏元素
  • phpcms怎么用
  • 补交上年度的企业所得税税款计入什么科目
  • 年末结转增值税明细
  • php环境配置教程
  • 固定资产的财务业绩是什么意思啊
  • 税务新法规
  • 农机销售融资贷款流程
  • 专项储备计提和使用理解
  • 私车公用怎么办理手续
  • 固定资产评估收费标准
  • 畜类生产性生物资产计算折旧的最低年限
  • 投资者向企业投入资本的形式
  • 新公司核税需要什么材料
  • 独立核算的生产车间是法律主体吗
  • 购买税控盘用银行抵扣吗
  • 暂估入库成本差异
  • 永续债的清偿顺序是什么
  • 公司注册实收资本
  • 行政事业单位固定资产计提折旧
  • 企业接受非货币性资产投资的入账金额
  • win10开始按钮点不动
  • 远程桌面连接没反应
  • ubuntu如何创建文件
  • rhel6安装
  • linux中bc命令
  • final cut pro能破解吗
  • linux 安装jmap
  • win10预览版
  • mmtraylsi.exe是什么进程 有什么作用 mmtraylsi进程查询
  • kill命令用法
  • 简述dom的组成
  • bat批处理脚本教程
  • javascript运算
  • unity控制相机旋转
  • android 实例
  • python socketcan
  • jquery网页设计作业
  • 视同销售行为的进项税额抵扣方法?
  • 韩国税务怎么算收入
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设