Cet article vous apporte une introduction à l'utilisation de la déstructuration et de l'attribution de variables dans ES6 (avec du code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.
Affectation déstructurante des tableaux
Utilisation de base
ES6 permet d'extraire des valeurs de tableaux et d'objets et d'attribuer des valeurs à des variables selon certains modèles, ce qu'on appelle un structure.
Avant ES6, si vous vouliez attribuer une valeur à une variable, vous ne pouviez spécifier que sa valeur, comme suit :
let a = 1; let b = 2
Dans ES6, cela peut s'écrire comme ceci, comme suit :
let [a,b] = [1,2] // a = 1, b = 2
Il est à noter que les valeurs des deux côtés de l'équation doivent être égales, de sorte que la variable de gauche se verra attribuer la valeur correspondante à droite Si la valeur. à gauche n'est pas égal, indéfini apparaîtra, comme suit :
let [foo,[[bar],baz]] = [1,[[2],3]] foo // 1 bar // 2 baz // 3 注意：只有左右两边的 格式一定要对等，数量可以不对等。 let [a,b,c] = [1,2] a = 1, b = 2, c = undefined let [a,,c] = [1,2,3] a = 1, c = 3 let [a, ...b] = [1,2,3] a = 1, b = [2,3] let [a] = [] let [b,a] = [1] a = undefined
Il existe une autre situation où le côté gauche du signe égal est un tableau, mais le côté droit de le signe égal correspond à d'autres valeurs et une erreur sera signalée. Comme suit :
let [a] = 1;
let [a] = false;
let [a] = NaN;
let [a] = undefined;
let [a] = null;
let [a] = {};
以上都会报错Mais si la gauche est un tableau et la droite est une chaîne, la valeur du premier indice de la chaîne sera prise
let [a] = '121321' a = '1' let [a] = 'adgasg' a = 'a'
Pour l'ensemble structure, la même chose peut être utilisée pour l'affectation de déstructuration de tableau.
let [x,y,z] = new Set([1,2,3]) x = 1, y = 2, z = 3
L'affectation de déstructuration permet de spécifier la valeur par défaut
let [a = 3] = [] // a:3 let [a = 3,b] = [,4] // a:3 b:4 let [a = 3,b] = [5,4] // a:5 b:4
Spécial
let [a = 3] = [undefined] // a:3 let [a = 3] = [null] // a:null
Conseils : Utilisation de l'égalité stricte dans l'opérateur es6 , si la valeur par défaut doit être efficace dans l'affectation de structure, la valeur par défaut ne doit être utilisée que lorsque la valeur équivalente est non définie, sinon l'affectation sera toujours utilisée. Dans ce qui précède, null n'est pas strictement égal à undefined++
Si l'affectation de la valeur par défaut est une expression, uniquement lorsque l'affectation à droite du signe égal n'a pas de valeur de indéfini, la valeur dans l'expression sera prise Valeur, comme suit :
function demo(){
console.log('demo')
}
let [a = demo()] = [] // a: demo
let [a = demo()] = [1] // a : 1La différence avec les tableaux est que les éléments du tableau doivent être dans la même position que les éléments attribués pour une affectation correcte et la déstructuration des objets L'affectation nécessite que les variables et les attributs des deux côtés du signe égal aient le même nom pour obtenir la valeur correcte. Sinon, la valeur est indéfinie
let {a,b} = {a:'23',b:'3'}
let {a,b} = {b:'3',a:'23'}
// 上面两个的值 都是 a: 23 b: 3
let {a,b} = {a:'3',c:'d'}
//a: 3 b: undefinedL'affectation déstructurante de l'objet affecte également la méthode d'un objet existant à une nouvelle variable, de la manière suivante :
let {sin,cos} = Math
// Math 中的sin cos 方法将赋值给变量 sin cos
let {log} = console
// log(2) === console.log(2)Si le nom de la variable à gauche du signe égal ne peut pas être cohérent avec le nom d'attribut de l'objet à droite du signe égal, il doit être écrit au format suivant :
let {a:b} = {a:'ss'} // b：ss
//a是属性名，b才是实际赋值的变量名L'affectation déstructurante de l'objet peut également être une déstructuration imbriquée, de la manière suivante :
第一种：
let obj = {
p:[
'Hello',
{y:'world'}
]
}
let {p:[x,{y}]} = obj
// x: Hello, y: world
这边的p只是属性不是变量，如果p想赋值可以写成：
let {p,:[x,{y}]} = obj
第二种：
const a = {
loc: {
t :1,
b :{
c:1,
d:2
}
}
}
let {loc:{t,b:{c,d}}} = a
或者
let {loc,loc:{t,b,b:{c,d}}} = alet o = {}, arr = []
({foo:o.prop,bar: arr[0]} = {foo:123,bar:true})
//o: 123, arr = [true]Si le mode de déstructuration est un objet imbriqué, si la propriété parent de l'objet enfant n'existe pas, une erreur sera signalée, comme suit :
let {foo:{bar}} = {baz:'baz'} //报错let {x = 3} = {}
// x: 3
let {x,y = 5} = {x : 1}
// x: 1, y: 5
let {x: y = 5} = {}
// y = 5
let {x: y = 5} = {x : 4}
// y = 4
let {x: y = 'hhhh'} = {}
//y = 'hhhh'
Tips:以上左边 x为属性名，y为变量
let {x = 5} = {x: undefined}
// x: 5
let {x = 4} = {x: null}
// x: null
同数组一样遵循 严格等于
只有右边为undefined的时候默认值才会生效Notes :
1) Les variables déclarées ne peuvent pas être utilisés pour l'affectation de déstructuration car ils constituent déjà un bloc de code.
Si l'objet d'affectation est un tableau, la chaîne sera divisée selon le format du tableau, et l'affectation sera individuelle
let [a,b] = 'ha'
// a = h , b = a
同时可以获得字符串的长度：
let {length:len} = '12121'
// len = 5Si le côté droit du signe égal est un nombre ou une valeur booléenne, il sera converti en objet En d'autres termes, sauf pour les tableaux. et les objets, les autres valeurs seront converties en objets, sauf null et indéfini. Comme suit :
let {t:s} = 123
let {t: s} = truefunction add([x,y]){
return x+y
}
add([3,5]) // 8
[[3,5],[6,7]].map(([a,b]) => a + b)
//8 , 13
function m({x=3, y=4} = {}){
return [x,y]
}
m({x:33,y:8}) // [33,8]
m({x:32}) // [32,4]
m({}) // [3,4]
m() // [3,4]
function m({x,y} = {x=0,y=0}){
return [x,y]
}
m({x:33,y:8}) // [33,8]
// 代替右边的 x:0, y:0 所以是传值 33 8
m({x:32}) // [32,undefined]
//因为传值替代右边的赋值，但是只有x没有y
//所以y是取 左边y的默认值，因为你没有赋值 为undefined
m({}) // [undefined,undefined]
// 取左边x,y的默认值，因为没有赋值 为undefined
m() // [0,0]
// 没有传值，使用本身的赋值 都是0
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
