【ECMAScript5】ECMAScript5中有关数组的常用方法
1.indexOf()
此方法返回在改数组中第一个找到的元素位置,如果它不存在则返回-1
var arr = ['apple','orange','pear']; console.log("found:", arr.indexOf("orange") != -1); //true
2.filter(fn)
此方法创建一个新的匹配过滤条件的数组
var arr = [
{"name":"apple", "count": 2},
{"name":"orange", "count": 5},
{"name":"pear", "count": 3},
{"name":"orange", "count": 16},
]; var newArr = arr.filter(function(item){
return item.name === "orange";
}); console.log("Filter results:",newArr);// [{"name":"orange", "count": 5},{"name":"orange", "count": 16}]
3.forEach(fn)
此方法用来替换for循环
arr.forEach(function(item,index){
console.log(item);
});
4.map()
对数组的每个元素进行一定的操作(映射)后,会返回一个新的数var oldArr = [{first_name:"Colin",last_name:"Toh"},{first_name:"Addy",last_name:"Osmani"}];
function getNewArr(){ return oldArr.map(function(item,index){
item.full_name = [item.first_name,item.last_name].join(" ");
return item;
}); } getNewArr();//[{first_name:"Colin",last_name:"Toh",full_name:"Colin Toh"},{first_name:"Addy",last_name:"Osmani" fll_name:'Addy Osmani'}]
项目中常用到的场景:
将数组中的某项以字符串的形式get给后台 var oldArr = [{first_name:"Colin",last_name:"Toh"},{first_name:"Addy",last_name:"Osmani"},{first_name:"Yehuda",last_name:"Katz"}];
oldArr.map(function(item,index){return item.first_name;}).join();//"Colin,Addy,Yehuda"
或者
oldArr.map(item => item.first_name).join();//"Colin,Addy,Yehuda"
5.reduce(callbackfn [ , initialValue ] )
可以实现一个累加器的功能,将数组的每个值(从左到右)将其降低到一个值
应用场景“统计一个数组中不重复单词
之前解决方案:
var arr = ["apple","orange","apple","orange","pear","orange"]; function getWordCnt(){
var obj = {}; for(var i= 0, i < arr.length; i++){
var item = arr[i];
obj[item] = (obj[item] +1 ) || 1;
} return obj;
} console.log(getWordCnt());
//{apple: 2, orange: 3, pear: 1}
使用reduce()
var arr = ["apple","orange","apple","orange","pear","orange"]; function getWordCnt(){
return arr.reduce(function(prev,next){
prev[next] = (prev[next] + 1) || 1;
return prev;
},{});
} console.log(getWordCnt());//
参考资料:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/from
https://www.cnblogs.com/leejersey/p/5466091.html
作者:smile.轉角
QQ:493177502
【ECMAScript5】ECMAScript5中有关数组的常用方法的更多相关文章
- 前端开发:Javascript中的数组,常用方法解析
前端开发:Javascript中的数组,常用方法解析 前言 Array是Javascript构成的一个重要的部分,它可以用来存储字符串.对象.函数.Number,它是非常强大的.因此深入了解Array ...
- JavaScript中数组操作常用方法
JavaScript中数组操作常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2 ...
- javascript中的数组扩展(一)
javascript中的数组扩展(一) 随着学习的深入,发现需要学习的关于数组的内容也越来越多,后面将会慢慢归纳,有的是对前面的强化,有些则是关于前面的补充. 一.数组的本质 数组是按照次序排 ...
- JavaScript中的数组详解
JavaScript中的数组 一.数组的定义 数组是值的有序集合,或者说数组都是数据的有序列表. 二.创建数组 [字面量形式] 1.空数组 var arr=[]; 2.带有元素的数组 var arr= ...
- js 数组的常用方法归纳
数组的常用方法归纳 slice(start,end) 传参:start代表从哪里开始截取,end代表截取结束的地方 var a = [1,2,3]a.slice(1);//[2,3] pop() 可以 ...
- JavaScript中Array数组的方法
查找: indexOf.lastIndexOf 迭代:every.filter.forEach.map.somereduce.reduceRight 用法: /* 1 查找方法: * arr.inde ...
- (68)Wangdao.com第十一天_JavaScript 数组的常用方法
数组的常用方法: 向数组末尾添加一个或多个元素,返回新长度 var arr = new Array(); arr.push("唐僧"); // 返回 1 删除数组最后一个元素,返回 ...
- JavaScript数组对象常用方法
JavaScript数组对象常用方法 方法 形式 返回值 是否改变原数组 描述 concat -items: ConcatArray[] 追加之后的数组 否 连接两个或更多的数组,并返回结果.注意 c ...
- (js) 字符串和数组的常用方法
JS中字符串和数组的常用方法 JS中字符串和数组的常用方法 js中字符串常用方法 查找字符串 根据索引值查找字符串的值 根据字符值查找索引值 截取字符串的方法 字符串替换 字符串的遍历查找 字符串转化 ...
随机推荐
- 通过JS生成由字母与数字组合的随机字符串
在项目中可能需要随机生成字母数字组成的字符,如生成3-32位长度的字母数字组合的随机字符串(位数不固定)或者生成43位随机字符串(位数固定) 使用Math.random()与toString()方法的 ...
- jQ效果:jQuery之插件开发短信发送倒计时功能
实现的主要功能如下: 1.点击按钮的时候,可以进行倒计时,倒计时自定义. 2.当接收短信失败后,倒计时停止,可点击重新发送短信. 3.点击的元素支持一般标签和input标签. html代码: < ...
- 电脑GIF动图制作方法图文详解
我们在电脑上可以看到很多动态图,有趣的.搞笑的.可爱的等等,只要我们要用哪种类型的,网上应有尽有,但是想不想自己制作图片呢?今天我们就来学习一下GIF动图制作的方法. 使用工具: 电脑 操作方法: 1 ...
- 通过源码分析View的测量
要理解View的测量,首先要了解MeasureSpec,系统在测量view的宽高时,要先确定MeasureSpec. MeasureSpec(32为int值)由两部分组成: SpecMode(高2位) ...
- Android为TV端助力 修改videoview的宽度和高度
如果直接用android的videoview.他是不允许你随意的修改宽度和高度的,所以我们要重写videoview! package com.hysmarthotel.view; import and ...
- [iOS]创建界面方法的讨论
以前在入门的时候,找的入门书籍上编写的 demo 都是基于 Storyboards 拖界面的.后来接触公司项目,发现界面都是用纯代码去写复杂的 autoLayout 的.再然后,领导给我发了个 Mas ...
- (后端)根据查询语句修改的update语句
UPDATE A SET a.name = m.name FROM item A INNER JOIN table M ON A.id=M.id WHERE a.xx <> M.xx
- 巧用 即刻搜索事件 input propertychange 监听输入框字数
实时监听输入框的字数,大于200时,不再输入. 即时搜索: propertychange(ie)和input事件(常用) input是标准的浏览器事件,一般应用于input元素,当input的valu ...
- LNMP + Apache 架构配置
从事前端开发已3年有余,越来越发现前端开发要学习的知识已不仅仅是html+css+js那么简单了,2017年市场上就有了大前端的概念,可以说对前端工程师的要求也越来越高了,从招聘的要求中可以看到熟悉一 ...
- (一)Maven简介
Maven这个词可以翻译为“知识的积累”,也可以翻译为“专家”或“内行”,是一个跨平台的项目管理工具.Maven主要服务于基于Java平台的项目构建.依赖管理和项目信息管理. 构建(build)是每一 ...