Ketidakhadiran dalam JavaScript

Immutability: Satu asas pengaturcaraan berfungsi, menawarkan kelebihan yang ketara kepada pengaturcaraan berorientasikan objek juga. Artikel ini menerangkan kebolehubahan dalam JavaScript, memperincikan pelaksanaan dan faedahnya.

Konsep Utama:

• Immutability: Sebaik sahaja dicipta, keadaan objek yang tidak berubah tetap tidak berubah. Ini berbeza dengan objek yang boleh berubah, yang boleh diubahsuai. Dalam JavaScript, primitif seperti rentetan dan nombor tidak berubah, manakala tatasusunan dan objek boleh berubah.
• Struktur data yang tidak berubah: Mencapai kebolehubahan dengan tatasusunan dan objek memerlukan membuat contoh baru apabila pengubahsuaian, bukannya mengubah asal. JavaScript tidak mempunyai sokongan terbina dalam, memerlukan perpustakaan seperti Mori atau Immutable.js.
• Prestasi: Walaupun pada mulanya muncul memori-intensif, kebolehubahan sering meningkatkan prestasi melalui "perkongsian struktur." Ia juga memudahkan perubahan penjejakan, penting dalam kerangka UI.

Memahami Immutability:

mutabiliti, hanya meletakkan, bermakna sesuatu adalah tertakluk kepada perubahan. Dalam pengaturcaraan, objek yang boleh berubah membolehkan perubahan kepada keadaan mereka. Ketidakhadiran adalah sebaliknya: nilai yang tidak berubah kekal tetap selepas penciptaan. Banyak nilai biasa tidak berubah. Contohnya:

const statement = "I am an immutable value";
const otherStr = statement.slice(8, 17); 

adalah rentetan baru;

tetap tidak berubah. Kaedah rentetan membuat rentetan baru; Mereka tidak mengubah suai asal. Ini kerana rentetan tidak berubah. Nombor berkongsi ciri ini. otherStr statement

mutabilitas dalam javascript:

rentetan dan nombor terbina dalam JavaScript tidak berubah. Walau bagaimanapun, tatasusunan boleh berubah:

let arr = [];
let v2 = arr.push(2); // arr is modified; v2 holds the new length

akan berkelakuan berbeza:

ImmutableArray

Begitu juga,

const arr = new ImmutableArray([1, 2, 3, 4]);
const v2 = arr.push(5);

arr.toArray(); // [1, 2, 3, 4]
v2.toArray();  // [1, 2, 3, 4, 5]

(menggantikan objek) akan mengembalikan objek baru apabila sifat "ditetapkan":

ImmutableMap

const person = new ImmutableMap({name: "Chris", age: 32});
const olderPerson = person.set("age", 33);

person.toObject(); // {name: "Chris", age: 32}
olderPerson.toObject(); // {name: "Chris", age: 33}

kebolehubahan dalam amalan (menggunakan immutable.js):

Oleh kerana JavaScript tidak mempunyai struktur yang tidak berubah asli, kami menggunakan perpustakaan seperti tidak dapat ditemui. Mari kita pertimbangkan contoh permainan yang lebih baik. Papan adalah peta yang tidak berubah, dengan

sebagai senarai peta yang tidak berubah (setiap jubin). Penggunaan Inisialisasi

'S tiles Fungsi: immutable.js fromJS

Fungsi logik permainan mengambil struktur yang tidak berubah, kembali contoh baru.

function createGame(options) {
  return Immutable.fromJS({
    cols: options.cols,
    rows: options.rows,
    tiles: initTiles(options.rows, options.cols, options.mines)
  });
}

bendera jubin seperti yang dinyatakan. Dengan data yang boleh berubah:

revealTile

Dengan data yang tidak berubah, kami menggunakan

function revealTile(game, tile) {
  game.tiles[tile].isRevealed = true; //Direct mutation
}

:

setIn

function revealTile(game, tile) {
  return game.setIn(['tiles', tile, 'isRevealed'], true);
}

Mengembalikan contoh baru yang tidak berubah. Untuk keteguhan, kita boleh menyemak kewujudan jubin menggunakan

: setIn getIn

function revealTile(game, tile) {
  return game.getIn(['tiles', tile]) ?
    game.setIn(['tiles', tile, 'isRevealed'], true) :
    game;
}

Pertimbangan Prestasi:

Semasa membuat objek baru mungkin kelihatan tidak cekap, "perkongsian struktur" meminimumkan overhead ingatan. Impak prestasi sering lebih besar daripada manfaat kebolehubahan.

Penjejakan perubahan yang lebih baik:

Immutability memudahkan perubahan penjejakan dalam kerangka UI. Membandingkan rujukan () dengan cekap menentukan jika keadaan telah berubah. a === b

Kesimpulan:

Immutability meningkatkan kualiti kod dan penyelenggaraan. Walaupun memerlukan lengkung pembelajaran, faedahnya sering melebihi cabaran awal. Terokai codepen yang disediakan (pautan tidak disediakan dalam teks asal) untuk contoh yang lengkap.

(bahagian Soalan Lazim dikeluarkan untuk keringkasan, kerana ia adalah pengulangan maklumat yang sudah ada dalam teks utama. Jika anda suka, sila beritahu saya.)

Atas ialah kandungan terperinci Ketidakhadiran dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!