學習javaScript必知必會(6)~類、類的定義、prototype 原型、json對象

一、定義類：使用的是funciton，因為在js中沒有定義類的class語句，只有function.

■ 舉例：

//定義一個Person類（通過類的無參構造函數定義類）
function Person(){}
var p = new Person();
p.name = '小明';
p.age = 12;

二、類的種類（系統類、自定義類）

（1）常見的系統類 String、Date、Math

1）String 類，字面量 '' 舉例： var str = 'abc';

✿ 補充：
'' 字元串
[] 數組
{} 對象
// 正則表達式

① length
② indexOf(string) 取得參數在字元串中出現的位置
③ substr(num1, num2) 截取字元串
④ toLowerCase()
⑤ toUpperCase()
⑥ replace(str1, str2) 字元串替換

2）Date 日期類

① getYear() getFullYear() getMonth() getDay()
② getDate()
③ getHours() getMinutes() getSeconds() getMilliseconds()

3) Math 數學類

① ceil(數值) floor(數值)
② min(數值1, 數值2) max(數值1, 數值2)
③ pow(數值1, 數值2)
④ random() 隨機數
⑤ round(數值) 四捨五入
⑥ sqrt(數值) 開平方根

❀（2）自定義類【在js中沒有定義類的語句class，是通過類的構造函數定義類的】：

❀ 1）語法：

function 類名() { //在js中沒有定義類的語句class，是通過類的無參構造函數定義類

}

var 對象變數 = new 類名();

❀ 2）關於對象屬性的使用：

對象.屬性
對象['屬性']

❀ 3）對象的屬性是動態添加的，對象屬性可以使用 . 或者 [''] 形式表示出來（對象的屬性可以是任意數據類型）

//定義一個Person類（Person類的無參構造函數）
function Person(){}
var p = new Person();
p.name = '小明';
p['age'] = 12;

❀ 4）定義類通過類的有參構造函數：

■ 舉例：

//定義一個Person類（Person類的有參構造函數）
function Person(name, age, hobby){
    this.name = name;
    this.age = age;
    this.hobby = hobby;
}

var p = new Person('小明', 12, '遊戲');

5）for…in 遍歷對象的屬性：

■ 舉例：

//定義一個Person類（Person類的有參構造函數）
function Person(name, age, hobby){
    this.name = name;
    this.age = age;
    this.hobby = hobby;
}

var p = new Person('小明', 12, '遊戲');
for(var i in p){
    document.write(i + ':' + p[i] + '<br/>');
}

6）關鍵字 constructor、typeof、instanceof、delete

constructor：對象.constructor 返回對象的構造器
typeof： typeof 對象返回對象的數據類型
instanceof：對象 instanceof 類判斷對象是否是某個類的實例
delete： delete 對象.屬性刪除對象的屬性

三、prototype 原型（返回對象類型(類)原型的引用）

1、格式：class.prototype //獲取類原型的引用

■ 舉例：

//定義一個Person類
function Person(name, age) {
    this.name = name;
    this.age = age;
}
//獲取類的原型Person.prototype, 並且給類添加屬性nationlity
Person.prototype.nationality = "English";
//獲取類的原型Person.prototype, 並且給類添加方法屬性say
Person.prototype.say = function () {
    console.log('say hello');
};
//創建Person類的實例
var p = new Person("John", 50);
console.log(p.nationality);
p.say();

✿ 2、區分實例屬性和靜態屬性：

**例如：定義了一個Person類，區分Person.prototype. nationality 和 Person. nationality **:
■ Person.prototype. nationality: 是指為Person類下的實例添加屬性nationality
■ Person. nationality：是指為Person類添加靜態屬性nationality

3、prototype 原理：

□ js在載入每個構造器時，會創建對應的原型對象；
□ 在構造器對象內部有一個prototype屬性用來指向原型對象；
□ 在原型對象內部是有一個constructor屬性用來指向構造器；
□ 一般實例化對象後，對象的屬性是先在構造器中查找，找不到就到原型對象中找

4、為什麼說Object是所有類的父類：

當系統為某個類構造器創建原型對象時，類名.prototype = new Object()
//即類的原型是Object的一個實例，原型對象擁有Object的所有屬性，
所以說Object是所有類的父類

四、原型鏈

五、json 對象

1、語法：{屬性名：屬性值，屬性名：屬性值，屬性名：屬性值……}

✿ 鍵值對的集合，即json對象

2、定義對象的屬性語法：

//定義一個json對象
var p1 = {name:'小明', age:12, sex:'女'}; //對象的屬性可以不加單引號，不叫雙引號
var p2 = {'name':'小明', 'age':12, 'sex':'女'};//對象的屬性可以加單引號
var p3 = {"name":'小明', "age":12, "sex":'女'};//對象的屬性可以加雙引號

□ json對象是Object類下的一個對象

3、創建對象有兩種方式（使用構造器的方式和使用json { } 的方式），有什麼區別？

■ json 創建對象省略了構造器的定義（程式只需要定義一個對象時）
■ 構造器可以簡化屬性的定義（程式需要定義多個相同的屬性或方法的對象）

Tags: 類、類的定義、prototype 原型、json對象