es6的新增方法和es5数组的一些方法
Posted bao2333
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了es6的新增方法和es5数组的一些方法相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script> // 大多数情况下，es5的数组方法接受的第一个参数为一个函数，并且对数组的每个元素调用一次该函数。 // 该函数有三个参数：数组元素，元素的索引和数组本身。 // 如果有第二个参数，则第一个参数中的this指向第二个参数。 var arr= [1,2,3,4,5]; var result; //forEach()============================= //从头到尾遍历数组，为每个元素调用指定的函数。 //返回值：undefined 无 //原数组不改变 //计算和 // var sum =0; // arr.forEach(function(val,index,a){ // sum+=val; // console.log(val,index,a) // }) // console.log(sum,arr); // //每个数组元素值+1 // result=arr.forEach(function(val,i){ // arr[i]=val+1; // // break; //直接break会报错，forEach中没法终止遍历 // }) // console.log(arr); // console.log(result); //undefined //map()====================================== //将调用的数组的每个元素传递给指定的函数，并返回一个数组，它包含该函数的返回值 //原数组不改变,而会返回一个新数组 // result = arr.map(function(x){ // return x*x; //一定要有return，否则返回undefined // }) // console.log(result,arr); //filter()==================================== //filter方法返回的数组元素是调用的数组的一个子集。传递的函数是用来逻辑判定的。该函数返回true或false。 //原数组不改变 // var result1 = arr.filter(function(v,i,a){ // return v>3; // }) // [4, 5] // console.log(result1) // var result2= arr.filter(function(v){ // return v%2; // }) //[1, 3, 5] // console.log(arr,result2); // // filter方法可以把稀疏数组中的空元素筛出去 // var result3 = arr.filter(function(v){ // return v!=undefined &&v!=null; // }); // console.log(arr,result3); // every()和some()============================ //every和some是数组的逻辑判定：他们对数组元素应用指定的函数进行判定，返回true或false // every()方法就像数学中的“针对所有”的量词：当且仅当针对数组中的所有元素调用判定函数都返回true，它才返回true // result = arr.every(function(x){ // return x<10; // }) // console.log(result); // result = arr.every(function(x){ // return x%2===0; // }) // console.log(result); // some()方法就像数学中的“存在”的量词：当数组中至少有一个元素调用判定函数返回true，它就返回true，并且当且仅当数值中的所有元素调用判定函数都返回false，它才返回false // result = arr.some(function(v){ // return v%2===0; // }) // console.log(result); //一旦every()和some()确认该返回什么值他们就会停止遍历数组元素 // some在判定第一个元素返回true就停止遍历返回true，否则遍历整个数组直到遇到true // every在判定第一个元素返回false就停止遍历，否知就一直遍历直到遇到false为止 //reduce()和reduceRight()===================== //reduce()和reduceReight()方法使用指定的函数将数组元素进行组合，生成单个值。这在函数式编程中是常见的操作，也可以称为“注入”和“折叠” //返回值为化简函数最后一次返回的结果 //数组求积 // var product = arr.reduce(function(x,y,z,a){ // console.log(x,y,z,a); // return x*y; // }) // console.log(product); // //数组求和 // var sum = arr.reduce(function(x,y,z,a){ // console.log(x,y,z,a); // return x+y; // }); // console.log(sum); // //数组求最大值 // var max = arr.reduce(function(x,y){ // return x>y?x:y; // }) // console.log(max); // reduce()需要两个参数。第一个是执行化简操作的函数。化简函数的任务就是用某种方法把两个值组合或化简为一个值，并返回化简后的值。 //化简函数function(初始值或者上一次化简函数的返回值，数组元素，元素的索引，数组本身) // 第二个参数是一个传递给函数的初始值,当不指定初始值时，他将数组元素的第一个值作为其初始值 // reduceRight()===================== // reduceRight()的工作原理和reduce()一样，不同的是它按照数组索引从高到低（从右到左）处理数组。 // var product = arr.reduceRight(function(x,y,z,a){ // console.log(x,y,z,a); // return x*y; // },1) // console.log(product); //indexOf()和lastIndexOf()===================== </script> </body> </html>
1.let
块作用域
const
常量，不能二次赋值
2.箭头函数
(参数)=>{逻辑代码}
参数为1时
参数=>{}
参数不为一时
()=>{}
返回值为值类型
()=>1
返回值为对象时
()=>({a:a})
其他情况
()=>{}
箭头函数中的this跟包裹他的代码共享this，通常用在回调函数中
setTimeout(()={},1000)
3.增强的对象字面量
var o={
__proto__:parent, //继承
name, //属性简写
fun(){ //方法简写
super.fun(); //调用父级对象上的方法
},
["prpp"+(()=>10)]:110 //动态属性
}
4.类
class extends constructor super static
class 类名{
constructor(构造函数的参数){
this.属性名=“”
}
//公有方法
fun(参数){
//逻辑代码
return
}
//静态方法的定义
static fun(){}
}
var a = new 类名（）;
静态方法的调用
类名.方法名();
子类
class 子类 extends 父类，父类{
constructor(){
super(); //继承父类上的属性方法以及静态方法
this.子类的属性
}
//子类的方法
fun(){
super.fun()
}
}
5.模板字符串
var str = `
${变量名}
`
6.解构
es6按照一定的模式从数组和对象中提取值，
7.默认参数
function f(x,y=10){
}
不定参数
function fun(x,...y){
}
fun(1,1,2,3)
扩展运算符...
function fun(x,y,z){
}
fun(...arr)
以上是关于es6的新增方法和es5数组的一些方法的主要内容，如果未能解决你的问题，请参考以下文章
三阶段课程——Day02（ES6简介let和const）（数据类型和数据结构：字符串扩展Symbol数组新增方法对象新增SetMap数组解构对象解构...运算符）