for 循环 和 Array 数组对象
博客地址:https://ainyi.com/12
for 循环 和 Array 数组对象方法
for for-in for-of forEach效率比较
- 效率速度:for > for-of > forEach > for-in
1 // 面试: for, forEach, for-in, for-of(es6) 2 3 let arr = [1,2,3,4,5]; 4 arr.b = '100'; // 自定义私有属性 5 6 7 8 // for循环 速度最快 9 for (let i = 0; len = arr.length, i < len; i++) { // 编程式 10 console.log("for循环"+arr[i]); 11 } 12 13 14 15 // forEach 不支持return和break,无论如何都会遍历完, 16 arr.forEach(function(item){ 17 console.log("forEach循环"+item); 18 }); 19 20 21 22 // for-in 遍历的是 key 值,且 key 会变成字符串类型,包括数组的私有属性也会打印输出 23 for(let key in arr){ 24 console.log("for in循环"+key); 25 console.log(typeof key); 26 } 27 28 29 30 // for-of 遍历的是值 val,只能遍历数组 (不能遍历对象) 31 for(let val of arr){ 32 console.log("for of循环"+val); 33 } 34 35 36 // Object.keys 将对象的 key 作为新的数组,这样 for-of 循环的就是原数组的 key 值 37 let obj = {school:'haida',age:20}; 38 // 变成 ['school','age'] 39 for(let val of Object.keys(obj)){ 40 console.log(obj[val]); 41 }
JavaScript Array 数组对象方法
重点难点解析
1 // filter 过滤:可用于删除数组元素 2 // 不改变原数组,过滤后返回新数组 3 // 回调函数的返回值:若 true:表示这一项放到新数组中 4 let newArr = [1,2,3,4,5].filter(item => item>2 && item <5); 5 //数组元素>2且<5的元素返回true,就会放到新数组 6 console.log("新数组:"+newArr); 7 8 9 10 11 // map 映射,将原有的数组映射成一个新数组 [1,2,3],用于更新数组元素 12 // 不改变原数组,返回新数组 13 // 回调函数中返回什么这一项就是什么 14 // 若要拼接 <li>1</li><li>2</li><li>3</li> 15 let arr2 = [1,2,3].map(item => `<li>${item}</li>`); 16 // join方法用于把数组中的所有元素放入一个字符串。每个元素通过指定的分隔符进行分隔。 17 // 这里使用''空字符分割 18 console.log(arr2.join('')); 19 20 21 // 若只要 name 的 val 值,不要 key 值 22 let arrJson = [{'name':'krry'},{'name':'lily'},{'name':'xiaoyue'},{'name':'krry'}]; 23 let newArrJson = arrJson.map( val => val.name); 24 console.log(`newArrJson:${newArrJson}`); 25 26 27 28 29 // find:返回找到的那一项 30 // 不改变原数组 31 // 找到后停止循环,找不到返回的是 undefined 32 let arrFind = [1,2,3,4,55,555]; 33 let result = arrFind.find((item,index) => { 34 return item.toString().indexOf(5) > -1;// 找数组元素中有5的第一项 35 }); 36 console.log(result); // 输出 55 37 38 39 40 41 // includes 数组中是否包含某个元素,返回 true or false 42 let arr3 = [1,2,3,4,55,555]; 43 console.log(arr3.includes(5)); 44 45 46 47 48 // some:如果有一个元素满足条件,则表达式返回 true, 剩余的元素不会再执行检测。 49 // 如果没有满足条件的元素,则返回 false 50 let arrSF = [1,2,3,4,555]; 51 let result = arrSF.some((item,index)=>{ 52 return item > 3; 53 }); 54 console.log(result); // 输出true 55 56 57 58 59 // every:如果有一个元素不满足,则表达式返回 false,剩余的元素不会再进行检测。 60 // 如果所有元素都满足条件,则返回 true 61 let arrSE = [1,2,3,4,555]; 62 let result = arrSE.every((item,index)=>{ 63 return item > 3; 64 }); 65 console.log(result); // 输出 false 66 67 68 69 70 // reduce 收敛函数, 4个参数 返回的是叠加后的结果 71 // 不改变原数组 72 // 回调函数返回的结果: 73 // prev:数组的第一项,next是数组的第二项(下一项) 74 // 当前 return 的值是下一次的 prev 75 let sum = [1,2,3,4,5].reduce((prev,next,index,item)=>{ 76 // console.log(arguments); 77 // 1 2 78 // 3 3 79 // 6 4 80 // 10 5 81 console.log(prev,next); 82 return prev+next; // 返回值会作为下一次的 prev 83 }); 84 console.log(sum); 85 86 87 // reduce 可以默认指定第一轮的 prev,那么 next 将会是数组第一项(下一项) 88 // 例子:算出总金额: 89 let sum2 = [{price:30,count:2},{price:30,count:3},{price:30,count:4}]; 90 let allSum = sum2.reduce((prev,next)=>{ 91 // 0+60 92 // 60+90 93 // 150+120 94 console.log(prev,next); 95 return prev+next.price*next.count; 96 },0); // 默认指定第一次的 prev 为 0 97 console.log(allSum); 98 99 100 // 利用reduce把二维数组变成一维数组 101 let flat = [[1,2,3],[4,5,6],[7,8,9]].reduce((prev,next)=>{ 102 return prev.concat(next); // 拼接数组 103 }); 104 console.log(flat); 105 106 107 108 109 // slice 从已有的数组中返回选定的元素 110 // 不改变原数组 111 let fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; 112 let citrus = fruits.slice(1,3); 113 console.log(citrus); // 输出 Orange,Lemon 114 115 116 117 118 // pop 用于删除数组的最后一个元素并返回删除的元素 119 // 改变原数组 120 let fur = ["Banana", "Orange", "Apple", "Mango"]; 121 fur.pop(); 122 console.log(fur); // 输出 Banana,Orange,Apple 123 124 125 126 127 // shift 用于把数组的第一个元素从其中删除,并返回第一个元素的值 128 // 改变原数组 129 let fts = ["Banana", "Orange", "Apple", "Mango"]; 130 fts.shift(); 131 console.log(fts);// 输出 Orange,Apple,Mango 132 133 134 135 136 // unshift 向数组的开头添加一个或更多元素,并返回新的长度 137 // 改变原数组 138 let fse = ["Banana", "Orange", "Apple", "Mango"]; 139 fse.unshift("Lemon","Pineapple"); 140 console.log(fse); // 输出 Lemon,Pineapple,Banana,Orange,Apple,Mango 141 142 143 144 145 // splice 用于插入、删除或替换数组的元素 146 // 改变原数组 147 let myArrs = ["Banana", "Orange", "Apple", "Mango"]; 148 myArrs.splice(2,1); // 从数组下标为 2 开始删除,删除 1 个元素 149 console.log(myArrs); // 输出 Banana,Orange,Mango
额外谈一下arguments
1 // arguments 是一个对应于传递给函数的参数的类数组对象 2 // 此对象包含传递给函数的每个参数的条目,第一个条目的索引从0开始。 3 // 例如,如果一个函数传递了三个参数,你可以以如下方式引用他们: 4 // arguments[0] 5 // arguments[1] 6 // arguments[2] 7 let xx = sumAll(1, 123, 500, 115, 44, 88); 8 9 function sumAll() { 10 let i, sum = 0; 11 for (i = 0; i < arguments.length; i++) { 12 sum += arguments[i]; 13 } 14 console.log(sum); // 返回总和 871 15 }
for 效率测试代码
1 let arr = new Array(); 2 for(let i = 0, len = 1000000;i < len; i++){ 3 arr.push(i); 4 } 5 6 function foradd(my_arr){ 7 let sum = 0; 8 for(let i = 0; i < my_arr.length; i++){ 9 sum += my_arr[i]; 10 } 11 } 12 13 function forinadd(my_arr){ 14 let sum = 0; 15 for(let key in my_arr){ 16 sum += my_arr[key]; 17 } 18 } 19 20 function forofadd(my_arr){ 21 let sum = 0; 22 for(let val of my_arr){ 23 sum += val; 24 } 25 } 26 27 28 function forEachadd(my_arr){ 29 let sum = 0; 30 my_arr.forEach(val => { 31 sum += val; 32 }); 33 } 34 35 function timeTest(func,my_arr,str) { 36 var start_time = null; 37 var end_time = null; 38 start_time = new Date().getTime(); 39 func(my_arr); 40 end_time = new Date().getTime(); 41 console.log(str,(end_time - start_time).toString()); 42 } 43 44 timeTest(foradd,arr,'for'); 45 timeTest(forinadd,arr,'for-in'); 46 timeTest(forofadd,arr,'for-of'); 47 timeTest(forEachadd,arr,'forEach');
博客地址:https://ainyi.com/12
转载于:https://www.cnblogs.com/ainyi/p/9203374.html
for 循环 和 Array 数组对象相关推荐
- JavaScript 常用内置对象(字符串属性、Math对象、Array数组对象)
1.字符串属性 <script> var test_var = "I Iove you"; console.log(test_var.charAt(3)) //char ...
- 微信小程序开发教程之Array数组对象
最新消息,Hi小程序小编了解到,微信小程序开发教程之Array数组对象. 微信小程序开发教程已经是当下最热门的话题,下面将从多方面来谈谈Array数组对象相关的内容. Array,又称作数组对象我们通 ...
- Array数组对象sort排序方法
数组sort排序方法 Array数组对象中的sort方法是根据数组中数组元素的字符编码进行排序的,所以对数字的排序,会跟想要的升序结果不一样 通过设置sort()方法的参数可以按照自定义的排序方式对数 ...
- python的对象数组_Python当中的array数组对象实例详解
计算机为数组分配一段连续的内存,从而支持对数组随机访问: 由于项的地址在编号上是连续的,数组某一项的地址可以通过将两个值相加得出,即将数组的基本地址和项的偏移地址相加. 数组的基本地址就是数组的第一项 ...
- 内置对象的API Array数组对象 String字符串对象 json字符串 JSON对象 js作用域及变量预解析 引用类型与值类型区别 共享引用 基本包装类型 数组去重
01-内置对象的API a.Date对象获取时间 b.Array对象数组加工 c.String对象字符串加工 d.json字符串的语法格式 e.JSON对象的字符串与对象转换应用 02-JS作用域 a ...
- 7.Array 数组对象
数组对象是一个对象的集合,里边的对象可以是不同类型的.数组的每一个成员对象都有一个"下标",用来表示它在数组中的位置,是从零开始的 数组定义的方法: 1. 定义了一个空数组: va ...
- JS的Array数组对象方法一些总结
不会影响原数组的对象方法: concat(): 语法:array1.concat(array2,array3,...,arrayX),连接两个或者多个数组,返回一个连接后的新数组 entries( ...
- JavaScript入门→HTML引用JS、变量、表达式操作符、数组Array数组对象、选择结构循环结构、函数、JavaScript与JAVA区别
插入引用JS 变量 表达式 操作符 数组 选择判断结构 循环结构 函数 JavaScript与JAVA区别 绝学无忧. 唯之与阿,相去几何? 善之与恶,相去何若? 人之所畏,不可不畏. 荒兮其未央哉! ...
- 【TypeScript系列教程14】Array数组对象的常见的方法
目录 TypeScript Array(数组) concat() every() filter() forEach() join() lastIndexOf() map() pop() push(
最新文章
- 在SecureCRT下使用sz下载和rz上传文件
- Matlab与机器学习 -- BP网络神经元上的转移函数
- 产品经理规划产品之需求梳理
- python最好的教程_喜大普奔~可能是最好的Python教程
- 【C++】 C++标准模板库(四) Set
- 腾讯广告X中科院计算所WWW2021论文:在线广告中的探索与优化
- C语言小程序——验证哥德巴赫猜想
- VHDL学习笔记——半加器 多路选择器 分频器
- 华东理工大学考研计算机难度,华东理工大学(专业学位)计算机技术考研难吗
- 使用广和通L610模块搭配RT-Thread操作系统连接onenet云
- 泰山OFFICE技术讲座:标点关系穷举研究-05
- ogm 算法_如何在Windows Vista中播放.OGM视频文件
- 【阅读笔记】联邦学习实战——联邦学习攻防实战
- BZOJ1067降雨量
- 工业设备刀具检测常用特征值提取方法及决策方法
- Redis( 缓存篇 ==> 互斥锁解决缓存击穿
- microbit开发环境搭建
- 【无2021年煤矿采煤机(掘进机)操作考试技巧及煤矿采煤机(掘进机)操作模拟考试题
- 农村养老保险系统Mysql_2020年农村养老保险管理系统(在线查询)
- 源表的原理以及操作方法和远程控制方法