ES6数组及数组方法
ES6数组可以支持下面的几种写法:
(1)var [a,b,c] = [1,2,3];
(2)var [a,[[b],c]] = [1,[[2],3]];
(3)let [x,,y] = [1,2,3]; //x=1 y=3
(4)var [x,...y] = [1,2,3,4]; //x=1 y=[2,3,4]
当然我认为代码必须要有易读性,所以请谨慎选择写法。
var shuzu = {
'0' : "h",
'1' : "e",
'2' : "l",
'3' : "l",
'4' : "o",
length : 3,//要输出的长度
};
console.log(Array.from(shuzu)); //[ 'h', 'e', 'l' ]
console.log(Array.from(shuzu).length); //
console.log(Array.from('apple')); //[ 'a', 'p', 'p', 'l', 'e' ]
console.log(Array.from('apple').length); //
如果是将一堆值转化为数组使用Array.of()
console.log(Array.of(1,2,3));//[ 1, 2, 3 ]
console.log(Array.of(1,2,3).length);//
如果是复制当前数组某值到当前数组的某个位置使用copyWithin()会返回一个新的数组,接受三个参数依次为从该位置开始替换数据、从该位置开始读取数据和到该位置前停止读取数据。
console.log([0,1,2,3,4,5,6].copyWithin(0)); //[ 0, 1, 2, 3, 4, 5, 6 ]
console.log([0,1,2,3,4,5,6].copyWithin(0,2)); //[ 2, 3, 4, 5, 6, 5, 6 ]
//舍弃第二位以前的后面的补位并把后位用最后的两位补齐
console.log([0,1,2,3,4,5,6].copyWithin(0,2,3)); //[ 2, 1, 2, 3, 4, 5, 6 ]
//把原第三位补至原第零位其他位不变
console.log([0,1,2,3,4,5,6].copyWithin(0,2,4)); //[ 2, 3, 2, 3, 4, 5, 6 ]
//把原第二位第三位补至原第零位和第一位
console.log([0,1,2,3,4,5,6].copyWithin(0,2,5)); //[ 2, 3, 4, 3, 4, 5, 6 ]
//把原第二三四位补至原第零一二位
判断该数组是否含有某值使用find()方法,这个方法有三个参数value(寻找的值)、index(从哪开始)、arr(原数组),这个方法用于找出第一个符合条件的数组成员并返回该值。
console.log([1,2,3,4].find((n) => n<4)); //
console.log([1,2,3,4].find(function (value,index,arr) {return value<4 ;})); //
如果要把数组内部全部替换并返回一个新的数组使用fill()方法,这个方法接受三个参数value(要填充的值)、start(从哪里填充)、end(填充到哪)。
console.log([1,2,3].fill('a')); //[ 'a', 'a', 'a' ]
console.log([0,1,2].fill('a',1,3)); //[ 0, 'a', 'a' ]
//如果结束位大于等于数组的长度那么会从开始为到结束位都填充上填充的值 console.log([0,1,2,3,4].fill('a',1,3)); //[ 0, 'a', 'a', 3, 4 ]
/*也可以这么写*/
console.log(new Array(3).fill('a')); //[ 'a', 'a', 'a' ]
如果你要遍历数组那么有三个方法可供选择entries()、keys()、values(),都返回一个遍历器对象,可以用for...of循环遍历,他三个不同的是keys()对键名的遍历,values()是对值的遍历,entries()是对键值对的遍历。
for(let index of [ 'test' , 'ceshi' , 'apple' ].keys()){ console.log(index); } // 0 1 2
for(let [index,values] of [ 'test' , 'ceshi' , 'apple' ].entries()){ console.log(index,values); }//0 'test' 1 'ceshi' 2 'apple'
for(let values of [ 'test' , 'ceshi' , 'apple' ].values()){ console.log(values); } //报错!!!也不知道为什么我的不支持这个函数,如果有发现这个问题怎么解决请在后面留言 Thanks?(?ω?)?
如果查看数组里面是否含有某值使用includes()他会返回一个布尔值,有两个参数values(值)、start(从第几个开始)。
console.log([1,2,3].includes(1));//true
console.log([1,2,3].includes(1,2));//false
数组推导允许直接通过现有的数组生成新的数组,有点像vue里面的 x of y
var nums = [1,2,3,4,5,6];
for (num of nums) if(num>2){ console.log(num); } ; //3 4 5 6
ES6数组及数组方法的更多相关文章
- ES6中数组的新方法
数组的扩展 1.1扩展运算符 1.1.1:... 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. <body> < ...
- 漫谈数组去重复方法(亮点是ES6的新API)
方法1: 利用遍历的思想来进行. <!DOCTYPE html><html lang="en"><head> <meta charset= ...
- JavaScript(ES6之前)数组方法总结
一.数组的创建 1.使用 Array 构造函数 var arr1 = new Array(); // 创建一个空数组 var arr2 = new Array(20); // 创建一个包含20项的数组 ...
- ES6数组对象新增方法
1. Array.from() Array.from方法用于将两类对象转为真正的数组:类数组的对象( array-like object )和可遍历( iterable )的对象(包括 ES6 新增的 ...
- 前端面试之ES6新增了数组中的的哪些方法?!
前端面试之ES6新增了数组中的的哪些方法?! 我们先来看看数组中以前有哪些常用的方法吧! 1 新增的方法! 1 forEach() 迭代遍历数组 回调函数中的三个参数 value: 数组中的每一个元素 ...
- ES6中的数组方法扩展
上一篇文章小编简单介绍了在ES6中,一些常用的方法和一些简单的应用,在这篇文章中,小编将针对ES6中数组常用方法进行扩展,相信经过这篇文章之后,每一位小伙伴下班时间会有所提前,就算从原来的996变成9 ...
- ES6中数组新增的方法-超级好用
Array.find((item,indexArr,arr)=>{}) 掌握 找出第一个符合条件的数组成员. 它的参数是一个回调函数,对所有数组成员依次执行该回调函数. 直到找出第一个返回值为t ...
- ES6新增的数组方法
ES6新增:(IE9级以上支持) 1.forEach():遍历数组,无返回值,不改变原数组. 2.map():遍历数组,返回一个新数组,不改变原数组. 3.filter():过滤掉数组中不满足条件的值 ...
- ES6扩展——数组的新方法(Array.from、Array.of、Array.fill、Array.includes、keys values entries 、find)
1.Array.from(objec,回调函数)将一个ArrayLike对象或者Iterable对象(类数组对象)转换成一个数组 1)该类数组对象必须具有length属性,用于指定数组的长度.如果没有 ...
随机推荐
- django 前端请求跨域问题解决
django 前端请求跨域问题解决 笔者之前在做django-restful-api开发的时候,在前端请求页面发送请求的时候直接出现301,域名重定向的问题,经过一番查阅资料,终于得到了非常完美的解决 ...
- MD5摘要算法简析
1 MD5简介 1.1 概述 MD5即Message-Digest Algorithm 5(信息-摘要算法5),用于确保信息传输完整一致.是计算机广泛使用的杂凑算法之一(又译摘要算法.哈希算法),主 ...
- Nvidia TX2 Robot 环境配置记录
p.p1 { margin: 0.0px 0.0px 2.0px 0.0px; font: 14.0px "Helvetica Neue"; color: #454545 } p. ...
- cmd markdown 使用教程
cmd markdown 使用教程 tags: 自制教程 李卓伦 目录: [TOC] 一.简介与安装 我们理解您需要更便捷更高效的工具记录思想,整理笔记.知识,并将其中承载的价值传播给他人,Cmd M ...
- 初学PHP心得(第一天)
我是PHP初学者,听说女生挺适合学这门语言的.所以,我就下定决心,来好好的探究下它,希望它能成为我开启IT道路的第一道关卡. 今天心血来潮,来记录下一天的成果和收获吧.既然想法有了,那就要去实现它.于 ...
- php 7.2 一些注意事项.
<?php $b = array(); each($b); // Deprecated: The each() function is deprecated. This message will ...
- 模块化编程node
众所周知,Node.js 的出现造就了全栈工程师,因为它让 JavaScript 的舞台从浏览器扩大到了服务端 而 Node.js 的强大也得益于它庞大的模块库,所以学习 Node.js 第一步还得从 ...
- 实践作业2:黑盒测试实践——编写自动化脚本并拍摄测试过程视频 Day 6
下午下课之后小组成员一起交流了一下实验过程遇到的一些问题,并汇总了下各个项目完成情况 该实验目前(写博客是时间)基本完成,具体情况如下 (1)分析系统需求 .(done) (2)设计测试用例.(don ...
- codeforces 893A Chess For Three 模拟
893A Chess For Three 思路: 直接模拟即可,第一盘永远是A与B开始 代码: #include <bits/stdc++.h> using namespace std; ...
- CSS书写规范与理论
前端体系的变化可谓是日新月异,短短一年时间,从理论.框架.构建工具.甚至开发语言都发生非常大的变化. 随着新项目就即将启动,我抽时间回顾了一下以往项目的前端架构,零零散散产生了许多想法,尽量一一记录下 ...