1. 程式人生 > >JavaScript 面向物件基礎

JavaScript 面向物件基礎

要掌握好 JavaScript,首先一點是必須摒棄一些其他高階語言如 Java、C# 等類式面向物件思維的干擾,全面地從函式式語言的角度理解 JavaScript 原型式面向物件的特點。
JavaScript 語言是通過一種叫做 原型(prototype)的方式來實現面向物件程式設計的

認識面向物件

1、面向物件中的概念:
(1):一切事物皆物件
(2):物件具有封裝和繼承特性
(3):物件與物件之間使用訊息通訊,各自存在資訊隱藏

最基本的面向物件

字面式宣告(literal notation)

var person={
    name:"miao",
    age:20
, eat:function () { alert("能吃") } } alert(person.name);

函式構造器構造物件

每個構造器(constructor)實際上是一個 函式(function) 物件, 該函式物件含有一個“prototype”屬性用於實現 基於原型的繼承(prototype-based inheritance)和 共享屬性(shared properties)。物件可以由“new 關鍵字 + 構造器呼叫”的方式來建立。

Java和JavaScript這兩門語言的 new含義毫無關係,因為其物件構造的機理完全不同。JS 這裡僅僅是借用了關鍵字 new,僅此而已;換句話說, 完全可以用其它 非new

表示式來用呼叫構造器建立物件。

function Peroson() {

}
Peroson.prototype={
    name:"miao",
    age:20,
    eat:function () {
        alert("能吃")
    }
}
var p = new Peroson();
p.name
p.age
p.eat();

深入JavaScript面向物件

//資訊封裝
(function () {
    var n = "ime";
    function People(name) {
        this._name = name;
    }
    People.prototype.say = function
() {
alert("peo-hello"+this._name); } window.People = People;//提供一個外部介面 }()); (function () { function Student(name) { this._name = name; } Student.prototype = new People(); //Student繼承People var superSay = Student.prototype.say; Student.prototype.say = function () { superSay.call(this); alert("stu_hello"+this._name); } window.Student = Student; }()); var s = new Student("miao"); s.say();
(function () {
    var n = "ime";
    function Person(name) {
        var _this = { }
        _this._name = name;
        _this.sayHello = function () {
            alert("p-hello"+_this._name+n);
        }
        return _this;
    }
    window.Person = Person;
}());
function Teacher(name) {
    var _this = Person(name);
    var superSay = _this.sayHello;
    _this.sayHello = function () {
        superSay.call(_this);
        alert("t-hello" + _this._name);
    }
    return _this;
}
 var t = Teacher("miao");
t.sayHello();

參考文獻

全面理解面向物件的 JavaScript