ES6数组知识点，巧妙运用数组，对循环说88

<!DOCTYPE html>
<html>
<head>
<title>ES6数组</title>
<script type="text/javascript">
// ES6数组新添加的一些方法：
// arr.forEach() //循环遍历
// arr.map() //有返回值得遍历
// arr.filter() //过滤一个新数组
// arr.some() //查找
// arr.every() //满足
// arr.reduce() //一般叠加用
// arr.reduceRight() //同上

// arr.find() //查找,并返回符合条件的第一个对象,否则返回undefined
//类似arr.findIndex('str') 返回第一次出现的下标,否则返回-1 ES5老函数

//arr.fill('str',startindex,endindex);//在某个位置插入一个成员
//arr.includes()//数组查找某个成员是否存在类似字符串中的includes函数返回boolean

//for of [ES6版本] forEach的简化版
//for in [老版本] forEach的简化版
// java中的foreach;
// Python中的 for in;
// js 中的for of;遍历数组,set//for in遍历对象

// Array、Object、Set、Map四种数据结构中for、for in和for of循环的区别？
// 一、普通for循环在Array和Object中都可以使用。
// 二、for in在Array和Object中都可以使用。// 注意：在对象中包含原型上的属性。
// 三、for of在Array、Object、Set、Map中都可以使用。
// 四、forEach循环在Array、Set、Map中都可以使用。

// arr.forEach()
let arr=['apple','banana','orange','tomato'];
//传统写法
// for (var i = 0; i < arr.length; i++) {
// console.log(arr[i]);
// }

//ES6 forEach写法
//参数说明：forEach函数的参数一：是一个函数,参数二：方法内this指向(不常用) 如果不知道默认window
//forEach会向这个函数传入三个参数
//(当前值,当前下标,所在数组)
// arr.forEach(function(val,index,arr,tem){
// console.log(val,index,arr,tem);
// });
// 输出结果：
// apple 0 ["apple", "banana", "orange", "tomato"] undefined
// banana 1 ["apple", "banana", "orange", "tomato"] undefined
// orange 2 ["apple", "banana", "orange", "tomato"] undefined
// tomato 3 ["apple", "banana", "orange", "tomato"] undefined

//ES6 forEach+箭头函数写法
//参数说明：forEach函数的参数一：是一个函数,参数二：箭头函数时此参数无效
//forEach会向这个函数传入三个参数
//(当前值,当前下标,所在数组)
// arr.forEach((val,index,arr)=>{
// console.log(val,index,arr);
// });
// 输出结果：
// apple 0 ["apple", "banana", "orange", "tomato"]
// banana 1 ["apple", "banana", "orange", "tomato"]
// orange 2 ["apple", "banana", "orange", "tomato"]
// tomato 3 ["apple", "banana", "orange", "tomato"]

// arr.map()
// map的重要作用：重置数据结构 //map没有返回值得时候和forEach()方法一模一样
//有返回值的时候是每个function都会返回一个值,最终形成一个数组,返回
//let newarr=arr.forEach()//返回的是undefined
//let newarr=arr.map()//返回的是每个function 返回值组成的数组(可能是普通数组,也可以能对象数组)
let arr2=[
{title:'aaaaa',read:100,hot:true},
{title:'bbbbb',read:100,hot:true},
{title:'ccccc',read:100,hot:true},
{title:'ddddd',read:100,hot:true}
];
let newarr2=arr2.map((item,index,arr)=>{
//console.log(item,index);
return {
index:index,
title:item.title,
read:item.read,
hot:item.hot
}
});
console.log(newarr2);
//总结map的重要作用：重置数据结构
//用需要返回值用map不需要返回值用forEach

//arr.filter()
//主要作用：过滤返回值 true||false true留下 false删除
// 最后返回一个过滤好的新数组
let arr3=[
{title:'aaaaa',read:100,hot:true},
{title:'bbbbb',read:100,hot:false},
{title:'ccccc',read:100,hot:true},
{title:'ddddd',read:100,hot:false}
];
let newarr3=arr3.filter((item,index,arr)=>{
//console.log(item,index);
return item.hot;
});
console.log(newarr3);

//arr.some() //子函数返回 boolean 最后根据boolean数组||运算即只要一个满足就返回true
//arr.every() //子函数返回 boolean 最后根据boolean数组&&运算即必须每一个满足才返回true

let arr4=[1,2,3,4,5,6,7,8,9,10];
let res1=arr4.reduce((pre,cur,idnex,arr)=>{//会传一个上一个元素的值
return pre+cur;
});
console.log(res1);//55

let arr5=[1,2,3,4,5,6,7,8,9,10];
let res2=arr5.reduceRight((pre,cur,idnex,arr)=>{//同上,但是这个是从右往左遍历数组
return pre+cur;
});
console.log(res2);//55

// Array.find()//查找参数是一个函数,函数做判断条件满足条件就返回当前对象,如果没找到,返回 undefined
let arr7=[23,900,102,80];
let res=arr7.find((val,index,arr)=>{
return val>100;
});
console.log(res);//返回第一个符合条件的

//ES6.2(ES8) 2017版本
//幂运算符2**3 相同与 Math.pow(2,3);

//for of
let arr6=["apple", "banana", "orange", "tomato"];

for(let val of arr6){
console.log(val);
}

//这是一种错误的写法,因为有了上面的下方,所以下面的这个不存在的
// for(let val of arr6.values()){
// console.log(val);
// }

for(let index of arr6.keys()){
console.log(index);
}

for(let item of arr6.entries()){
console.log(item);
}

for(let [key, val] of arr6.entries()){ //解构写法
console.log(key,val);
}

//----------------------------------------------------------------------------------------
//数组其他知识：
// Array.from()

let jsonstr={
8:'aaaaaa',
6:'bbbbbb',
2:'cccccc',
3:'dddddd',
length:10
}
let newarr=Array.from(jsonstr);
console.log(newarr);

// Array.of()//把多个值合并成一个数组 Array.of(1,2,3) 返回[1,2,3]

/*------------------------------------------------------------
一个很帅很装逼却没有什么用的知识点：
Array.from() //参数：类数组返回一个数组
把一个类似数组的对象转换成数组
//from转换的关键在于预转换的对象内是否有length这个属性和属性的key
只有满足有lenth这个属性,而且key 为整形才行
let json={
0:'aaaa',
1:'bbbb'
}
let newarr=Array.from(json);//newarr 为 []
let jsonstr={
8:'aaaaaa',
6:'bbbbbb',
2:'cccccc',
3:'dddddd',
length:10
}
let newarr=Array.from(jsonstr);
console.log(newarr);//newarr 为
[undefined, undefined, "cccccc", "dddddd", undefined, undefined, "bbbbbb", undefined, "aaaaaa", undefined]

------------------------------------------------------------*/

</script>
</head>
<body>

</body>
</html>

转载于:https://www.cnblogs.com/bigfire/p/9518100.html

ES6数组知识点，巧妙运用数组，对循环说88相关推荐

---已搬运--：[0CTF 2016]piapiapia -----代码审计+字符串逃逸+数组绕过长度限制+以及一下小知识点 preg_match()用数组，而且注意if是正确判断，还是错误判断
目录: 00000.知识点: 1.url传入数组绕过长度限制?? 2.数组的遍历 3.数组绕过正则一.自己做: 二.学到的&&不足: 四.学习WP 1.学习一个大佬的思路: 2.学习 ...
ES6查漏补缺【数组的扩展】
我的ES6 数组的扩展 1.先简单复习一下ES5中的数组方法 2.静态方法 ES5:Array.isArray() ES6:array.from() ES6:array.of() 3.数组实例方法 i ...
c语言二维数组作用,C语言二维数组知识点介绍
C语言二维数组知识点介绍数组可以看作是一行连续的数据,只有一个下标,称为一维数组.在实际问题中有很多量是二维的或多维的,因此C语言允许构造多维数组.多维数组元素有多个下标,以确定它在数组中的位置.本 ...
基于C#的GIS开发20210422之C#知识点总结、数组、数据类型、字符串总结、函数重载、字段与属性的区分、构造函数的应用、属性设置、普通类与抽象类、面向对象关系梳理
在20210419的基础上进行改进,和学习. 20210422笔记 ①C#小知识点总结一.C#中的数组定义 0)数组声明 1)一维数组: 2)二维数组 3)数组初始化 4)数组的访问 C# 中 fo ...
android 一维数组遍历,$.each()循环遍历一维数组、二维数组、JSON数据和DOM元素
本文介绍$.each()循环遍历一维数组.二维数组.JSON数据和DOM元素. 请注意在使用JQuery $.each()方法前,要首先引用jquery库文件. $.each()循环遍历一维数组 Jq ...
【小米校招笔试】一个数组是由有序数组经过n次循环移动后所得，请你用最快速度查找某个元素位置
2016年小米校招笔试第二题(西安站) 2 现有一个数组是由有序数组经过n次循环移动后所得,请你用最快速度查找某个元素位置(如1234568,向右移动3次后为67812345). 参考解法(Java版 ...
for循环 php 增加数组维数_PHP数组在循环中创建多维数组
我有一个关联的多维数组,如下所示 $data = array(); $data = Array ( [0] => Array ( [class] => 1styear [branch] = ...
二维数组赋值_3.9数组（数组基本使用、数组的循环、数组拷贝、数组排序、多维数组）...
3.9数组 3.9.1数组基本使用数组,英文叫Array,是一种数据结构,是用来存放同一数据类型数值的集合.例如存放30个int型数值.存放100个double型数值等等. 我们知道使用一个变量,需 ...
返回一个循环数组中最大子数组的和
设计思路首先利用rand()函数随机产生一个一维数组,数组长度通过宏定义来控制.求首尾连接的一维数组的最大子数组的和我的思路是:循环N次(N是数组的长度)依次检测数组的最大子数组的和再比较大小,保留 ...
linux获取连续数组下标值,shell 数组，双层循环打印变量
双层循环,打印循环执行次数. 特别注意 ,shell 脚本赋值时 '=' 两侧不能有空格,否则报错,shell command not found 但在if 语句中需要有: STR1="ab ...

ES6数组知识点，巧妙运用数组，对循环说88

ES6数组知识点，巧妙运用数组，对循环说88相关推荐

最新文章

热门文章