标签: javascript es6


数组新增方法

  • map(可以理解为是映射,以一定规则修改数组每一项并返回全新数组)
  • reduce(可以理解为是汇总,一堆出来一个)
  • filter(可以理解为过滤,筛选的意思,以一定规则拿到符合的项并返回新数组)
  • forEach(感觉和for循环是一个作用)

map示例

示例代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>map</title>
</head>
<body>
<script>
var arr = [1,2,3,4];
var resultArr = arr.map(function(item){
return item*2
});
console.log(arr,resultArr);
</script>
</body>
</html>

测试地址


reduce示例

示例代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>reduce</title>
</head>
<body>
<script>
/*
*注:reduce默认有三个参数,第一个参数是每一次求值的结果值(初始等于数组第一项),
*第二个参数是下一项要计算的项,第三个值为第二个参数在数组中的索引
*/
var arr = [60,20,31,54];
//求数组各项和
var result = arr.reduce(function(temp,next,index){
return temp+next;
});
//求平均值
var result0 = arr.reduce(function(temp,next,index){
if(index < arr.length-1){
return temp + next;
}else{
return (temp+next) / arr.length;
}
})
console.log(arr,result,result0);
</script>
</body>
</html>

参数流程如下图:



测试地址


filter示例

示例代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>filter</title>
</head>
<body>
<script>
/*
*注:根据函数的返回值的真假来决定当前项需不需要放入要返回的新数组中
*itme就是数组的每一项的值,如果return为空则把当前item放入返回的数组中
*/
var arr = [1,2,3,5,8,4];
//取出数组中的偶数项
var resultArr = arr.filter(function(item){
return item % 2 === 0;
})
console.log(arr,resultArr);
</script>
</body>
</html>

测试地址


forEach示例

示例代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>forEach</title>
</head>
<body>
<script>
/*
*对数组执行遍历,其中三个参数依次为当前遍历到的项,当前项的索引,和被遍历的数组本身
*/
var arr = [1,2,3,4];
arr.forEach(function(item,index,arr){
console.log(item,index,arr);
})
</script>
</body>
</html>

测试地址

粗看ES6之数组的更多相关文章

  1. 粗看ES6之函数

    标签: es6 javascript 箭头函数 ES6为了书写方便引入了函数的全新简写方式-箭头函数 <!DOCTYPE html> <html> <head> & ...

  2. 粗看ES6之面向对象写法

    标签: es6 在es6以前,js没有类的概念,虽然有构造函数原型的方式用来做面向对向开发,但是对于书法并不是十分友好,而且对于继承实现也不是十分友好. es6引入class constructor ...

  3. 粗看ES6之JSON

    标签: es6 ES6新增JSON特性不是特别多,只是针对JSON某些情况下的写法上有一些优化: 当key值和value值对应变量名相同时 json对像中的方法书写 示例代码如下: <!DOCT ...

  4. 粗看ES6之字符串

    标签: javascript es6 字符串新增特性 新增二个方法 - startsWith/endsWith 字符串模板 - 反单引号的应用 startsWith 判断字符串以是否以某某开头,返回一 ...

  5. 粗看ES6之解构赋值

    标签: javascript es6 什么是解构赋值? 示例如下: <!DOCTYPE html> <html> <head> <meta charset=& ...

  6. 粗看ES6之变量

    标签: javascript var定义变量面临的问题 可以重复定义 无法限制变量不可修改 无块级作用域 ES6变量定义升级 新增let定义变量 新增const定义常量 let特性 有块级作用域 不可 ...

  7. ES6对数组的扩展(简要总结)

    文章目录 数组的扩展(ES6) 1. 扩展运算符 2. Array.from 3. Array.of() 4. copyWithin() 5. find() 和 findIndex() 6. fill ...

  8. ES6定型数组

    前面的话 定型数组是一种用于处理数值类型(正如其名,不是所有类型)数据的专用数组,最早是在WebGL中使用的,WebGL是OpenGL ES 2.0的移植版,在Web 页面中通过 <canvas ...

  9. 分别使用ES5和ES6进行数组去重以及注意事项

    ES6,ES5数组去重 使用Es6进行数组去重 var arr = [false, true, undefined, null, NaN, 0, 1, {}, {}, 'a', 'a', NaN]; ...

随机推荐

  1. MVC(Java , C# ,php)

  2. 使用pycharm创建自己的第一个django项目

    PyCharm是一种Python IDE,带有一整套可以帮助用户在使用Python语言开发时提高其效率的工具,比如调试.语法高亮.Project管理.代码跳转.智能提示.自动完成.单元测试.版本控制. ...

  3. Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.socket

    一.解决var/run/mysqld没有pid和sock文件 MySQL下mysql.sock丢失丢失的原因一般是因为配置文件不一致的原因,mysqld 错误启动,mysqld_safe 会清除一次m ...

  4. IdentityServer4 学习笔记[2]-用户名密码验证

    回顾 上一篇介绍了IdentityServer4客户端授权的方式,今天来看看IdentityServer4的基于密码验证的方式,与客户端验证相比,主要是配置文件调整一下,让我们来看一下 配置修改 pu ...

  5. 使用gifplayer操作gif的方法

    使用的工具--gifplayer 基本用法: 1.安装 git clone https://github.com/rubentd/gifplayer.git 2.添加一张gif预览的图片 <im ...

  6. 序列终结者 BZOJ 1251 Splay

    题目背景 网上有许多题,就是给定一个序列,要你支持几种操作:A.B.C.D.一看另一道题,又是一个序列要支持几种操作:D.C.B.A.尤其是我们这里的某人,出模拟试题,居然还出了一道这样的,真是没技术 ...

  7. Functions that return a function

    javascript学习中,经常会遇到闭包的问题,然后闭包的很多例子中又会遇到很多返回函数的闭包的例子程序.因为对闭包的理解还不够透彻,然后对于Functions rerurn a function产 ...

  8. 2-28 if...else

  9. Python模块:operator简单介绍

    Python官方文档地址:https://docs.python.org/3.6/library/operator.html?highlight=operator Operator提供的函可用于对象比 ...

  10. mysql 操作数据库创建,增删改查

    创建数据库 默认字符编码 默认排序CREATE DATABASE IF NOT EXISTS day11 DEFAULT CHARSET utf8 COLLATE utf8_general_ci; / ...