Bagaimana untuk membalikkan tatasusunan dalam ES6

Dalam ES6, anda boleh menggunakan kaedah reverse() bagi objek tatasusunan untuk mencapai pembalikan tatasusunan Kaedah ini digunakan untuk membalikkan susunan elemen dalam tatasusunan, meletakkan elemen terakhir dahulu dan yang pertama Elemen diletakkan di hujung, sintaksnya ialah "array.reverse()". Kaedah reverse() akan mengubah suai tatasusunan asal Jika anda tidak mahu mengubah suainya, anda perlu menggunakannya dengan operator pengembangan "..." dan sintaksnya ialah "[...array].reverse() ".

Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

Menterbalikkan tatasusunan dengan kekangan tertentu ialah salah satu cabaran paling biasa dalam temu duga kerja dan ujian pengekodan.

Dalam ES6, anda boleh menggunakan kaedah reverse() objek tatasusunan untuk membalikkan tatasusunan. Kaedah reverse() membalikkan susunan elemen tatasusunan supaya elemen pertama menjadi elemen terakhir dan elemen terakhir menjadi elemen pertama.

Cara untuk membalikkan tatasusunan dalam JavaScript menggunakan kaedah Songsang

let numbers = [1, 2, 3, 4, 5];
let reversedNumbers = numbers.reverse();

console.log(reversedNumbers);
// [5, 4, 3, 2, 1]

Tetapi ingat, kaedah reverse mengubah suai tatasusunan asal:

let numbers = [1, 2, 3, 4, 5];
let reversedNumbers = numbers.reverse();

console.log(reversedNumbers);
// [5, 4, 3, 2, 1]

console.log(numbers);
// [5, 4, 3, 2, 1]

Sesetengah cabaran pengekodan mungkin mahu anda mengekalkan tatasusunan asal, jadi mari lihat cara membalikkan tatasusunan tanpa mengubah tatasusunan asal.

Cara untuk membalikkan tatasusunan dalam JavaScript menggunakan operator Spread

Anda boleh menggunakan gabungan operator spread (Spread) dan kaedah reverse untuk membalikkan tatasusunan, dan Tidak perlu menukar tatasusunan asal.

Mula-mula, anda meletakkan elemen yang dikembalikan oleh operator spread ke dalam tatasusunan baharu dengan mengelilingi sintaks hamparan dengan kurungan segi empat sama []:

[...numbers]

Kemudian, anda memanggil < pada tatasusunan 🎜> Kaedah. Dengan cara ini, kaedah reverse akan dilaksanakan pada tatasusunan baharu dan bukannya tatasusunan asal: reverse

let numbers = [1, 2, 3, 4, 5];
let reversedNumbers = [...numbers].reverse();

console.log(reversedNumbers);
// [5, 4, 3, 2, 1]

console.log(numbers);
// [1, 2, 3, 4, 5]

Nota : Kaedah ialah sintaks ES6 apabila anda perlu menyokong lebih banyak Untuk pelayar lama atau apabila menggunakan sintaks ES5, anda boleh menggunakan kaedah spread dan slice bersama-sama. Jom tengok sekarang. reverse

Cara untuk membalikkan tatasusunan dalam JavaScript menggunakan kaedah Slice dan Songsang

kaedah digunakan untuk mengembalikan elemen yang dipilih sebagai tatasusunan baharu apabila anda Apabila anda memanggil kaedah tanpa sebarang parameter, ia mengembalikan tatasusunan baharu yang sama dengan tatasusunan asal (dari elemen pertama hingga elemen terakhir). slice

Seterusnya, anda memanggil kaedah

pada tatasusunan yang baru dikembalikan, itulah sebabnya tatasusunan asal tidak diterbalikkan: reverse

let numbers = [1, 2, 3, 4, 5];
let reversedNumbers = numbers.slice().reverse();

console.log(reversedNumbers);
// [5, 4, 3, 2, 1]

console.log(numbers);
// [1, 2, 3, 4, 5]

Bagaimana untuk melakukan ini tanpa Songsang kaedah Reverse Array dalam JavaScript

Kadangkala temu bual mencabar anda untuk membalikkan tatasusunan tanpa menggunakan kaedah

. tiada masalah! Anda boleh menggunakan gabungan kaedah reverse gelung dan tatasusunan for, seperti dalam contoh di bawah. push

let numbers = [1, 2, 3, 4, 5];
let reversedNumbers = [];

for(let i = numbers.length -1; i >= 0; i--) {
  reversedNumbers.push(numbers[i]);
}

console.log(reversedNumbers);

Cara menulis fungsi songsang anda sendiri dalam JS

Akhir sekali, katakan anda ditugaskan untuk menulis fungsi songsang anda sendiri yang perlu diterbalikkan tanpa membuat tatasusunan salinan. Pada pandangan pertama, ini mungkin kelihatan rumit, tetapi jangan risau kerana ia sebenarnya agak mudah.

Apa yang anda perlu lakukan di sini ialah menukar elemen pertama dan terakhir tatasusunan, kemudian elemen kedua dan kedua terakhir, dan seterusnya sehingga semua elemen ditukar.

Mari tulis fungsi untuk melakukan ini.

Tulis fungsi

dan gunakan customReverse sebagai pembolehubah sambil menyimpan indeks pertama sebagai array.length - 1 dan indeks terakhir. 0

function customReverse(originalArray) {
  let leftIndex = 0;
  let rightIndex = originalArray.length - 1;
}

Seterusnya, buat gelung

yang akan berjalan selagi while kurang daripada leftIndex. rightIndex

Dalam gelung ini, tukar nilai

dan leftIndex, anda boleh menyimpan sementara salah satu nilai dalam pembolehubah sementara: rightIndex

while (leftIndex < rightIndex) {
  // 交换元素
  let temp = originalArray[leftIndex];
  originalArray[leftIndex] = originalArray[rightIndex];
  originalArray[rightIndex] = temp;
}

Akhir sekali, gantikan

Untuk bergerak ke atas, gerakkan leftIndex ke bawah, dan apabila gelung rightIndex berulang, ia akan menukar elemen kedua terakhir, dan seterusnya: while

 function customReverse(originalArray) {

  let leftIndex = 0;
  let rightIndex = originalArray.length - 1;

  while (leftIndex < rightIndex) {

    // 用temp变量交换元素
    let temp = originalArray[leftIndex];
    originalArray[leftIndex] = originalArray[rightIndex];
    originalArray[rightIndex] = temp;

    // 将索引移到中间
    leftIndex++;
    rightIndex--;
  }
}

apabila tiada lagi elemen untuk membalikkan , gelung akan berhenti serta-merta. Untuk tatasusunan bernombor ganjil, nilai

dan leftIndex akan sama, jadi tidak perlu menukarnya. Untuk tatasusunan nombor genap rightIndex akan lebih besar daripada leftIndex. rightIndex

Anda boleh menguji ciri untuk melihat sama ada ia berfungsi dengan betul, seperti yang ditunjukkan di bawah:

let myArray = [1, 2, 3, 4, 5];

customReverse(myArray);

console.log(myArray);

// output is [5, 4, 3, 2, 1]

[Cadangan berkaitan:

Tutorial video javascript, Video pengaturcaraan 】

Atas ialah kandungan terperinci Bagaimana untuk membalikkan tatasusunan dalam ES6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!