javascript ES5 物件導向的學習總結

m53469發表於2021-09-09
  1. 建構函式
    建構函式直觀上講,目的似乎應該是構造一個物件。在JavaScript中,當使用new() 運算子時呼叫的那個函式就是建構函式。建構函式的目的,是用合理的預設值來初始化新建立的物件。比較好的方法是,僅僅把那些所有例項都需要的屬性和方法,定義到建構函式中去。
var Car = function(){
    this.running = false;
    this.start = function(){
        return this.running = true;
    }
}
var tesla = new Car();
console.log(tesla.running);
console.log(tesla.start());

不是所有的內建函式都能在不使用 new 運算子的情況下呼叫。通常這是因為內建物件沒有合理的預設值可以返回。呼叫 Date() 函式會返回一個代表當前日期時間的字串,但呼叫 Math() 函式會返回一個錯誤。

2 例項屬性
例項屬性是公開的可訪問的變數,用來描述物件例項的特徵。
例項屬性可以被定義在建構函式中,或者單獨被定義成原型物件的一部分。

var Car = function(wheelCount){
    this.wheels = wheelCount || 4
}
Car.prototype.odometer = 0;
var tesla = new Car();
console.log(tesla.wheels);
console.log(tesla.odometer);

3.例項方法
例項方法給物件例項提供了一些有用的功能,並且可以訪問例項的屬性。
兩種方式定義:透過引用 this 關鍵字來擴充套件例項,或者直接在原型鏈上設定屬性。

var Car = function(){
    this.running = false;
    this.start = function(){
        return this.running = true;
    }
}
Car.prototype.stop = function(){
    return .this.running = false;
}
var tesla = new Car();
console.log(tesla.running);
console.log(tesla.start());
console.log(tesla.stop());
// 或者
function Person(name,age,job){
    this.name = name;
    this.age =age;
    this.job = job;
    this.sayName = sayName;
}
function sayName(){
    alert(this.name);
}
var person1 = new Person('jack',23,'software engineer');
var person2 = new Person('mark',44,'doctor');
// 不推薦以上做法,推薦 將例項屬性和例項方法 掛載在於 原型 prototype 上

4.類屬性
類屬性是屬於類物件自己的一些變數。
它們一般用於不會改變的屬性,例如常量。核心 Math 物件有一個類屬性PI。
類屬性可以直接在建構函式中設定。

var Cake = function(){}
Cake.isLie = true;
或者
function Cake(){}
Cake.isLie = false;

5.類方法
類方法,有時被稱為靜態方法,是僅僅對類對身可用的函式。
類方法,可以訪問類屬性,但不能訪問物件例項的屬性。
類方法典型的用途,是對傳入引數計算後返回一個結果。
類方法和類屬性用同樣的方法來定義。
如果你想要給內建的 String 物件新增一個 reverse 類方法

String.reverse = function(s){
    return s.split("").reverse().join("");
}
console.log(String.reverse("egassem terces"));

6.私有變數

var Car = function(){
    var price = 33;
    this.getPrice = function(){
        return price;
    }    
    this.setPrice = function(price){
        price = price;
    }
}

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2819/viewspace-2798718/,如需轉載,請註明出處,否則將追究法律責任。

相關文章