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中有关数组的常用方法的更多相关文章

  1. 前端开发:Javascript中的数组,常用方法解析

    前端开发:Javascript中的数组,常用方法解析 前言 Array是Javascript构成的一个重要的部分,它可以用来存储字符串.对象.函数.Number,它是非常强大的.因此深入了解Array ...

  2. JavaScript中数组操作常用方法

    JavaScript中数组操作常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2 ...

  3. javascript中的数组扩展(一)

     javascript中的数组扩展(一) 随着学习的深入,发现需要学习的关于数组的内容也越来越多,后面将会慢慢归纳,有的是对前面的强化,有些则是关于前面的补充. 一.数组的本质    数组是按照次序排 ...

  4. JavaScript中的数组详解

    JavaScript中的数组 一.数组的定义 数组是值的有序集合,或者说数组都是数据的有序列表. 二.创建数组 [字面量形式] 1.空数组 var arr=[]; 2.带有元素的数组 var arr= ...

  5. js 数组的常用方法归纳

    数组的常用方法归纳 slice(start,end) 传参:start代表从哪里开始截取,end代表截取结束的地方 var a = [1,2,3]a.slice(1);//[2,3] pop() 可以 ...

  6. JavaScript中Array数组的方法

    查找: indexOf.lastIndexOf 迭代:every.filter.forEach.map.somereduce.reduceRight 用法: /* 1 查找方法: * arr.inde ...

  7. (68)Wangdao.com第十一天_JavaScript 数组的常用方法

    数组的常用方法: 向数组末尾添加一个或多个元素,返回新长度 var arr = new Array(); arr.push("唐僧"); // 返回 1 删除数组最后一个元素,返回 ...

  8. JavaScript数组对象常用方法

    JavaScript数组对象常用方法 方法 形式 返回值 是否改变原数组 描述 concat -items: ConcatArray[] 追加之后的数组 否 连接两个或更多的数组,并返回结果.注意 c ...

  9. (js) 字符串和数组的常用方法

    JS中字符串和数组的常用方法 JS中字符串和数组的常用方法 js中字符串常用方法 查找字符串 根据索引值查找字符串的值 根据字符值查找索引值 截取字符串的方法 字符串替换 字符串的遍历查找 字符串转化 ...

随机推荐

  1. Android Lifecycle使用

    引言 Lifecycle 是官方提供的架构组件之一,目前已经是稳定版本,Lifecycle 组件包括LifecycleOwner.LifecycleObserver.Lifecycle 组件是执行操作 ...

  2. angularJs学习笔记-入门

    1.angularJs简介 angularJs是一个MV*的javascript框架(Model-View-Whatever,不管是MVVM还是MVC,统归MDV(model drive view)) ...

  3. java框架之springmvc

    一.HelloWorld程序 (1)导包:四个spring 核心包(core.beans.context.expression).一个aop包.两个 web 包和一个logging 包: (2)配置 ...

  4. 从项目需求角度,使用纯CSS方案解决垂直居中

    CSS是HTML元素的剪刀手,它极度的丰富了web页面的修饰.在众多CSS常见的样式需求中,有一奇葩式的存在[垂直居中],因为不管是从逻辑实现方面还是从正常需求量来讲,这都没理由让这个需求在实践过程中 ...

  5. C# 利用ReportViewer生成报表

    本文主要是利用微软自带的控件ReportViewer进行报表设计的小例子,仅供学习分享使用,如有不足之处,还请指正. 涉及知识点: ReportViewer :位于Microsoft.Reportin ...

  6. Android包管理机制(二)PackageInstaller安装APK

    前言 在本系列上一篇文章Android包管理机制(一)PackageInstaller的初始化中我们学习了PackageInstaller是如何初始化的,这一篇文章我们接着学习PackageInsta ...

  7. MFC 单文档添加按钮

    VS 单文档 添加按钮 今天做项目需要在单文档中创建按钮来响应函数,即点击按钮,调用某函数,特此记录. 1. 在XXXView中添加CButton变量,例如 CButton start; 2. 下来就 ...

  8. (后端)springboot 在idea中实现热部署(转)

    自己用到了iIntelliJ IDEA 这个ide工具,但是和以前的工具写html,css,js直接刷新页面不同,这个需要去热部署,网上搜的解决方法: SpringBoot的web项目,在每一次修改了 ...

  9. Python HTML解析模块HTMLParser(爬虫工具)

    简介 先简略介绍一下.实际上,HTMLParser是python用来解析HTML的内置模块.它可以分析出HTML里面的标签.数据等等,是一种处理HTML的简便途径.HTMLParser采用的是一种事件 ...

  10. windows10 专业版的远程服务器管理工具下载

    一.安装远程服务器管理工具: 下载地址: https://www.microsoft.com/zh-cn/download/details.aspx?id=45520 二.关闭远程服务器管理工具: 1 ...