A atribuição de desestruturação também é uma nova sintaxe do ES6 em JavaScript, vamos apenas ver os exemplos e começar a trabalhar! ! !
Muitos alunos aprenderam a usar expressões de atribuição de desestruturação para trocar valores de variáveis :
let a = 'b';
let b = 'a';
[a,b] = [b,a];
console.log(a,b);
Mas a troca de variáveis não se limita a duas variáveis e, se você precisar classificar, desestruturar expressões é uma opção.
let num1 = 30;
let num2 = 10;
let num3 = 40;
let num4 = 20;
[num1,num2,num3,num4] = [num2,num4,num1,num3];
console.log(`第一：${num1},第二：${num2},第三：${num3},第四：${num4}`);
Se você tiver um array, só precisamos pegar três elementos:
Anteriormente apenas atribuiríamos valores um a um:
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
const num1 = arr[0];
const num2 = arr[1];
const num3 = arr[2];Agora só precisamos escrever da seguinte forma, três variáveis serão automaticamente criadas e atribuídas a elas, respectivamente. Observe que aqui o valor é obtido de acordo com a posição na matriz .
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
const [num1,num2,num3] = arr;
console.log(`第一名：${num1},第二名：${num2},第三名：${num3}`);
Claro, há uma situação em que você só precisa colocar o elemento na posição especificada dentro. Nesse momento, você pode usar vírgulas em inglês para separar, o que quiser
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
const [,,num3,,num5] = arr;
console.log(`第三名：${num3},第五名：${num5}`);
Aqui está um detalhe, se o nome da variável que você deseja desconstruir e atribuir já existe, podemos reescrever o valor da variável. Desestruturar e atribuir não é usado necessariamente para variáveis recém-criadas, mas também para modificar variáveis, e deve ser observado aqui Não há necessidade de var, let ou const para declarar variáveis.
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
let num3 = '狗同学'；
let num5 = '猪同学'；
[,,num3,,num5] = arr;
console.log(`第三名：${num3},第五名：${num5}`);
É claro que uma determinada posição na matriz pode não existir.Neste momento, é mais adequado definir o valor padrão, ou seja, adicionar diretamente o valor na posição especificada atribuindo um valor.
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
let num3 = '狗同学'；
let num5 = '猪同学'；
[,,num3,,num5,,num7 = '鹿同学'] = arr;
console.log(`第三名：${num3},第五名：${num5},第七名：${num7}`);
Mas, na verdade, é bastante problemático acessar os arrays de tinta dessa maneira. Podemos mudar os colchetes para chaves (chaves) e especificar o número de série do elemento na forma de um atributo, para que possamos definir variáveis com mais facilidade.
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
const{2:num3, 4:num5} = arr;
console.log(`第三名：${num3},第五名：${num5}`);
É possível que toda a matriz esteja vazia e o valor padrão possa julgar automaticamente a condição para você. Por exemplo, se a matriz estiver vazia, exibirá automaticamente "matriz está vazia" e, se a matriz não estiver vazia, substituirá diretamente o valor padrão.
Além de atribuir valores um a um, se os elementos restantes da matriz precisarem ser salvos, três pontos podem ser usados para indicar que os elementos não superiores restantes estão todos reunidos em uma matriz.
Obs: Não é possível colocar elementos indeterminados primeiro , e depois atribuir valores um a um depois.
const arr = ['蛋同学','鸡同学','鸭同学','鹅同学','牛同学','羊同学'];
const[num1,num2,num3,...restNum] = arr;
console.log(`第三名是：${num1},${num2},${num3},不及格的是：${restNum}`);
Se houver apenas um elemento indeterminado ao desconstruir e atribuir, a matriz inteira será realmente copiada
const arr = ['蛋同学','鸡同学','鸭同学'];
const[...copyArr] = arr;
console.log(copyArr); 
Também não precisamos chamar o método concat para copiar o array
Também podemos desestruturar arrays aninhados:
const arr = ['蛋同学','狗同学',['鸡同学','鸭同学'],['鹅同学','牛同学','羊同学'],'鹿同学'];
const[num1,,[,num2],[,,num3]] = arr;
console.log(`第1个数组的第1个元素：${num1}，第2个数组的第2个元素：${num2}，第3个数组的第3个元素：${num3}`);