ES6 语法
*** 箭头函数,是对原函数的简写
1.如果只有一个参数,()可以省。
2.如果只有一个return,{}可以省。
let arr=[12,5,8,99,33,14,26];
arr.sort(function(n1,n2){
return n1-n2;
})
arr.sort((n1,n2)=>{
return n1-n2;
});
()=>{
}
window.onload=function(){
alert('abc');
};
window.onload=()=>{
alert('abc');
};
let show = functon(a,b){
alert(a+b);
}
let show=(a,b)=>{
alert(a+b);
};
函数参数
1.收集剩余参数
function show(a,b,...args){
alert(a);
}
show(12,15,8,9,10)
2.展开数组 就跟把数组内容直接写在这儿。
let arr1=[1,2,3];
let arr1=[6,7,8];
...arr
let arr=[...arr1,...arr2];
alert(arr);
function show(...args){
fn(...args);
}
function fn(a,b){
alert(a+b);
}
show(12,5);
3.默认参数
$('#div1').animate({'200px'},1000);
解构赋值
1.左右两边结构必须一样
2.声明和赋值不能分开
let arr=[1,2,3];
let [a,b,c]=[1,2,3];
let {a,b,c}={a:12,c:5,b:12};
let[{a,b},[n1,n2,n3],num,str]=[{a:12,b:5},[12,5,8],8,'cxzcv'];
let[json,[n1,n2,n3],num,str]=[{a:12,b:5},[12,5,8],8,'cxzcv'];
数组
map 映射
reduce 汇总
filter 过滤器
forEach 循环
let arr=[12,6,8]
let rexult=arr.map(function(item){
return item*2;
})
let result=arr.map(item=>item*2);
let score=[19,67,99,28,90];
let result=score.map(item=>item>=60?'及格':'不及格');
let arr=[12,69,180,8679];
arr.reduce(function(a,b,index){
if(index!=this.length-1){
return tmp+item;
}else{
return (tmp+item)/arr.length;
}
})
filter 过滤器
let arr=[12,6,7,99,30,76];
let result=arr.filter(item=>{
if(item/3==0){
return true;
}else{
return false;
}
})
let arr=[
{title:'男士衬衫',price:75},
{title:'女士包',price:75},
{title:'女士鞋',price:27531}
]
let result=arr.filter(json=>json.price>=10000);
forEach
let arr=[12,6,7,99,30,76];
arr.forEach((item,index)=>{
alert(item);
})
字符串
1.多了两个新方法
startsWith(); endsWith();
2.字符串模板
let a=12;
let str=`ab${a}c`;
let str2=`<div>
<h1>${title}</h1>
<p>${content}</p>
</div>`;
Es6 面向对象
function User(name,pass){
this.name=name;
this.pass=pass;
}
User.prototype.showName=function(){
alert(this.name);
}
var ul=new User('blue','123467');
class User{
constructor(name,pass){
this.name=name;
this.pass=pass;
}
showName(){
alert(this.name);
}
showPass(){
alert(this.pass);
}
}
继承:
function VipUser(name,pass,level){
}
class VipUser extends User{
constructor(name,pass,level){
super(name,pass);
this.level=level;
}
showLevel(){
alert(this.name);
}
}
var vl=new VipUser('blue','123467');
vl.showName();
JSON
1.json
let json={a:12,b:5};
let str=JSON.stringfy(json);
let str="{"a":12,"b":5,"c":'abc'}";
let json=JSON.parse(str);
json的标准写法:
1.只能用双引号
2.所有名字都必须用引号包起来
{"a":12,"b":6}
2.json 简写
let a=12;
let b=6;
let json={a,b} //名字和值一样时只写一个
Promise--承诺,消除异步操作
*用同步方式,书写异步代码。
let p =new Promise(functon(resolve,reject){
//异步代码
//resolve 成功了
//reject 失败了
$.ajax({
url:'data/arr.txt',
dataType:'json',
success(arr){
resolve(arr);
},
error(err){
reject(err);
}
})
});
function createPromise(url){
return new Promise(functon(resolve,reject){
$.ajax({
url:url,
dataType:'json',
success(arr){
resolve(arr);
},
error(err){
reject(err);
}
})
});
}
let p2 =new Promise(functon(resolve,reject){
//异步代码
//resolve 成功了
//reject 失败了
$.ajax({
url:'data/json.txt',
dataType:'json',
success(arr){
resolve(arr);
},
error(err){
reject(err);
}
})
});
Promise.all([
<!-- p1,p2 -->
createPromise('data/arr.txt'),
createPromise('data/json.txt'),
]).then(function(arr){
let [res1,res2]=arr;
alert('成功了'+arr);
},function(err){
alert('失败了'+err);
});
p.then(function(arr){
alert('成功了'+arr);
},function(err){
alert('失败了'+err);
});
<script>
let p= $.ajax({url:'data/arr.txt',dataType:'json'});
Promise.all([
$.ajax({url:'data/arr.txt',dataType:'json'}),
$.ajax({url:'data/json.txt',dataType:'json'}),
]).then(function(result){
let [arr,json]=result;
alert('成功了');
},function(){
alert('失败了');
});
//有了Promise之后的异步
Promise.all([$.ajax(),$.ajax()]).then(results=>{
//对了
},err=>{
//错了
});
<script>
------------
Promise.race([
$.ajax({url:'www.baidu.com'}),
$.ajax({url:'www.baidu.com'}),
$.ajax({url:'www.baidu.com'}),
$.ajax({url:'www.baidu.com'}),
]);
generator 生成器函数
普通函数——一路到底
generator_中间能停
function *show(){
alert('a');
yield;
alert('b');
}
let genObj=show();
genObj.next();
2.generator yield 传参,返回
function *show(num1,num2){
alert('a');
let a=yield;
alert('b');
}
let gen=show(99,88);
gen.next(12);
gen.next(5);
function *show(num1,num2){
alert('a');
let a=yield;
alert('b');
}
let gen=show();
let res1=gen.next(12);
let res2=gen.next(5);