1. 程式人生 > >JavaScript基礎學習第六天

JavaScript基礎學習第六天

目標:
能夠使用物件的方式處理資料


☞ 程式碼預解析:

1. 變數提升 :當程式中遇到定義變數後,就會將該變數的定義提升到當前作用域的開始位置,不包括變數的賦值

2. 函式提升:當程式中遇到函式的宣告時,那麼會將函式的宣告提升到當前作用域的開始位置,不包括函式的呼叫

 

☞ 物件: 指的是一個具體的事物(人,物品),在程式中物件其實就是對現實生活中具體事物的一個抽象描述。

物件本質: 在程式中儲存資料的【容器】

語法:

1. 通過字面量方式建立一個物件(容器)

var 自定義名稱 = {

自定義鍵 : 值,
自定義鍵 :值

}


2. 通過建構函式建立物件(字面量方式是該種方式的一種簡寫行式)

語法:
var 自定義物件名 = new Object();

分析建構函式建立物件

1. 建構函式: 本質還一個函式,只不過該函式是用來建立物件的【建構函式的命名是按照帕斯卡命名法】

2. Object()就是js中內建的一個用來建立物件的一個建構函式

3. 關鍵字new : 用來呼叫建構函式實現例項化一個物件(建立一個物件)

4. 執行過程:
✔ 先執行 new Object() 在記憶體堆中開闢一塊空間(產生一個記憶體地址)

✔ 將記憶體地址 賦值給左側的變數

✔ 變數就會按照記憶體地址去實現物件中的程式碼


3. 通過工廠方式建立物件:將建構函式建立的物件封裝到一個函式中

例如:
function createPeople (uName, uAge, uScore) {

var obj = new Object();

obj.userName = uName;

obj.age = uAge;

obj.score = uScore;

return obj;
}

var zs = createPeople('zs', 18, 100);
var ls = createPeople('ls', 22, 90);

console.log(zs);
console.log(ls);


4. 通過自定義建構函式建立物件

☞ 自定義建構函式本質: 還是一個函式(1. 是咱們自己寫的一個函式。 2. 建立物件)

☞ 在使用自定義建構函式建立物件的時候,也需要使用關鍵字 new

備註:
1. 普通的函式遵守駝峰命名法
2. 建構函式遵守帕斯卡命名法


例如:

// 通過自定義建構函式建立物件
function People(name, age, gender) {

this.userName = name;
this.userAage = age;
this.userGender = gender;

this.run = function() {

alert(this.userName +'正在跑步運動中...');
}
}

// 使用該自定義建構函式建立物件
var zs = new People('張三', 18, '男');
var ls = new People('李四', 22, '女');


console.log(zs, ls);

 

自定義建構函式總結:

1. 在建構函式中返回值可以省略不寫

2. 建構函式中的this關鍵字,誰呼叫該建構函式,this就指向誰。

3. 如果批量建立物件,那麼推薦使用自定義建構函式

4. 如果程式中只是簡單的建立個別幾個物件,那麼可以使用字面量直接建立

獲取物件中的值:

✔ 物件名.鍵的名字

✔ 物件名['鍵的名字']


備註:
1. 如果要獲取屬性的值,那麼直接 物件.屬性名
2. 如果要獲取方法的值,那麼直接 物件.方法名()

給物件賦值:

✔ 直接在定義物件的時候,以鍵值對的方式給物件賦值

✔ 通過 物件名.自定義鍵名 = 值;

✔ 通過 物件名['自定義鍵名'] = 值;


注意:
1. 物件中儲存資料格式是以鍵值對格式儲存的 : 鍵:值

2. 在物件中用來描述物件基本特徵的: 叫屬性(名詞)
在物件中用來描述物件的行為: 叫方法(是一個函式)

☞ 遍歷物件: 通過迴圈的方式找到物件中的每一個值。

☞ 語法:

for( 鍵 in 物件 ) {

物件[鍵]
}

例如:
var obj = {
username : '張三',
userage : 20,
usergender : '男'
}

for( key in obj ) {

console.log(key + ':'+ obj[key]);
}


物件總結:

1. 能夠使用四種方式建立物件

2. 能夠給建立的物件賦值

物件.鍵 = 值;
物件['鍵'] = 值;

3. 獲取物件中的值

物件.鍵;

物件['鍵'];

4. 遍歷物件

for( key in 物件) {

物件[key]
}

5. new : 通過呼叫建構函式建立物件(例項化)

6. this : 誰呼叫建構函式,this就指向誰。

7.
物件中的屬性: 物件中的屬性就是用來描述物件基本特徵(名詞)

物件中的匿名函式 : 物件中的方法


8. typeof ====> 獲取當前變數的資料型別

instanceOf ====》 判斷當前物件是通過哪個建構函式建立的

 

其他擴充套件部分:

1. 簡單資料型別: 在棧上儲存

簡單資料型別在棧儲存的就是一個具體值

2. 複雜資料型別: 在堆上儲存

✔ 首先在堆上開闢一塊空間 ---- 生成記憶體地址

✔ 將記憶體地址儲存到棧上


3. 內建物件:js原生的物件。通過查MDN手冊,去使用提供的屬性及方法。

https://developer.mozilla.org/zh-CN/

定義陣列的兩種方式;
var ary = new Array();
var ary = [];


☞ 與數學運算相關的內建物件 Math

Math.PI ----》 用來獲取圓周率

Math.round(值) ----> 對一個數字進行四捨五入 (得到的是一個整數)

Math.abs(值) ----> 獲取一個數字的絕對值

Math.max(值,值) -----> 獲取一組數字中的最大值

Math.min(值,值) -----> 獲取一組數字中的最小值

Math.pow(x,y) -----》 獲取 x 的 y 次 方


☞ 與陣列物件相關的方法或屬性

1. 通過建構函式建立物件

var ary = new Array();

2. 通過字面量方式建立物件

var ary = [];


3. 獲取陣列的長度 ary.length

4. 方法:

Array.isArray(ary) 判斷一個變數是不是陣列,返回 true 或者 false

陣列物件名.push(值); 向陣列的末尾新增值

陣列物件名.unshift(值); 向陣列的開始新增值


陣列物件名.pop() // 刪除陣列中最後一個數字,並返回該數字
陣列物件名.shift() // 刪除陣列中第一個值,返回該數字


陣列物件名.reverse() // 將陣列翻轉

陣列物件名.join方法('|') // 返回的是一個字串


indexOf(字元) // 用來獲取陣列中對應字元的索引位置,如果包含該字元那麼就返回其對應的索引位置,如果不包含該字元,那麼就返回 -1;

5. 字串方法

☞ 字串特性: 不可變性。

☞ 屬性

字串變數.length ====》 獲取字串長度


☞ 方法:

indexOf(字元) ===》 字元在字串的索引位置(如果有直接返回索引位置),如果沒有返回-1

lastIndexOf(字元) ----》 返回指定字元在此字串中最後一次出現處的索引,如果此字串中沒有這樣的字元,則返回 -1。


replace(a,b) // 用b替換a


1. concat() //拼接字串 等效於 +

2. slice(strat,end) //從指定位置開始,擷取字串到結束位置,end值取不到

3. substring(start,end) //從指定位置開始,擷取字串到結束位置, end值取不到

4. substr(start,length) //從哪個位置開始,一共要擷取多少個

&n