Beranda>Tutorial Desain Web>Standardisasi WEB

Diskusi Objek JavaScript

Penulis：Eve Cole Waktu Pembaruan：2009-12-12 13:57:32

Karena fleksibilitas JavaScript, setiap orang dapat menulis kode sesuai dengan kebiasaannya masing-masing. Ada metode pemrograman fungsional, dan ada juga literal objek yang banyak digunakan saat ini. Karena munculnya pemrograman fungsional berorientasi objek yang hanya dimiliki JavaScript dimulai juga secara bertahap Berkembang menjadi pemrograman kelas. Sekarang saya akan menjelaskan secara singkat beberapa kebiasaan pemrograman yang sudah dikenal:

1. Objek literal:

Berikut isi kutipannya:

var orang = {
nama: nol,
setNama:fungsi(nama){
ini.nama = nama;
kembalikan nama ini;
},
dapatkanNama:fungsi(){
alert(ini.nama);
}
}

Sebuah metode pemrograman dengan karakteristik JavaScript. Ini berisi nama atribut, metode setName dan getName dalam unit kelas. Relatif mudah untuk memanggil metode person.setname('R'). atribut dan metode seseorang semuanya Bukan pribadi, bisa disebut.

2.Mode pemanggilan konstruktor prototipe

Berikut isi kutipannya:

var Orang = fungsi(){
ini.nama = null;
}
Orang.prototipe.setName = fungsi(nama){
ini.nama = nama;
}
Orang.prototipe.getName = function(){
alert(ini.nama);
}


Ini juga merupakan metode pemrograman yang sangat umum untuk membuat kelas Person, dan kemudian menggunakan prototipe untuk memperluas kelas dan menambahkan metode. Perbedaan terbesar dari literal objek adalah ketika memanggil metode kelas ini, Anda harus menggunakan yang baru (mirip dengan Java memanggil kelas). var p = new Person();p.getName(); Jika Anda membuatnya secara langsung tanpa menggunakan new, kesalahan ini tidak akan dilaporkan dan sulit ditemukan berasal dari ini menunjuk ke Person.prototypel, dan Person tidak memiliki metode setName.

3. Gunakan fungsi anonim untuk pemrograman fungsional

Berikut isi kutipannya:

(fungsi(){
nama var;

var setNama = fungsi(n){
nama = n;
}
jendela['orang']['setName'] = setName;

var getName = fungsi(){
peringatan(nama);
}
jendela['orang']['getName'] = getName;
})()

Salah satu manfaat terbesar dari kemunculan kelas adalah mengurangi kemunculan variabel global. Namun jika Anda masih terbiasa dengan pemrograman fungsional, tidak masalah selama Anda membuat fungsi anonim dan melakukan penutupan, Anda bisa melakukan pemrograman fungsional di dalamnya. Tidak perlu khawatir dengan kemunculan variabel global. Seperti yang Anda lihat di atas, nama var tidak dapat dipanggil di luar fungsi anonim. Kemudian gunakan variabel eksternal untuk memanggil fungsi atau variabel internal membuat variabel pribadi dan metode pribadi.

4. Pemrograman kelas (saya tidak tahu harus menyebutnya apa)

Berikut isi kutipannya:

var orang = fungsi(){
var nama = nol;
kembali{
setNama:fungsi(n){
nama = n;
},
dapatkanNama:fungsi(){
peringatan(nama);
}
}
}

Ini sangat mirip dengan literal objek, hanya saja ini dikesampingkan, dan metode serta properti dapat dijadikan pribadi. Memanggil metode pada dasarnya sama dengan literal objek.

5. Rantai metode

Berikut isi kutipannya:

var Orang = fungsi(){
ini.nama = null;
}
Orang.prototipe = {
setNama:fungsi(nama){
ini.nama = nama;
kembalikan ini;
},
dapatkanNama:fungsi(){
alert(ini.nama);
kembalikan ini;
}
}

jQuery adalah pustaka metode chaining yang paling klasik. Jika Anda masih belum memahami apa itu metode chaining, lihat contoh ini:

Berikut isi kutipannya:

var p = Orang baru();
p.setName('Tom').getName().setName('Ray').getName();


Karena setiap metode diakhiri dengan return this; kelas berantai metode dibuat.

Ini adalah metode yang lebih saya kenal. Setiap orang memiliki karakteristiknya masing-masing, jadi ada banyak metode yang tidak ada habisnya, namun saya ingin mendalami masalah berikut:

1. Tentang penunjuk ini

Ini digunakan saat membuat beberapa kategori, tapi apa sebenarnya perannya? Ini memainkan peran besar dalam penggunaan kembali dan pewarisan.
Pertama buat kelas Person:

Berikut isi kutipannya:

var Orang = fungsi(){
ini.nama = null;
}
Orang.prototipe.setName = fungsi(nama){
ini.nama = nama;
}
Orang.prototipe.getName = function(){
alert(ini.nama);
}
Orang.prototipe.getAge = function(){
var umur = ini.usia ||.'';
peringatan (usia);
}

Kemudian buat kelas Children dan integrasikan semua metode dan properti Person:

Berikut isi kutipannya:

var Anak = fungsi(umur){
ini.nama = null;
this.usia = usia;
}
Children.prototype = new Person(); //Mewarisi properti dan metode Person
Children.prototype.ageJudge = function(){ //Tambahkan juga metode baru untuk Anak-anak
if(usia ini > 18){
waspada('dewasa~');
} kalau tidak {
alert('Dibawah 18 tahun~');
}
}
Children.prototype.getName = function(){ //Ganti metode getName
var tentang = ini.nama + ' ' + ini.umur;
peringatan (tentang);
}
var tom = Anak baru(12);
var usia = tom.getAge(); //12
var judge = tom.ageJudge(); //Di bawah 18 tahun~
var setN = tom.setName('Tom');
var dapatkan = tom.getName(); //Tom 12

Ini adalah warisan, dan kemudian kita melihat penggunaan kembali fungsi sederhana:

Berikut isi kutipannya:

var SetWarna = fungsi(){
this.style.backgroundColor = '#000'; //ini menunjuk ke jendela
}
document.body.onclick = SetColor; //Ini menunjuk ke isi saat ini
documnet.getElementById('color').onmouseout = SetColor; //ini menunjuk ke documnet.getElementById('color')

Setelah melihat fungsinya, saya pasti punya pemahaman baru tentang ini. Sekarang saya punya pertanyaan, apakah ini harus digunakan atau tidak.

var setWarna = {
init:fungsi(obj){
this.obj = obj; //ini menunjuk ke setColor
this.obj.onclick = ini.warna;
},
warna:fungsi(){
this.style.backgroundColor = '#000'; //ini menunjuk ke objek
}
}

Dalam satu kelas saja, ini menunjuk pada dua tempat yang terkadang membuat orang bingung. Orang yang baru belajar akan bingung dengan ini dan sedikit mengubah cara penulisan kodenya:

Berikut isi kutipannya:

var setWarna = {
init:fungsi(obj){
setColor.obj = obj;
setColor.obj.onclick = setColor.color;
},
warna:fungsi(){
this.style.backgroundColor = '#000'; //Ini dapat memfasilitasi penggunaan kembali metode
}
}

Dengan cara ini, kodenya bisa lebih jelas. Oleh karena itu, saat menulis kode, Anda harus mempertimbangkan penggunaannya di masa mendatang dan apakah kode tersebut dapat digunakan kembali. Jika sudah jelas bahwa pewarisan atau penggunaan kembali tidak boleh dilakukan, menurut saya pribadi Anda harus melakukannya hindari menggunakan ini sebisa mungkin. Ada masalah lain yang lebih umum adalah sebagai berikut:

Berikut isi kutipannya:

var Orang = fungsi(){
ini.nama = null;
}
Orang.prototipe.setName = fungsi(nama){
ini.nama = nama;
}
Person.setName('tom'); //Cara yang salah: ini dalam metode setName akan menunjuk ke Person.prototypel, Person tidak memiliki metode setName

Seperti disebutkan sebelumnya, jika tidak ditulis sebagai var p = new Person();p.setName('tom'); this di kelas ini akan mengarah langsung ke Person.prototypel kesalahan akan dilaporkan. Terkadang akan menyebabkan sakit kepala. Jadi saat menulis kode, saya selalu memilih ini dengan hati-hati.

2. Enkapsulasi kelas

Di Java, metode atau properti suatu kelas dapat disetel sebagai pribadi, untuk menghindari panggilan eksternal, tetapi JavaScript tidak memiliki pengaturan seperti itu. Lihatlah kode berikut:

Berikut isi kutipannya:

var orang = {
nama: nol,
init:fungsi(nama){
this.setName(nama);
},
setNama:fungsi(nama){
ini.nama = nama;
kembalikan nama ini;
}
}
orang.init('tom'); //tom

Di kelas ini total ada 2 metode yaitu init dan setName, dan kita hanya ingin menjalankan setName dari init, atau berbagai metode yang akan ditambahkan di kemudian hari, dan tidak ingin muncul:

orang.setName('tom'); //tom

Panggil metode setName secara langsung. Tepatnya, Anda ingin metode setName menjadi pribadi, dan atribut name menjadi pribadi. Ini mencegah pemrogram lain memanggil metode yang tidak ingin Anda panggil saat menggunakan kelas Anda.
Jadi bagaimana kita merangkum kelas dengan baik? Coba metode pemrograman lain dan lihat bagaimana versi revisinya:

Berikut isi kutipannya:

var orang = fungsi(){
var nama = nol;
var setNama = fungsi(n){
nama = n;
nama kembali;
}
kembali{
init:fungsi(n){
setNama(n);
}
}
}

Dengan cara ini, metode dan properti yang semula dimaksudkan untuk diprivatisasi dapat diprivatisasi dan tidak dapat dipanggil langsung dari luar. Hal ini juga dicapai dengan menggunakan penutupan. Akan sangat sulit untuk melihat kode semacam ini, dan juga akan memakan lebih banyak memori daripada kode biasa.
Oke, itu saja untuk saat ini. Saya akan membicarakan tentang penutupan dan cakupannya lain kali saya punya waktu.

Artikel Terkait