Pemrograman Berorientasi Objek (OOP) adalah paradigma pemrograman dan juga metode pengembangan program. Objek mengacu pada contoh kelas. Ini menggunakan objek sebagai unit dasar program, merangkum program dan data di dalamnya untuk meningkatkan penggunaan kembali, fleksibilitas, dan skalabilitas perangkat lunak. - Wikipedia
Umumnya, berorientasi objek meliputi: warisan, enkapsulasi, polimorfisme, abstraksi
Warisan bentuk objek
Salinan lampu
var person = {name: 'allin', usia: 18, alamat: {home: 'home', Office: 'Office',} sclools: ['x', 'z'],}; var programer = {bahasa: 'js',}; fungsi perluasan (p, c) {var c = c | {}; untuk (var prop di p) {c [prop] = p [prop]; }} extension (orang, program); programer.name; // allInprogramer.address.home; // homeprogramer.address.home = 'house'; //houseperson.address.home; // rumahDari hasil di atas, cacat salinan dangkal adalah bahwa memodifikasi nilai jenis referensi dalam objek anak akan mempengaruhi nilai dalam objek induk, karena dalam salinan dangkal jenis referensi hanya menyalin alamat dan menunjuk ke salinan yang sama dalam memori.
Salinan yang dalam
Fungsi ExtentDeeply (p, c) {var c = c || {}; untuk (var prop di p) {if (typeof p [prop] === "objek") {c [prop] = (p [prop] .constructor === array)? []: {}; ExtandingDeeply (p [prop], c [prop]); } else {c [prop] = p [prop]; }}}Gunakan rekursi untuk penyalinan mendalam, sehingga modifikasi sub-objek tidak akan mempengaruhi objek induk.
ExtlateDeeply (orang, programer); Programer.address.home = 'allin'; person.address.home; // Home menggunakan panggilan dan berlaku untuk warisan fungsi parent () {this.name = "abc"; this.address = {home: "home"};} function child () {parent.call (ini); this.banguage = "js"; } Object.create () di ES5 var p = {name: 'allin'}; var obj = objek.create (o); obj.name; // allinObject.create () sebagai alternatif untuk operator baru hanya dirilis setelah ES5. Kita juga dapat mensimulasikan metode ini sendiri:
// Simulasikan objek.Create () Fungsi metode myCreate (o) {function f () {}; F.prototype = o; o = f () baru; return o;} var p = {name: 'allin'}; var obj = myCreate (o); obj.name; // allinSaat ini, versi terbaru dari browser utama (termasuk IE9) telah menggunakan metode ini. Jika Anda menemukan browser lama, Anda dapat menggunakan kode berikut untuk menggunakannya sendiri.
if (! Object.create) {object.create = function (o) {function f () {} f.prototype = o; mengembalikan f baru (); }; }Warisan kelas
Object.Create () Function Person (Name, Usia) {} Person.Prototype.HeadCount = 1; person.prototype.eat = function () {console.log ('Eating ...');} Fungsi Programmer (nama, usia, judul) {} programmer.prototype = object.create (orang.protype); // Buat Programmer Hubungan Warisan.Prototype.Constructor = Programmer; // Ubah penunjuk konstruktorHubungi Metode Kelas Orangtua
function person (name, use) {this.name = name; this.age = usia;} person.prototype.headcount = 1; person.prototype.eat = function () {console.log ('Eating ...');} Fungsi programmer (nama, usia, judul) {person.Apply (ini, argumen); // Panggil konstruktor kelas induk} programmer.prototype = object.create (person.prototype); Programmer.prototype.constructor = Programmer; Programmer.Prototype.Language = "js"; Programmer.prototype.work = function () {konsol.log ('i am working code in'+ this. Orang.prototype.eat.Apply (ini, argumen); // Panggil metode pada kelas induk}Kemasan
Namespace
JS tidak memiliki namespace, sehingga dapat disimulasikan dengan objek.
var app = {}; // aplikasi namespace // modul 1app.module1 = {name: 'allin', f: function () {console.log ('hi robot'); }}; app.module1.name; // "allin" app.module1.f (); // hai robotAnggota statis
function person (name) {var usia = 100; this.name = name;} // statis anggota person.walk = function () {console.log ('static');}; person.walk (); // statisPribadi dan publik
function person (id) {// Properti dan metode pribadi var name = 'allin'; var work = function () {console.log (this.id); }; // properti dan metode publik this.id = id; this.say = function () {console.log ('Say Hello'); work.call (ini); };}; var p1 = orang baru (123); p1.name; // undefinedp1.id; // 123p1.say (); // Say Hello 123Modular
var modulea; modulea = function () {var prop = 1; fungsi func () {} return {func: func, prop: prop};} (); // Jalankan fungsi anonim segeraProp, func tidak akan bocor ke ruang lingkup global. Atau cara menulis lain, gunakan yang baru
modulea = fungsi baru () {var prop = 1; fungsi func () {} this.func = func; this.prop = prop;}Polimorfik
Muat ulang metode simulasi
Atribut argumen dapat memperoleh jumlah parameter aktual dari panggilan fungsi, dan dapat menggunakannya untuk mensimulasikan kelebihan metode.
fungsi demo (a, b) {console.log (demo.length); // Dapatkan jumlah parameter formal Console.log (argumen.length); // Dapatkan jumlah parameter aktual konsol.log (argumen [0]); // parameter aktual pertama 4 console.log (argumen [1]); // parameter aktual kedua 5} demo (4, 5, 6); // Implementasikan penambahan fungsi parameter aktual panjang variabel add () {var total = 0; untuk (var i = argumen.length-1; i> = 0; i-) {total += argumen [i]; } return total;} console.log (add (1)); // Implementasikan penambahan fungsi parameter aktual panjang variabel add () {var total = 0; untuk (var i = argumen.length-1; i> = 0; i-) {total += argumen [i]; } return total;} console.log (add (1)); // 1console.log (add (1, 2, 3)); // 7 // dalam hal fungsi parameter yang berbeda fontSize () {var ele = document.getElementById ('js'); if (arguments.length == 0) {return ele.style.fontsize; } else {ele.style.fontsize = argumen [0]; }} fontSize (18); console.log (fontSize ()); // dalam hal berbagai jenis pengaturan fungsi () {var ele = document.getElementById ('js'); if (typeof argumen [0] === "objek") {for (var p dalam argumen [0]) {ele.style [p] = argumen [0] [p]; }} else {ele.style.fontsize = argumen [0]; ele.style.backgroundcolor = argumen [1]; }} pengaturan (18, 'merah'); pengaturan ({fontsize: 20, latar belakangcolor: 'green'});Metode menulis ulang
fungsi f () {} var f = baru f (); f.prototype.run = function () {console.log ('f');} f.run (); // ff.run = function () {console.log ('fff');} f.run (); // fffKelas abstrak
Lempar kesalahan baru (''); dalam konstruktor melempar pengecualian. Ini mencegah kelas ini dipanggil secara langsung.
function detectorBase () {throw new error ('Kelas abstrak tidak dapat dipanggil secara langsung!');} detectorbase.prototype.detect = function () {console.log ('Deteksi Mulai ...');}; detectorbase.prototype.stop = function () {konsol.log ('detectore.'); detectore; function {) {console.log ('stop. throw new Error('Error');};// var d = new DetectorBase();// Uncaught Error: Abstract class can not be invoked directly!function LinkDetector() {}LinkDetector.prototype = Object.create(DetectorBase.prototype);LinkDetector.prototype.constructor = LinkDetector;var l = new LinkDetector();console.log(l); // LinkDetector {} __ Proto__: LinkDetectorl.Detect (); // Deteksi Mulai ... l.init (); // Kesalahan Tak Terbang: Kesalahan