Teknik apa yang dapat digunakan untuk mendefinisikan kelas dalam JavaScript, dan apa kompromi mereka?


686

Saya lebih suka menggunakan OOP dalam proyek skala besar seperti yang saya kerjakan sekarang. Saya perlu membuat beberapa kelas dalam JavaScript tetapi, jika saya tidak salah, setidaknya ada beberapa cara untuk melakukannya. Apa yang akan menjadi sintaksis dan mengapa itu dilakukan dengan cara itu?

Saya ingin menghindari penggunaan perpustakaan pihak ketiga - setidaknya pada awalnya.
Mencari jawaban lain, saya menemukan artikel Pemrograman Berorientasi Objek dengan JavaScript, Bagian I: Warisan - Doc JavaScript yang membahas pemrograman berorientasi objek dalam JavaScript. Apakah ada cara yang lebih baik untuk melakukan warisan?


catatan: ini adalah duplikat dari stackoverflow.com/questions/355848
Jason S

3
Secara pribadi, saya suka mendeklarasikan anggota kelas di dalam tubuh fungsi. Saya menggunakan teknik 'memperbaiki ini' untuk membuat penutupan untuk membuatnya berperilaku lebih seperti kelas. Saya punya contoh terperinci di blog saya: ncombo.wordpress.com/2012/12/30/…
Jon

Saya porting sebagian besar fungsi C ++ OOP ke JavaScript dengan sintaksis yang sederhana dan alami. Lihat jawaban saya di sini: stackoverflow.com/a/18239463/1115652

Tidak ada kelas dalam JavaScript. Tetapi jika Anda ingin mensimulasikan perilaku yang mirip kelas di JS, Anda bisa. Lihat detail di: symfony-world.blogspot.com/2013/10/…
ducin

Jawaban:


743

Inilah cara untuk melakukannya tanpa menggunakan perpustakaan eksternal:

// Define a class like this
function Person(name, gender){

   // Add object properties like this
   this.name = name;
   this.gender = gender;
}

// Add methods like this.  All Person objects will be able to invoke this
Person.prototype.speak = function(){
    alert("Howdy, my name is" + this.name);
};

// Instantiate new objects with 'new'
var person = new Person("Bob", "M");

// Invoke methods like this
person.speak(); // alerts "Howdy, my name is Bob"

Sekarang jawaban sebenarnya jauh lebih kompleks dari itu. Misalnya, tidak ada yang namanya kelas dalam JavaScript. JavaScript menggunakan prototypeskema pewarisan berbasis.

Selain itu, ada banyak perpustakaan JavaScript populer yang memiliki gaya mereka sendiri yang mendekati fungsionalitas seperti kelas dalam JavaScript. Anda ingin memeriksa setidaknya Prototipe dan jQuery .

Memutuskan yang mana di antara yang terbaik adalah yang terbaik untuk memulai perang suci di Stack Overflow. Jika Anda memulai proyek JavaScript-berat yang lebih besar, itu pasti layak belajar perpustakaan populer dan melakukannya dengan cara mereka. Saya seorang pria Prototipe, tetapi Stack Overflow tampaknya condong ke jQuery.

Sejauh hanya ada "satu cara untuk melakukannya", tanpa ada ketergantungan pada perpustakaan eksternal, cara saya menulis cukup banyak.


48
Tapi itu tidak bekerja seperti bahasa X di mana saya belajar satu cara yang benar bahwa benda yang digunakan untuk membuat instance objek harus bekerja :(
Erik Reppen

2
Menurut developer.mozilla.org/en-US/docs/Web/JavaScript/... properti juga harus ditambahkan ke prototipe ("Person.prototype.name = '';")
DaveD

1
@ Dave - mungkin memang begitu, tapi sepertinya tidak lagi ..?
Kieren Johnstone

6
jQuery bahkan tidak menyediakan cara untuk membuat fungsionalitas seperti kelas ??? (Semua kelas yang dimilikinya adalah kelas CSS) Anda harus menghapusnya dari bagian jawaban itu.
Bergi

7
Dari paruh kedua tahun 2015, standar baru EcmaScript 6 dirilis, jadi saya mengusulkan untuk melakukannya dengan cara baru (lebih bersih dan mudah) es6-features.org/#ClassDefinition
DevWL

213

Cara terbaik untuk mendefinisikan kelas dalam JavaScript adalah dengan tidak mendefinisikan kelas.

Serius.

Ada beberapa rasa yang berbeda dari orientasi objek, beberapa di antaranya adalah:

  • OO berbasis kelas (pertama kali diperkenalkan oleh Smalltalk)
  • OO berbasis prototipe (pertama kali diperkenalkan oleh Self)
  • OO berbasis multimethod (pertama kali diperkenalkan oleh CommonLoops, saya pikir)
  • OO berbasis predikat (tidak tahu)

Dan mungkin orang lain yang saya tidak tahu.

JavaScript mengimplementasikan OO berbasis prototipe. Dalam OO berbasis prototipe, objek baru dibuat dengan menyalin objek lain (bukannya dibuat dari templat kelas) dan metode hidup langsung di objek, bukan di kelas. Warisan dilakukan melalui pendelegasian: jika suatu objek tidak memiliki metode atau properti, objek tersebut dilihat pada prototipe-nya (yaitu objek yang dikloning), maka prototipe prototipe dan sebagainya.

Dengan kata lain: tidak ada kelas.

JavaScript sebenarnya memiliki tweak yang bagus untuk model itu: konstruktor. Anda tidak hanya dapat membuat objek dengan menyalin yang ada, Anda juga dapat membuat mereka "kehabisan udara", sehingga untuk berbicara. Jika Anda memanggil fungsi dengan newkata kunci, fungsi itu menjadi konstruktor dan thiskata kunci tidak akan mengarah ke objek saat ini melainkan ke objek "kosong" yang baru dibuat. Jadi, Anda dapat mengonfigurasi objek dengan cara apa pun yang Anda suka. Dengan cara itu, konstruktor JavaScript dapat mengambil salah satu peran kelas dalam OO berbasis kelas tradisional: berfungsi sebagai templat atau cetak biru untuk objek baru.

Sekarang, JavaScript adalah bahasa yang sangat kuat, sehingga cukup mudah untuk menerapkan sistem OO berbasis kelas dalam JavaScript jika Anda mau. Namun, Anda hanya harus melakukan ini jika Anda benar-benar membutuhkannya dan bukan hanya karena itulah cara Jawa melakukannya.


"Jika Anda memanggil fungsi dengan kata kunci baru, fungsi itu menjadi konstruktor dan kata kunci ini tidak akan mengarah ke objek saat ini tetapi sebaliknya ke" kosong "yang baru dibuat. Jika Anda memanggil suatu fungsi tanpa kata kunci baru, ini akan merujuk pada konteks panggilan, secara default objek global (jendela). Dalam mode ketat, undefined adalah default. panggilan, terapkan, dan ikat mengambil konteks panggilan sebagai parameter pertama. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Elias Hasle

83

Kelas ES2015

Dalam spesifikasi ES2015, Anda dapat menggunakan sintaks kelas yang hanya berupa gula di atas sistem prototipe.

class Person {
  constructor(name) {
    this.name = name;
  }
  toString() {
    return `My name is ${ this.name }.`;
  }
}

class Employee extends Person {
  constructor(name, hours) {
    super(name);
    this.hours = hours;
  }
  toString() {
    return `${ super.toString() } I work ${ this.hours } hours.`;
  }
}

Manfaat

Manfaat utama adalah alat analisis statis lebih mudah untuk menargetkan sintaks ini. Juga lebih mudah bagi orang lain yang berasal dari bahasa berbasis kelas untuk menggunakan bahasa sebagai polyglot.

Peringatan

Berhati-hatilah dengan keterbatasannya saat ini. Untuk mencapai properti pribadi, seseorang harus menggunakan Simbol atau WeakMaps . Dalam rilis mendatang, kelas kemungkinan besar akan diperluas untuk memasukkan fitur-fitur yang hilang ini.

Dukung

Dukungan browser saat ini tidak terlalu bagus (didukung oleh hampir semua orang kecuali IE), tetapi Anda dapat menggunakan fitur ini sekarang dengan transpiler seperti Babel .

Sumber daya


56

Saya lebih suka menggunakan Daniel X. Moore's {SUPER: SYSTEM}. Ini adalah disiplin yang memberikan manfaat seperti variabel instance benar, pewarisan berbasis sifat, hierarki kelas, dan opsi konfigurasi. Contoh di bawah ini mengilustrasikan penggunaan variabel instan yang benar, yang saya percaya adalah keuntungan terbesar. Jika Anda tidak memerlukan variabel instan dan senang dengan hanya variabel publik atau pribadi, maka mungkin ada sistem yang lebih sederhana.

function Person(I) {
  I = I || {};

  Object.reverseMerge(I, {
    name: "McLovin",
    age: 25,
    homeState: "Hawaii"
  });

  return {
    introduce: function() {
      return "Hi I'm " + I.name + " and I'm " + I.age;
    }
  };
}

var fogel = Person({
  age: "old enough"
});
fogel.introduce(); // "Hi I'm McLovin and I'm old enough"

Wow, itu tidak terlalu berguna untuknya sendiri, tetapi lihatlah menambahkan subclass:

function Ninja(I) {
  I = I || {};

  Object.reverseMerge(I, {
    belt: "black"
  });

  // Ninja is a subclass of person
  return Object.extend(Person(I), {
    greetChallenger: function() {
      return "In all my " + I.age + " years as a ninja, I've never met a challenger as worthy as you...";
    }
  });
}

var resig = Ninja({name: "John Resig"});

resig.introduce(); // "Hi I'm John Resig and I'm 25"

Keuntungan lain adalah kemampuan untuk memiliki modul dan warisan berbasis sifat.

// The Bindable module
function Bindable() {

  var eventCallbacks = {};

  return {
    bind: function(event, callback) {
      eventCallbacks[event] = eventCallbacks[event] || [];

      eventCallbacks[event].push(callback);
    },

    trigger: function(event) {
      var callbacks = eventCallbacks[event];

      if(callbacks && callbacks.length) {
        var self = this;
        callbacks.forEach(function(callback) {
          callback(self);
        });
      }
    },
  };
}

Contoh memiliki kelas orang termasuk modul bindable.

function Person(I) {
  I = I || {};

  Object.reverseMerge(I, {
    name: "McLovin",
    age: 25,
    homeState: "Hawaii"
  });

  var self = {
    introduce: function() {
      return "Hi I'm " + I.name + " and I'm " + I.age;
    }
  };

  // Including the Bindable module
  Object.extend(self, Bindable());

  return self;
}

var person = Person();
person.bind("eat", function() {
  alert(person.introduce() + " and I'm eating!");
});

person.trigger("eat"); // Blasts the alert!

Pengungkapan: Saya adalah Daniel X. Moore dan ini adalah milik saya {SUPER: SYSTEM}. Ini adalah cara terbaik untuk mendefinisikan kelas dalam JavaScript.


@DanielXMoore "Variabel instance dibagi di antara instance individual dari sebuah kelas" Itu bukan variabel instance, yaitu variabel statis / kelas.
JAB

2
@ JAB Itu tidak benar, variabel statis / kelas dibagi di antara semua contoh kelas. Setiap instance memiliki variabel instance sendiri.
Daniel X Moore

(Dengan kata lain, dengan menggunakan makna normal dari istilah "variabel instan", apakah variabel itu variabel atau tidak, maka tingkat variabel itu dapat diterima atau tidak).
JAB

2
Anda hampir terdengar seperti pahlawan super karena mengklaim xD terbaik
Dadan

Pendekatan mudah untuk mendefinisikan kelas Javascript menggunakan objek javascript: wapgee.com/story/i/203
Ilyas karim

41
var Animal = function(options) {
    var name = options.name;
    var animal = {};

    animal.getName = function() {
        return name;
    };

    var somePrivateMethod = function() {

    };

    return animal;
};

// usage
var cat = Animal({name: 'tiger'});

Ini adalah cara yang sangat elegan untuk membangun struktur objek yang dapat digunakan tanpa harus mengimpor apa pun. Saya menggunakan sistem kelas Resig, tapi saya mungkin lebih suka ini. Terima kasih.
Tim Scollick

29
Masalah dengan pendekatan ini adalah bahwa setiap kali Anda membuat instance Animal baru itu akan mendefinisikan ulang fungsi daripada hanya mendefinisikannya sekali dengan prototipe.
Justin

33

Berikut ini adalah cara untuk membuat objek dalam javascript, yang telah saya gunakan sejauh ini

Contoh 1:

obj = new Object();
obj.name = 'test';
obj.sayHello = function() {
    console.log('Hello '+ this.name);
}

Contoh 2:

obj = {};
obj.name = 'test';
obj.sayHello = function() {
    console.log('Hello '+ this.name);
}
obj.sayHello();

Contoh 3:

var obj = function(nameParam) {
    this.name = nameParam;
}
obj.prototype.sayHello = function() {
    console.log('Hello '+ this.name);
}

Contoh 4: Manfaat sebenarnya dari Object.create (). silakan lihat [tautan ini]

var Obj = {
    init: function(nameParam) {
        this.name = nameParam;
    },
    sayHello: function() {
        console.log('Hello '+ this.name);
    }
};
var usrObj = Object.create(Obj);  // <== one level of inheritance

usrObj.init('Bob');
usrObj.sayHello();

Contoh 5 (Object.create Crockford yang disesuaikan):

Object.build = function(o) {
   var initArgs = Array.prototype.slice.call(arguments,1)
   function F() {
      if((typeof o.init === 'function') && initArgs.length) {
         o.init.apply(this,initArgs)
      }
   }
   F.prototype = o
   return new F()
}
MY_GLOBAL = {i: 1, nextId: function(){return this.i++}}  // For example

var userB = {
    init: function(nameParam) {
        this.id = MY_GLOBAL.nextId();
        this.name = nameParam;
    },
    sayHello: function() {
        console.log('Hello '+ this.name);
    }
};
var bob = Object.build(userB, 'Bob');  // Different from your code
bob.sayHello();


Untuk terus memperbarui jawaban dengan ES6 / ES2015

Kelas didefinisikan seperti ini:

class Person {
    constructor(strName, numAge) {
        this.name = strName;
        this.age = numAge;
    }

    toString() {
        return '((Class::Person) named ' + this.name + ' & of age ' + this.age + ')';
    }
}

let objPerson = new Person("Bob",33);
console.log(objPerson.toString());

1
@Justin: Tolong beri tahu saya apa yang tidak valid?
Amol M Kulkarni

Saat mempelajari notasi ini, saya juga menemukan ini.set (). Sebagai contoh: this.set ('port', 3000). Dugaan saya adalah, ini digunakan untuk mengatur properti port untuk objek. Jika demikian, mengapa kita tidak langsung menggunakan: {port: 3000}. Apakah ada dokumentasi di mana saya bisa mendapatkan rincian lebih lanjut.
adityah

24

Saya pikir Anda harus membaca Douglas Crockford's Prototypal Inheritance in JavaScript dan Classical Inheritance in JavaScript .

Contoh dari halamannya:

Function.prototype.method = function (name, func) {
    this.prototype[name] = func;
    return this;
};

Efek? Ini akan memungkinkan Anda untuk menambahkan metode dengan cara yang lebih elegan:

function Parenizor(value) {
    this.setValue(value);
}

Parenizor.method('setValue', function (value) {
    this.value = value;
    return this;
});

Saya juga merekomendasikan videonya: Advanced JavaScript .

Anda dapat menemukan lebih banyak video di halamannya: http://javascript.crockford.com/ Dalam buku John Reisig Anda dapat menemukan banyak contoh dari situs web Douglas Crockfor.


25
Apakah hanya saya? Bagaimana sih ini lebih elegan? Saya akan memanggil definisi fungsi dengan 'strings'sebutan yang sebenarnya banyak nama, tetapi elegan bukan salah satunya ...
fgysin mengembalikan Monica

4
@ JAB, tapi refleksi adalah pengecualian, bukan aturannya. Dengan metode di atas, Anda harus mendeklarasikan semua metode Anda dengan string.
Kirk Woll

16

Karena saya tidak akan mengakui rencana pabrik YUI / Crockford dan karena saya suka menjaga segala sesuatunya tetap dan dapat dikembangkan, inilah variasi saya:

function Person(params)
{
  this.name = params.name || defaultnamevalue;
  this.role = params.role || defaultrolevalue;

  if(typeof(this.speak)=='undefined') //guarantees one time prototyping
  {
    Person.prototype.speak = function() {/* do whatever */};
  }
}

var Robert = new Person({name:'Bob'});

di mana idealnya tes typeof dilakukan pada sesuatu seperti metode pertama yang dibuat prototipe


Saya suka itu. Saya paling sering menggunakan sintaks standar JS karena saya tidak suka ide menyalin fungsi ke setiap instance objek. Saya selalu merindukan keindahan solusi mandiri, dan ini menyelesaikannya dengan cukup baik.
Lukasz Korzybski

1
Tidak yakin tetapi saya mengerti bahwa mendefinisikan fungsi prototipe di dalam ruang lingkup (agak sebagai penutup) dari suatu fungsi menghasilkan kebocoran memori karena pengumpul sampah tidak bisa datang ke sana dalam contoh kelas-kelas tersebut.
Sanne

15

Jika Anda ingin yang sederhana, Anda dapat menghindari kata kunci "baru" seluruhnya dan cukup menggunakan metode pabrik. Saya lebih suka ini, kadang-kadang, karena saya suka menggunakan JSON untuk membuat objek.

function getSomeObj(var1, var2){
  var obj = {
     instancevar1: var1,
     instancevar2: var2,
     someMethod: function(param)
     {  
          //stuff; 
     }
  };
  return obj;
}

var myobj = getSomeObj("var1", "var2");
myobj.someMethod("bla");

Tapi saya tidak yakin apa yang terjadi pada kinerja untuk objek besar.


Object.instancevar1 = var1 baris tidak diperlukan, karena objek batin akan memiliki akses ke parameter getSomeObj ().
Triptych

Wow. Itu membuat otak saya sakit tetapi ada keanggunan tertentu untuk itu. Jadi bagian "obj.instancevar1 = var1" adalah awal dari semacam konstruktor, saya kira?
Karim

Baru saja melihat komentar Triptych. Saya melihat. Jadi, Anda bisa melakukan sesuatu seperti "instancevar1: var1" di mana objek batin sedang dipakai.
Karim

Tepat ... ketika Anda menggunakan {} untuk mendefinisikan objek, objek memiliki akses ke variabel yang saat ini dalam cakupan.
Sam

10
Dengan pendekatan ini Anda kehilangan kemampuan untuk mewarisi, dan karena Anda tidak menggunakan obj.prototype.something Anda mendefinisikan fungsi setiap kali Anda menggunakan objek = lebih banyak memori dan lebih lambat.
beberapa

12
var Student = (function () {
    function Student(firstname, lastname) {
        this.firstname = firstname;
        this.lastname = lastname;
        this.fullname = firstname + " " + lastname;
    }

    Student.prototype.sayMyName = function () {
        return this.fullname;
    };

    return Student;
}());

var user = new Student("Jane", "User");
var user_fullname = user.sayMyName();

Itulah cara TypeScript mengkompilasi kelas dengan konstruktor ke JavaScript.


10

Cara sederhananya adalah:

function Foo(a) {
  var that=this;

  function privateMethod() { .. }

  // public methods
  that.add = function(b) {
    return a + b;
  };
  that.avg = function(b) {
    return that.add(b) / 2; // calling another public method
  };
}

var x = new Foo(10);
alert(x.add(2)); // 12
alert(x.avg(20)); // 15

Alasannya thatadalah bahwa itu thisdapat terikat pada sesuatu yang lain jika Anda memberikan metode sebagai pengendali event, sehingga Anda menyimpan nilai selama instantiasi dan menggunakannya nanti.

Sunting: ini jelas bukan cara terbaik, hanya cara sederhana. Saya juga menunggu jawaban yang bagus!


1
Yang = konstruksi ini tidak diperlukan di sini. Juga, metode add () dan avg () akan disalin untuk setiap "instance" kelas Foo, daripada dibagi di antara mereka.
Triptych

1
Apakah perlu (agak) dalam kasus itu, tetapi bukan kasus sederhana yang Anda berikan.
Triptych

9

Anda mungkin ingin membuat jenis dengan menggunakan Pola Lipat:

    // Here is the constructor section.
    var myType = function () {
        var N = {}, // Enclosed (private) members are here.
            X = this; // Exposed (public) members are here.

        (function ENCLOSED_FIELDS() {
            N.toggle = false;
            N.text = '';
        }());

        (function EXPOSED_FIELDS() {
            X.count = 0;
            X.numbers = [1, 2, 3];
        }());

        // The properties below have access to the enclosed fields.
        // Careful with functions exposed within the closure of the
        // constructor, each new instance will have it's own copy.
        (function EXPOSED_PROPERTIES_WITHIN_CONSTRUCTOR() {
            Object.defineProperty(X, 'toggle', {
                get: function () {
                    var before = N.toggle;
                    N.toggle = !N.toggle;
                    return before;
                }
            });

            Object.defineProperty(X, 'text', {
                get: function () {
                    return N.text;
                },
                set: function (value) {
                    N.text = value;
                }
            });
        }());
    };

    // Here is the prototype section.
    (function PROTOTYPE() {
        var P = myType.prototype;

        (function EXPOSED_PROPERTIES_WITHIN_PROTOTYPE() {
            Object.defineProperty(P, 'numberLength', {
                get: function () {
                    return this.numbers.length;
                }
            });
        }());

        (function EXPOSED_METHODS() {
            P.incrementNumbersByCount = function () {
                var i;
                for (i = 0; i < this.numbers.length; i++) {
                    this.numbers[i] += this.count;
                }
            };
            P.tweak = function () {
                if (this.toggle) {
                    this.count++;
                }
                this.text = 'tweaked';
            };
        }());
    }());

Kode itu akan memberi Anda jenis yang disebut myType . Ini akan memiliki bidang pribadi internal yang disebut toggle dan teks . Ini juga akan memiliki anggota yang terpapar ini: bidang menghitung dan angka ; toggle properti , teks dan numberLength ; metode incrementNumbersByCount dan tweak .

Pola Lipat sepenuhnya rinci di sini: Pola Lipat Javascript


3

Kode golf untuk jawaban @ liammclennan .

var Animal = function (args) {
  return {
    name: args.name,

    getName: function () {
      return this.name; // member access
    },

    callGetName: function () {
      return this.getName(); // method call
    }
  };
};

var cat = Animal({ name: 'tiger' });
console.log(cat.callGetName());


2

Mootools (Alat Berorientasi Objek Saya) berpusat pada gagasan kelas . Anda bahkan dapat memperluas dan menerapkan dengan warisan.

Ketika dikuasai, itu membuat javascript yang kuat dan dapat digunakan kembali.


2

Kelas Berbasis Objek dengan Warisan

var baseObject = 
{
     // Replication / Constructor function
     new : function(){
         return Object.create(this);   
     },

    aProperty : null,
    aMethod : function(param){
      alert("Heres your " + param + "!");
    },
}


newObject = baseObject.new();
newObject.aProperty = "Hello";

anotherObject = Object.create(baseObject); 
anotherObject.aProperty = "There";

console.log(newObject.aProperty) // "Hello"
console.log(anotherObject.aProperty) // "There"
console.log(baseObject.aProperty) // null

Sederhana, manis, dan sudah selesai.


1

Basis

function Base(kind) {
    this.kind = kind;
}

Kelas

// Shared var
var _greeting;

(function _init() {
    Class.prototype = new Base();
    Class.prototype.constructor = Class;
    Class.prototype.log = function() { _log.apply(this, arguments); }
    _greeting = "Good afternoon!";
})();

function Class(name, kind) {
    Base.call(this, kind);
    this.name = name;
}

// Shared function
function _log() {
    console.log(_greeting + " Me name is " + this.name + " and I'm a " + this.kind);
}

Tindakan

var c = new Class("Joe", "Object");
c.log(); // "Good afternoon! Me name is Joe and I'm a Object"

1

Berdasarkan contoh dari Triptych, ini bahkan mungkin lebih sederhana:

    // Define a class and instantiate it
    var ThePerson = new function Person(name, gender) {
        // Add class data members
        this.name = name;
        this.gender = gender;
        // Add class methods
        this.hello = function () { alert('Hello, this is ' + this.name); }
    }("Bob", "M"); // this instantiates the 'new' object

    // Use the object
    ThePerson.hello(); // alerts "Hello, this is Bob"

Ini hanya membuat instance objek tunggal, tetapi masih berguna jika Anda ingin merangkum sekelompok nama untuk variabel dan metode dalam kelas. Biasanya tidak akan ada argumen "Bob, M" untuk konstruktor, misalnya jika metode akan panggilan ke sistem dengan data sendiri, seperti database atau jaringan.

Saya masih terlalu baru dengan JS untuk melihat mengapa ini tidak menggunakan prototypehal itu.


0

JavaScript berorientasi objek , tetapi secara radikal berbeda dari bahasa OOP lainnya seperti Java, C # atau C ++. Jangan mencoba memahaminya seperti itu. Buang pengetahuan lama itu dan mulai lagi. JavaScript membutuhkan pemikiran yang berbeda.

Saya sarankan untuk mendapatkan manual yang bagus atau sesuatu tentang masalah itu. Saya sendiri menemukan Tutorial ExtJS yang terbaik untuk saya, meskipun saya belum pernah menggunakan framework sebelum atau setelah membacanya. Tapi itu memang memberikan penjelasan yang baik tentang apa yang ada di dunia JavaScript. Maaf, sepertinya konten tersebut telah dihapus. Berikut adalah tautan ke salinan archive.org . Bekerja hari ini. : P


2
Berorientasi pada objek? Saya pikir itu fungsional .
Peter Mortensen

Tautan "Tutorial ExtJS" rusak.
Peter Mortensen

Saya pikir akan lebih jelas untuk menjelaskan bahwa fungsi dalam javascript adalah objek, dan aturan braket-lingkup javascript membuat setiap blok fungsi mengenkapsulasi.
mibbit

-1

//new way using this and new
function Persons(name) {
  this.name = name;
  this.greeting = function() {
    alert('Hi! I\'m ' + this.name + '.');
  };
}

var gee=new Persons("gee");
gee.greeting();

var gray=new Persons("gray");
gray.greeting();

//old way
function createPerson(name){
 var obj={};
 obj.name=name;
 obj.greeting = function(){
 console.log("hello I am"+obj.name);
 }; 
  return obj;
}

var gita=createPerson('Gita');
gita.greeting();

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.