1、e6新增常用数组方法
1、forEach() 遍历数组,无返回值,不改变原数组,仅仅只是遍历数组
let arr = [1,2,3,4]arr.foreach((item,index)=>{ console.log(item) // 结果1,2,3,4})
2、map() map遍历数组,需要返回值,返回一个新数组,不改变原数组
var arr = [1,2,3,4];arr.map((item,index,arr)=>{ return item*10; //结果为10,20,30,40});//map遍历数组,返回一个新数组,不改变原数组
3. filter() 用于过滤数组中不满住条件的值,返回一个新数组,不改变原数组
let arr = [1,2,3,4,5]arr.filter((item)=>{ return item > 2 //条件表达式成立保留不成立筛选掉})
4. reduce() reduce让数组的前后两项进行某种计算,然后返回其值,并继续计算,不改变原数组,返回计算的最终结果,从数组的第二项开始遍历,必须要有返回值,返回的就是reduce函数最后的结果。
//total必需。设置初始值
//currentValue必需。当前元素的值。 function(total, currentValue, currentIndex, arr)
//index可选。当前元素的数组索引。
//arr可选。当前元素所属的数组对
// initialValue
用法:
var arr = [1, 2, 3, 4];var sum = arr.reduce(function(prev, cur, index, arr) { console.log(prev, cur, index); return prev + cur;})console.log(arr, sum);
5、some() 遍历数组每一项,有一项返回true,则停止遍历,结果返回true。不改变原数组。
let arr = [1,2,3,4];arr.some((item,index)=>{ return item > 2; //返回true});
6.every() 遍历数组每一项,每一项返回true,最终结果为true.有一项返回false,停止遍历,结果返回为false。不改变原数组。
var arr = [1,2,3,4];arr.every((item,index,arr)=>{ return item >1; //返回false});
数组方法总结
以上6个方法均为ES6语法,IE9及以上才支持。不过可以通过babel转意支持IE低版本。以上均不改变原数组。some、every返回true、false。map、filter返回一个新数组。reduce让数组的前后两项进行某种计算,返回最终操作的结果。forEach 无返回值。
2、不同的声明方式
一,变量声明:
let声明变量:
- 变量不可重复声明,let star = '罗志祥' let star = '小猪'结果报错
- 块级作用域,{ let girl = '周扬青' }在大括号内的都属于作用域内
- 不存在变量提升
- 不影响作用域链const声明常量:const SCHOOL = ‘学校’;一般习惯把常量全用大写字母
- 一定要赋初始值
- 一般常量使用大写(潜规则)
- 常量值不能修改
- 块级作用域
- 对数组和对象的元素修改,不算对常量的修改,不会报错
3、解构赋值
变量的结构赋值:es6语序按照一定的模式从数组和对象中提取值,对变量进行赋值。被称为结构赋值
//数组的解构
const F4 = ["小沈阳", "刘能", "赵四", "宋小宝"];
let [xiao, liu, zhao, song] = F4;
console.log(xiao);
console.log(liu);
console.log(zhao);
console.log(song);
//对象的解构
const zhaob = {
name: "赵本山",
age: "no",
xiaopin: function () {
console.log("我会小品");
},
};
let { name, age, xiaopin } = zhaob;
// console.log(xiaopin);
let { name } = zhaob;
console.log(name);
//可以寻找同名属性进行赋值
4、ES6引入了新的声明字符串的方式 ``(反引号)
let str = `我也是一个字符串哦`
// 内容中可以直接出现换行符
let str = `
<ul>
<li>a</li>
<li>b</li>
<li>c</li>
</ul>
`
// 变量拼接
let name1 = "悦悦";
let job = `${name1}是嫦娥的兔兔`;
console.log(job);
//控制态结果:悦悦是嫦娥的兔兔
//${}是变量拼接的固定格式
5、ES6中允许直接在大括号里直接写入变量和函数,作为对象的属性和方法、
let name1 = "悦悦";
let job = `${name1}是嫦娥的兔兔`;
console.log(job);
let school = {
name1,
job,
fun() {
console.log(1);
},
};
//当变量作为对象的属性时,不用再写成name1:name1,方法fun:fuction(){}也可以直接简写成fun(){}
6、箭头函数
以前的函数为:let fun = function(a,b){}
箭头函数则改为:let fun = (a,b)=>{}
1.this是静态的,this始终指向函数声明时所在作用域下的this的值
2.不能作为构造函数实例化对象
3.不能使用arguments变量
4.箭头函数的简写
(1)当形参只有一个时候,可以省略小括号
let fun = a=>{}
(2)当大括号内只有一句话的时候,大括号可以省略,而且语句执行结果就是函数的返回值
let fun = a=> a+b
(3)箭头函数适合与this无关的回调,如定时器,数组方法的回调。不适合与this有关的回调,如事件回调,对象方法