Khai báo getter/setter trong lớp kế thừa trong Javascript

Question

Tôi quen thuộc với ngôn ngữ OOP được gõ mạnh mẽ như C# và Java, vì vậy tôi hơi bối rối với Javascript. Tôi muốn class tôi để được đóng gói, ví dụ:

function Human() { 
    var _name = ''; 
    var _nameChangeCounter = 0; 
} 

Human.constructor = Human; 
Human.prototype = Object.create(Animal); 

Như bạn thấy, Human mở rộng lớp Animal. Bây giờ tôi cần một getter và setter cho Name, và một getter cho NameChangeCounter. Trong setter của Name, nó sẽ tăng NameChangeCounter. Tôi nhìn lên như thế nào để làm cho getter và setter trong Javascript trong this question:

Name.prototype = { 
    get fullName() { 
     return this.first + " " + this.last; 
    }, 

    set fullName(name) { 
     var names = name.split(" "); 
     this.first = names[0]; 
     this.last = names[1]; 
    } 
}; 

Tuy nhiên, bây giờ nguyên mẫu được thực hiện cho các thừa kế, làm thế nào tôi có thể làm điều đó? Tôi có phải thực hiện kiểu Java (tạo các hàm getName, setName, getNameChangeCounter) không? Các thuộc tính như window.location.href được triển khai như thế nào?

Answer 1

Tìm thấy chức năng này trên MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Summary

Dưới đây là một ví dụ fiddle: http://jsfiddle.net/EfyCX/1/

Và đây là một số javascript cho getter và setter sử dụng Object.defineProperties

Object.defineProperties(Person.prototype, { 
    "name": { 
     get: function() { return this._name }, 
     set: function(name) { 
      this.changeCount++ 
      this._name = name 
     } 
    } 
}) 

Answer 2

này làm việc cho tôi:

function Name(){ 
    this.first = ''; 
    this.last = ''; 
} 

Name.prototype.getFullName = function() { 
    return this.first + ' ' + this.last; 
} 

Name.prototype.setFullName = function(fullName){ 
    var names = fullName.split(" "); 
    this.first = names[0]; 
    this.last = names[1]; 
} 


function Human() { 
    var name = new Name(), 
     counter = 0; 
    Object.defineProperty(this, 'name', { 
     configurable: true, 
     enumerable: true, 
     get: function(){ 
      return name; 
     }, 
     set: function(fullName){ 
      name.setFullName(fullName); 
     } 
    }); 
    Object.defineProperty(this, 'counter', { 
     configurable:true, 
     enumerable: true, 
     get: function(){ 
      return counter; 
     }, 
     set: function(value){ 
      counter = value; 
     } 
    }); 
} 

var luke = new Human(); 
luke.name = 'Luke Skywalker'; 

console.log(luke.name.first); //Luke 
console.log(luke.name.last); //Skywalker 
console.log(luke.name.getFullName()); //Luke Skywalker 
console.log(luke.name); //Object 

luke.name = 'Peter Parker'; 
console.log(luke.name.first); //Peter 
console.log(luke.name.last); //Parker 
console.log(luke.name.getFullName()); //Peter Parker 

Answer 3

Bạn đang cố gắng sử dụng một kế thừa cổ điển trong một ngôn ngữ dựa trên nguyên mẫu. Trong javascript không có định nghĩa Lớp và các thể hiện Lớp. Chỉ có các đối tượng tĩnh, chia sẻ các phương thức thông qua một chuỗi nguyên mẫu.

Để làm cho các đối tượng kế thừa từ động vật:

var Animal = {vertebrae: "jelly"}; 
var Human = Object.create(Animal) 

console.log(Human.vertebrae); //=> jelly 

Để làm cho các đối tượng kế thừa từ Nhân

var programmer = Object.create(Human); 
console.log(programmer.vertebrae); //=> jelly 

Một số cơ quan chức năng JS (chủ yếu là Crockford) ngăn cản trọng tiêu chuẩn nhận được và phương pháp thiết lập, trừ trường hợp bạn hoàn toàn biết mình đang làm gì.

Cũng quan trọng cần lưu ý rằng JS không có các thuộc tính riêng, và chức năng đó có thể đạt được bằng cách sử dụng phạm vi chức năng bên ngoài và đóng. Tìm kiếm các thuộc tính riêng tư javascript.

Để thêm phương pháp để con người

Human._name = 'Human'; 
Human.getName = function(){ return this._name; } 
Human.setName = function(val){ this._name = val; } 

console.log(programmer.getName()); //=> 'Human' 

programmer.setName("Bob"); 
console.log(programmer.getName()); //=> 'Bob' 
console.log(Human.getName()); //=> 'Human' 
console.log(Animal.getName()); //=> not a function 

bạn có thể sử dụng properties object nếu bạn muốn thiết lập các phương pháp khi làm Object.create(), nhưng cú pháp đó là không may tiết.