Memahami Ecmascript 6: Kelas dan Warisan

ECMAScript 6 (ES6) merevolusikan pembangunan JavaScript: meniru kelas dan warisan

ES6 dengan ketara meningkatkan JavaScript, bahasa berasaskan prototaip, dengan menyediakan mekanisme sintaks dan warisan seperti kelas. Ini memberi kuasa kepada pemaju untuk membina aplikasi web berskala besar dengan lebih cekap. Penambahbaikan utama termasuk peraturan penyerahan pembina yang lebih ketat (memerlukan new), kaedah yang tidak dapat dipertahankan, dan warisan yang diperkemas.

Kata kunci extends memudahkan warisan, yang membolehkan penciptaan kelas kanak -kanak khusus dari kelas induk. Kata kunci super memberikan akses kepada kaedah dan pembina kelas induk, membuat warisan langsung.

TypeScript, superset JavaScript, menawarkan laluan yang berharga untuk memahami ES6. Sintaksnya mencerminkan ES6 (tanpa anotasi jenis), menjadikannya alat yang sangat baik untuk menghasilkan kod JavaScript yang mematuhi ES6.

Membuat kelas dalam ES6

sifat berasaskan prototaip JavaScript membolehkan simulasi kelas dalam ES5, tetapi ES6 memudahkannya dengan ketara:

es5 (simulasi):

es6 (kelas asli):

var Animal = (function () {
    function Animal(name) {
        this.name = name;
    }
    Animal.prototype.doSomething = function () {
        console.log("I'm a " + this.name);
    };
    return Animal;
})();

kelas ES6 menawarkan pembacaan yang lebih baik dan menguatkuasakan semantik yang lebih ketat. Kaedah tidak dapat diperbaiki, dan pembina mesti dipanggil dengan .

class AnimalES6 {
    constructor(name) {
        this.name = name;
    }
    doSomething() {
        console.log("I'm a " + this.name);
    }
}

getters and setters, dan privasi yang dipertingkatkan dengan simbol

new

ES6 menyokong getters dan setters, meningkatkan kejelasan kod dan kawalan ke atas akses harta:

Penggunaan

mencipta pengecam unik, memberikan tahap penyembunyian data (walaupun tidak privasi mutlak).

class AnimalES6 {
    constructor(name) {
        this.name = name;
        this[ageSymbol] = 0; // Using Symbol for (near) private member
    }
    get age() { return this[ageSymbol]; }
    set age(value) {
        if (value < 0) console.log("Invalid age");
        this[ageSymbol] = value;
    }
    // ...
}

warisan dalam ES6

Symbol

es6 dengan elegan mengendalikan warisan menggunakan

dan :

Pendekatan ini jauh lebih intuitif dan boleh dibaca daripada simulasi warisan berasaskan prototaip ES5. extends super

Peranan TypeScript dalam pembangunan ES6

class InsectES6 extends AnimalES6 {
    constructor(name) {
        super(name);
        this[legsCountSymbol] = 6; //Using Symbol for (near) private member
    }
    // ...
}

persamaan tutup TypeScript dengan ES6 menjadikannya alat yang ideal untuk belajar dan membangunkan kod ES6. Ia membolehkan pemeriksaan jenis dan peningkatan kod yang lebih baik, akhirnya menghasilkan ES6 (atau ES5) JavaScript bersih.

Kesimpulan

ES6 membawa penambahbaikan yang ketara kepada JavaScript, menjadikannya bahasa yang lebih kuat dan mesra pemaju untuk membina aplikasi web yang kompleks. Pengenalan kelas, warisan yang dipertingkatkan, dan ciri -ciri seperti simbol dan scoping yang lebih baik menyumbang kepada kod yang lebih bersih, lebih banyak dipelihara. TypeScript terus meningkatkan proses pembangunan dengan menyediakan alat tambahan dan keselamatan jenis.

Atas ialah kandungan terperinci Memahami Ecmascript 6: Kelas dan Warisan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!