Rumah  >  Artikel  >  hujung hadapan web  >  Apakah perbezaan antara pewarisan es6 dan pewarisan es5?

Apakah perbezaan antara pewarisan es6 dan pewarisan es5?

青灯夜游
青灯夜游asal
2021-09-03 16:08:556999semak imbas

Perbezaan antara warisan es5 dan es6: Warisan ES5 dilaksanakan melalui mekanisme prototaip atau pembina; ia mula-mula mencipta subkelas, kemudian membuat instantiat kelas induk dan menambahkannya pada subkelas ini. ES6 mula-mula mencipta kelas induk, kemudian mengakses kelas induk dengan memanggil kaedah super dalam subset termaktub, dan kemudian melaksanakan warisan dengan mengubah suai ini.

Apakah perbezaan antara pewarisan es6 dan pewarisan es5?

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

Perbezaan antara warisan es6 dan warisan es5

  • Warisan ES5 pada asasnya mencipta objek contoh subkelas dahulu, dan kemudian Tambah kaedah kelas induk kepada ini (Parent.apply(this)).

  • Mekanisme pewarisan ES6 pada asasnya, objek instance ini bagi kelas induk ialah dicipta dahulu (jadi Anda mesti terlebih dahulu memanggil kaedah super() kelas induk), dan kemudian gunakan pembina subkelas untuk mengubah suai ini.

  • Warisan ES5 dilaksanakan melalui prototaip atau mekanisme pembina.

  • ES6 mentakrifkan kelas melalui kata kunci kelas, yang mempunyai kaedah pembina, dan pewarisan antara kelas dicapai melalui kata kunci lanjutan. Subkelas mesti memanggil kaedah super dalam kaedah pembina, jika tidak, ralat akan dilaporkan semasa membuat contoh baharu. Kerana subkelas tidak mempunyai objek ini sendiri, tetapi mewarisi objek ini kelas induk dan kemudian memprosesnya. Jika kaedah super tidak dipanggil, subkelas tidak boleh mendapatkan objek ini.

Perhatikan bahawa kata kunci super merujuk kepada tika kelas induk, iaitu objek kelas induk ini.

Nota: Dalam pembina subkelas, kata kunci ini hanya boleh digunakan selepas memanggil super, jika tidak, ralat akan dilaporkan.

1. Warisan dalam es5:

	function parent(a,b){
	    this a = a;
	    this b = b;
	}
	function child(c){
	    this c = c
	};

Wariskan ibu bapa melalui subset:

parent.call(child,1,2)

Mari kita panggil Kaedah asas The atribut dalam objek prototaip diberikan kepada objek contoh anak elemen subkelas, dengan itu merealisasikan warisan

child.prototype = new parent(1,2);

2. Warisan dalam ES6

Dalam JS tradisional, objek dijana Dengan mencipta pembina, kemudian mentakrifkan objek yang dihasilkan

dan kemudian menambah kaedah atau atribut yang diperlukan yang sepadan melalui prototaip

function parent(a,b){
    this.a = a;
    this.b = b;
}

Konsep kelas diperkenalkan dalam ES6, iaitu ialah, kelas. Objek ditakrifkan melalui kelas kata kunci.

parent.prototype.methods = function(){
    return 'this is test methods';
}
parent.prototype.attr = 'this is test attr‘;
kelas ialah kata kunci, gula bahasa, supaya anda dapat memahami dengan lebih jelas objek yang dicipta

menggunakan pembina atribut untuk menerima parameter yang dihantar melalui kaedah kawalan tulis atribut ini, Lalai ialah tiada parameter

Warisan dalam ES6 adalah berdasarkan warisan antara kelas. Ini dicapai melalui kata kunci extends.

class parent{
    curstructor(a,b){
        this.a = a;
        this.b = b;
    }
}
Panggil kelas induk melalui instantiasi super

Kod di atas ialah set ringkas warisan kelas ibu bapa-anak ES6.

	class parent{
	  constructor(a,b){
	    this.a = a;
	    this.b = b;
	  }
	  parentMethods(){
	    return this.a + this.b
	  }
	}
	class child extends parent{
	  constructor(a,b,c){
	    super(a,b);
	    this.c = c;
	  }
	  childMethods(){
	    return this.c + ',' + super.parentMethods()
	  }
	}
	const point = new child(1,2,3);
	alert(point.childMethods());
Saya percaya anda telah melihatnya, walaupun perbezaan yang jelas ialah dalam ES6, kaedah super yang mengaktifkan komponen induk, bukannya mencipta instantiasi baharu, dalam erti kata lain, objek contoh kelas induk dibuat terlebih dahulu Selepas panggilan, ubah suai ini dalam pembina subkelas untuk melengkapkan objek prototaip.

Ringkasan:

Perbezaan terbesar antara warisan ES5 dan ES6 ialah:

ES5 mencipta subkelas dahulu, dan dalam instance Transform kelas induk dan tambahkannya pada subkelas ini
  • ES6 mula-mula mencipta kelas induk, dan selepas mengakses kelas induk dengan memanggil kaedah super dalam subset instan, pewarisan ialah direalisasikan dengan mengubah suai ini
  • [Pembelajaran yang disyorkan:
  • tutorial video javascript
]

Atas ialah kandungan terperinci Apakah perbezaan antara pewarisan es6 dan pewarisan es5?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn