Gambaran Keseluruhan Let, Const dan Var: Perbezaan Utama Diterangkan

Ada masanya saya menggunakan dan memahami penggunaan praktikal let, const dan var dalam JavaScript, tetapi menerangkannya dalam perkataan adalah mencabar. Jika anda mendapati diri anda dalam kesusahan yang sama, perkara utama yang perlu diberi tumpuan ialah perbezaan skop, pengangkatan, pemulaan semula dan penugasan semula.

Skop:

• var adalah skop fungsi atau skop global jika diisytiharkan di luar mana-mana fungsi.

Contoh dengan var (Fungsi dan Skop Global)

function varExample() {
    if (true) {
        var x = 10; // x is function-scoped
    }
    console.log(x); // Outputs: 10
}
varExample();

if (true) {
    var y = 20; // y is globally scoped because it's outside a function
}
console.log(y); // Outputs: 20

• let dan const adalah berskop blok, bermakna ia hanya boleh diakses dalam blok (dibataskan oleh {}) ia diisytiharkan masuk.

Contoh dengan let (Skop Blok)

function letExample() {
    if (true) {
        let x = 10; // x is block-scoped
        console.log(x); // Outputs: 10
    }
    console.log(x); // ReferenceError: x is not defined
}
letExample();

if (true) {
    let y = 20; // y is block-scoped
    console.log(y); // Outputs: 20
}
console.log(y); // ReferenceError: y is not defined

Contoh dengan const (Skop Blok)

function constExample() {
    if (true) {
        const x = 10; // x is block-scoped
        console.log(x); // Outputs: 10
    }
    console.log(x); // ReferenceError: x is not defined
}
constExample();

if (true) {
    const y = 20; // y is block-scoped
    console.log(y); // Outputs: 20
}
console.log(y); // ReferenceError: y is not defined

Mengangkat

Mengangkat adalah seperti menyediakan ruang kerja sebelum anda memulakan tugas. Bayangkan anda berada di dapur, bersiap sedia untuk memasak hidangan. Sebelum anda mula memasak, anda letak semua bahan dan alatan anda di kaunter supaya mudah dicapai.

Dalam pengaturcaraan, apabila anda menulis kod, enjin JavaScript akan melalui kod anda sebelum benar-benar menjalankannya dan menyediakan semua pembolehubah dan fungsi di bahagian atas skopnya. Ini bermakna anda boleh menggunakan fungsi dan pembolehubah sebelum anda mengisytiharkannya dalam kod anda.

• Ketiga-tiga (var, let, dan const) sememangnya dinaikkan. Walau bagaimanapun, perbezaannya terletak pada cara ia dimulakan semasa proses pengangkatan.

• var dinaikkan dan dimulakan dengan undefined.
  

console.log(myVar); // Outputs: undefined
var myVar = 10;

• let dan const dinaikkan tetapi tidak dimulakan. Ini bermakna mereka berada dalam "zon mati sementara" dari permulaan blok sehingga pengisytiharan ditemui.

console.log(myLet);
// ReferenceError: Cannot access 'myLet' before initialization
let myLet = 10;

console.log(myConst); 
// ReferenceError: Cannot access 'myConst' before initialization
const myConst = 20;

Penugasan Semula dan Pemulaan Semula:

• var boleh dimulakan semula (diisytiharkan semula) dan ditetapkan semula (diberikan nilai baharu). ### Contoh dengan var

var x = 10;
x = 20; // Reassignment
console.log(x); // Outputs: 20

var x = 30; // Reinitialization
console.log(x); // Outputs: 30

• biar tidak boleh dimulakan semula dalam skop yang sama tetapi boleh ditugaskan semula.

let y = 10;
y = 20; // Reassignment
console.log(y); // Outputs: 20

let y = 30; // SyntaxError: Identifier 'y' has already been declared

• const tidak boleh ditugaskan semula; ia mesti dimulakan pada masa pengisytiharan. Walau bagaimanapun, jika const ialah objek atau tatasusunan, kandungan (sifat atau elemen) objek atau tatasusunan boleh diubah suai. ### Contoh dengan const

const z = 10;
z = 20; // TypeError: Assignment to constant variable.

const z = 30; // SyntaxError: Identifier 'z' has already been declared

Contoh dengan const Object

const obj = { a: 1 };
obj.a = 2; // Allowed, modifies the property
console.log(obj.a); // Outputs: 2

obj = { a: 3 }; // TypeError: Assignment to constant variable.

Contoh dengan const Array

const arr = [1, 2, 3];
arr[0] = 4; // Allowed, modifies the element
console.log(arr); // Outputs: [4, 2, 3]

arr = [5, 6, 7]; // TypeError: Assignment to constant variable.

Atas ialah kandungan terperinci Gambaran Keseluruhan Let, Const dan Var: Perbezaan Utama Diterangkan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!