ES6
1.数组的结构赋值
2.对象的解构赋值
3.扩展方法
------------------------------------
暂时性死区：没有赋值先使用了 再赋值 不行！
------------------------------------
1.数组的解构赋值
let [x,y.z] = [1,2,3];
let [x=1,y=2]=[3,5]
//3 5
------------------------------------
2.对象的解构赋值
let {x,y} = {'x':'aaa','y','ccc'};//不是按照顺序匹配 按照key匹配
let {x:a,y} = {"y":"2222","x":"ccc"};
//x 通过x是获取不到ccc的 需要使用 a 来获取
//报错
//a
//"ccc"
//这里 x 匹配模式 a 变量名字
------------------------------------
let obj = {x:a,y} = {"y":"2222","x":"ccc"};
let {x:a,y} = {"y":"2222","x":"ccc"}=obj ;
可以赋值给变量
------------------------------------
let {x=1} ={x:"a"};//a 覆盖1
let {x=1，y} ={x:"a"};//a 覆盖1
y 是空的
------------------------------------
let {x:y=3} ={x:"a"};//
//y
//"a"
------------------------------------
//let {x:y=3} ={x=unfeined};//y 3
let {x:y=3} ={x=null};//y null
------------------------------------
字符串的解构赋值
let [a,b,c,d,e,f] = 'nodejs';
//a n
//b o
//按照排列顺序来赋值的。
------------------------------------
函数参数解构赋值
function fun([x,y]){//格式顺序一致
return x+y;
}
fun([2,5]);//格式顺序一致
//7
------------------------------------
function fun([x=0,y=0]){//默认值 调用的时候不传 就会使用默认值
return x+y;
}
fun([]);
0
------------------------------------
function fun([x=0,y=0]){//格式顺序一致
return x+y;
}
fun([2,5]);//格式顺序一致
7
------------------------------------
这里有漏
let [a,b,c] = num();
//对象
funcion num(){
return =[1,2,3];
}
------------------------------------
对象
function num(){
let obj = {
'name':'aaa',
'age':12
}
return obj;
}
let {name:name,age:age} =num();//前面的叫模式 后面的才是变量名
console.log(name);
//aaa
------------------------------------
let obj = {//JSon 情况下
"name":"aaa",
"age":12,
"friends":["a1","b1"],
"menmbers":{x:1,y:2}
};
let{name:name,age:age,friends:ff,menmbers} = obj;
console.log(ff[1]);//取b1
//ff[0]
//"a1"
//menmbers.y 2
------------------------------------
ES6扩展功能
1.字符串扩展
字符串截取
原生
var str = "hello world";
str.substr(1,4);//1-4 从1开始取4个
//"ello"
str.substring(1,4);//长度
//"ell"
indexOf()//寻找文本 -1没有找到
---------------------------------------
str.startsWith("hello")//字符 串是否头部
//true
str.startsWith("hello",4)//字符 串是否头部 4 代表搜索的位置
//false
str.endsWith("hello")//字符 串是否尾部
//false
str.includes("o");//判断是否有o ES6方法 //可以写第二个参数 第二个参数 代表搜索的位置
//true bool
if(str.indexOf(o)!=-1){};//判断是否有 原生方法
str.repeat(3); //重复N次 把 hello world 重复N次
hello worldhello worldhello world
------------------------------------
//补全功能 长度不够 补全
var s ='s';
s.padStart(4,'xy');//xyxs 补了xyx 加 s
s.padEnd(4,'xy');//sxys 补了 s + xys
//如果长度没有达到 才补全 超过了 不执行 补补全
------------------------------------
//模板字符串 利于字符串拼凑 不用转义了！！
$(".list").html('<li>'+item.name+'<li>')
//模板字符串
$(".list").html(`<li>${item.name}<li>`)
//`````` ```ESC 下的 英文下打
例子：1
例子2：
$(result).each((index,item) =>{
$(".lists ul").append(`<li><span>${item.name}</span><span>${item.content}</span></li>`);
});
------------------------------------
数值扩展
//Number.parseInt();//整数
//Number.parseFloat();//浮点
------------------------------------
函数的扩展
//分页用的很多
//ES5
function fun(x,y){
y =y || "aa";//这个好用 如果没有Y 那么默认就取AA
console.log(x,y);
}
fun(123);
//ES6
function fun(x,y="10"){//默认
console.log(x,y);
}
fun(123);
//123 "10"
------------------------------------
//rets 参数
...变量名
function fun(...alues){//默认 代表全部的参数
console.log(alues);//全部参数
console.log(alues[1]);//取33
}
fun(123,33);
------------------------------------
//箭头函数
let f =v =>v;
f 变量的名字
v 参数
v 函数体 返回的
var f = function(){
return v;
}
------------------------------------
参数为空
let f = () => '123';
f();
------------------------------------
多个参数
let f = (n1,n2)=>n1+n2;
f(1,3);
4
------------------------------------
let f = (n1,n2)=>{return n1+n2};
f(1,3);
4
------------------------------------
//对象
let f = (n1,n2)=>({name:n1,age:n2});
------------------------------------