Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci tentang cara kelas ditakrifkan dalam kemahiran javascript (empat cara)_javascript

Penjelasan terperinci tentang cara kelas ditakrifkan dalam kemahiran javascript (empat cara)_javascript

WBOY
Lepaskan: 2016-05-16 15:24:21
asal
1444 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara mentakrifkan kelas dalam JavaScript. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Takrifan kelas merangkumi empat cara:

1. Kaedah kilang

function createCar(name,color,price){
  var tempcar=new Object;
  tempcar.name=name;
  tempcar.color=color;
  tempcar.price=price;
  tempcar.getName=function(){
   document.write(this.name+"-----"+this.color+"<br>");
  };
  return tempcar;
}
var car1=new createCar("工厂桑塔纳","red","121313");
car1.getName();

Salin selepas log masuk

Mentakrifkan fungsi kilang yang boleh mencipta dan mengembalikan objek jenis tertentu Ia kelihatan baik, tetapi terdapat masalah kecil,

Fungsi baharu showColor perlu dibuat setiap kali ia dipanggil, kita boleh mengalihkannya ke luar fungsi,

function getName(){
  document.write(this.name+"-----"+this.color+"<br>");
}

Salin selepas log masuk

Tuding padanya terus dalam fungsi kilang

Salin kod Kod adalah seperti berikut:
tempCar.getName = getName;

Ini mengelakkan masalah mencipta fungsi berulang kali, tetapi ia tidak kelihatan seperti kaedah objek.

2. Kaedah Pembina

function Car(name,color,price){
  this.name=name;
  this.color=color;
  this.price=price;
  this.getColor=function(){
   document.write(this.name+"-----"+this.color+"<br>");
  };
}
var car2=new Car("构造桑塔纳","red","121313");
car2.getColor(); 

Salin selepas log masuk

Anda boleh melihat perbezaan daripada kaedah pertama Tiada objek yang dibuat di dalam pembina, tetapi kata kunci ini digunakan.

Apabila menggunakan baru untuk memanggil pembina, objek pertama kali dibuat dan kemudian diakses menggunakan ini.

Penggunaan ini hampir sama dengan bahasa berorientasikan objek lain, tetapi kaedah ini mempunyai masalah yang sama seperti yang sebelumnya, iaitu mencipta fungsi berulang kali.

3. Kaedah prototaip

function proCar(){
}
proCar.prototype.name="原型";
proCar.prototype.color="blue";
proCar.prototype.price="10000";
proCar.prototype.getName=function(){
  document.write(this.name+"-----"+this.color+"<br>");
};
var car3=new proCar();
car3.getName();

Salin selepas log masuk

Kereta pembina pertama kali ditakrifkan tanpa sebarang kod, dan kemudian sifat ditambah melalui prototaip. Kelebihan:

a. Semua kejadian menyimpan penunjuk ke showColor, yang menyelesaikan masalah mencipta fungsi berulang kali

b. Anda boleh menggunakan instanceof untuk menyemak jenis objek

Salin kod Kod adalah seperti berikut:
alert(car3 instanceof proCar);//true

Kelemahan, tambah kod berikut:

proCar.prototype.drivers = newArray("mike", "sue");
car3.drivers.push("matt");
alert(car3.drivers);//outputs "mike,sue,matt"
alert(car3.drivers);//outputs "mike,sue,matt"

Salin selepas log masuk

pemandu ialah penunjuk kepada objek Array dan kedua-dua kejadian proCar menghala ke tatasusunan yang sama.

4. Kaedah prototaip dinamik

function autoProCar(name,color,price){
  this.name=name;
  this.color=color;
  this.price=price;
  this.drives=new Array("mike","sue");
  if(typeof autoProCar.initialized== "undefined"){
   autoProCar.prototype.getName =function(){
   document.write(this.name+"-----"+this.color+"<br>");
   };
   autoProCar.initialized=true;
  }
}
var car4=new autoProCar("动态原型","yellow","1234565");
car4.getName();
car4.drives.push("newOne");
document.write(car4.drives);

Salin selepas log masuk

Kaedah ini adalah kegemaran saya Semua definisi kelas dilengkapkan dalam fungsi Ia kelihatan seperti definisi kelas dalam bahasa lain Anda juga boleh menggunakan instanceof

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan JavaScript.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan