目录
解构赋值
解构赋值即按照一定的模式,从数组或对象中提取值,对变量赋值。
1.数组的解构赋值
let [a,b] = [1,2]
// a=1
// b=2
let [a, ,b] = [1,2,3]
// a=1
// b=3
let [a, ...b] = [1,2,3,4]
// a=1
// b=[2,3,4]
let [b] = []
let [a, b] = [1]
// 解构失败
// b的值都是 undefined
2.对象的解构赋值
let { a , b } = { a:'111', b:'222' };
//与数组不同,对象的属性没有次序要求,只要变量与属性同名,就可以取到对应的值
let { a , b } = { b:'222', a:'111'};
// a = "111"
// b = "222"
3.字符串的解构赋值
const [a,b,c,d] = 'milk';
// a = 'm'
// b = 'i'
// c = 'l'
// d = 'k'
4.函数参数的解构赋值
function add([a,b]){
return a+b;
}
add([1,2]); // 3
5.应用
(1)交换变量的值
let a = 1;
let b = 2;
[ a , b ] = [ b , a ]
(2) 取得函数返回值
// 1.返回一个数组
function info (){
return [1,2,3] ;
}
let [a,b,c] = info() ;
// 2.返回一个对象
function info (){
return {
name: 'lisa',
age: 14
};
}
let {name, age} = info();
(3)定义函数参数
function info([name, age]){
...
}
info(['lisa', 15]);
// 参数也可以无次序的值
function info({name, age}){
...
}
info({age: 12, name: 'lisa'})
(4)提取JSON数据
let info = {
name: 'lisa',
age: 10,
data: [1029,17211]
};
let {name, age, data} = info
console.log(name); // lisa
console.log(age); // 10
console.log(data); // [1029,17211]
(5)遍历Map结构
const map = new Map();
map.set('name', 'lisa');
map.set('age', 18);
for(let [key, value] of map){
console.log(key + ' is '+ value);
}
模版字符串
模版字符串是增强版的字符串,用反引号 ` ` 标识,可以定义普通字符串,也可以定义多行字符串,可以在字符串中嵌入变量。
嵌入变量要写在 ${ }中, ${ }中还可以写JS表达式、函数。
eg:
let name = "lisa";
let age = "18";
let str = `<h1>${name} is ${age}</h1>`;
document.getElementById("info").innerHTML = str;
let a = 1;
let b = 2;
`${a+b}` //3
function info(){
return "hello"
}
` ${info()} world ` // hello world