JavaScript高階程式設計介紹

前言：

#　　大致花了一個星期的時間把這本書認真看了半本，下面是我做的閱讀筆記，希望能讓看這本書的人有個大致的參考。目前可能寫得較亂不夠全面，後續我會整理添加。 (2017-7-17) 

第一章 JavaScript簡介

#第二章 HTML中使用JavaScript

第三章  基本概念

3.1.語法

區分大小寫

#標識符(建議用駝峰大小寫myCar)

註解// /**/

嚴格模式(use strict)

語句 建議var diff-a-b;要用分號，以及 if( test ) {  alert(test);  }一句話也要用{}

# 

3.2 關鍵字和保留字

 

3.3 變數

未初始化undefined    var message = “hi”; message = 100; 型別隨便換

 

Function test(){

Var a = “hi”; 局部

b = “hi”; 全局

}

Test();  alert(a); 錯誤 alert(b); hi

 

3.4 資料類型

typeof

Undefined (定義但未被賦值)

Null(空物件指標)

Boolean(布林值true false 流程控制語句會自動執行對應boolean 轉換)

Number

(八進位0  十進位 十六進位0x  浮點數值數值範圍NaN 數值轉換Number parseInt )

String(字串，單雙引號沒區別，轉義序列，字串特點，toString  String)

Object(對象所有物件的基礎var o = new Object();)

函數在ES是對象，不是一種資料型別。

 

3.5運算子

#一元運算子 ++ -- 、 + -(可用來轉換資料型別)

# 

位元運算子  位元非~num1 位元與& 位元或##| 位元異或^ 左移<< 右移>> 無符號右移>>

 

#布林運算子 ！ &&  ||   乘運算子* / %   加性運算子##+ -   關係運算子< > <= >= 

##相等運算子

==   !=   ===  !==   

條件運算子？ ：   

賦值運算子

=  *=  /=  %=  +=  -=  <<=  >>=  > >=

 

逗號運算子

 

3.6 

語句

 

# 3.7 

函數 

arguments      

沒有重載## 

#第四章 

 

變數、作用域與記憶體問題

4.1 基本型別與參考型別的值

動態的屬性  (

引用型別能動態地加入屬性

)複製變數值  (

基本型別是不同的空間，參考類型是引用相同的空間

)傳遞參數    (

相同

) #

偵測類型    (typeof  instanceof)

# 

4.2執行環境與作用域

#作用域鏈結 延長作用域鏈結(try-catch  with)  沒有區塊層級作用域(if for 宣告變數查詢識別碼)

 

4.3垃圾收集

策略(標記清除引用計數)  效能問題 管理記憶體 

# 

第五章  #參考類型

5.1 Object類型

 

Var person = {};(適合給函數傳入大量參數)    var parson = new Object();

# 

Person[“name”](使用變數來代表屬性時用)   person.name(推薦)

# 

 

 

#5.2 Array 類型

 

Var colors = new Array();    var colors = Array();  var colors =[*****];

 

Colors[*] = *****;     colors.length

 

偵測陣列：  instanceof   Array.isArray()

 

轉換法：  toString()    valueOf()   toLocaleString()   join()

 

##家字家方法：

##' ##  push()  pop()

 

#佇列方法： shift()  unshift() #重新排序方法： reverse()  sort(

可加入比較函數這個參數

#)  

 

操作方法：

concat()原沒變新增   slice()

原沒變截斷段   

splice()

原變了可刪除可添

 

位置方法： indexOf()  lastIndexOf()  

傳回項目的位置

#迭代方法：every() filter() forEach() map() some()  

每個項目都處理，但原始數組不會改變

# 

並歸方法：

reduce()

順序 

reduceRight()

反序  對兩個項目一直遍歷到最後

 5.3 Date

類型

 New Date() 裡面 parse(“May 25,2004”) UTC(2005,0)       Date.now()

 

#######繼承的方法：###toLocaleString(##toLocaleString(### #########. )  toString()  valueOf()###### #########日期格式化方法：###toDateString() toTimeString() toLocaleDateString() toLocaleTimeString() toUTCString()##### # #########日期###/###時間元件方法：太多具體看書########## #####5.4RegExp###類型### ###### #########字面量### var pattern1 = / [bc]at / i;###### ######### 建構子## # var pattern2 =。 ####沒什麼卵用######### ####

RegExp實例方法：exec() 擷取群組(擷取多組符合項目)   text() 一次看是否符合    

 

RegExp建構子屬性：有點多，用來看最近一次符合的相關訊息

 

模式的限制：缺少某些語言(Perl)所支援的高階正規表示式特性，但是絕大多數情況夠用

 

5.5 Function類型    函數是物件(也是#Function#的實例)，函數名稱是指標。

 

function sum(num1,num2) {  }

 

Var sum = function(num1,num2){  };

 

沒有重載：函數是對象，函數名稱是指標。

 

函數宣告與函數表達式：function ******* 函數宣告提升   var sum = ** ***** 不會提升

 

函數內部屬性：arguments物件# (屬性callee指向函數)   this物件( #指向函數執行的環境物件)      屬性caller (指向呼叫目前函數的函數，如果是全域作用域的函數則值為null)

 

函數屬性與方法：

# 

屬性(length宣告參數個數 prototype繼承)  

 

非繼承方法： call( )    apply()   bind()

 

a.apply( b, c);  a.call( b, d );      

'

##Ch

盤'>

##' ##在環境物件

b

裡運行函數

a ,順便給a傳入參數c( argument

或陣列

)  /  d(

每項寫入

出來

)  # Var a = b.bind(c);

 

a 是在c

在環境物件裡運行的函數

 

5.6基本包裝類型：# Boolean

類型：

################################################################################ var booleanObject = new Boolean(true);  #######建議永遠不要使用######Boolean######物件。 ######### ###### ###### #######Number###類型：######var numberObject = new Number(10);  toFixed( )  toExponential()  toPrecision()######### #########也建議不要直接實例化###Number###類型。 ######### ###### ######String ###類型：######var stringObject = new String(###“hello world”);  length# ##屬性 ######### ###

1.字元方法：charAt()或string[]   傳回對應字元    #charCodeAt()   傳回對應字元編碼

 

2.字串操作方法：

 

##concat()

或+運算子和陣列的concat()#看起來一樣 

 

Slice()  substring()  substr()  

截斷字串，三個很靈活

 

3.

字串位置方法：indexOf( )   lastIndexOf()

 

4.trim()

方法 刪除前置及後綴的所有空格    trimLeft()  trimRight()

 

5.字串大小寫轉換方法

 

#toLowerCase()  toUpperCase()

經典方法

toLocaleLowerCase()  toLocaleUpperCase()

特定地區  這種更穩健

 

#6.字串的模式比對方法

match()

和RegExp的exec()本質一樣傳回符合到字串的陣列

 

search()

傳回第一個符合項目的索引否則回傳-1

 

replase()

符合且取代字串

 

#split()

符合分隔符號產生陣列

 

7.localeCompare()   

比較兩個字串

 

8.fromCharCode()   

靜態方法   將多個字元編碼變成字串

 

9.HTML

方法   例如big()     string

#凱希;

# 

5.7

單體內建物件

 

1.Global

物件

 

URL

編碼方法： encodeURI() 整個    

encodeURIComponent()

某一段   編碼 decodeURI() 整個    

某一段   # eval()方法 非常強大且非常危險

ECMAScript

解析器

 #Global 物件的屬性    undefined、

Array.........

##都是屬性

 Web瀏覽器是將全域物件作為window

物件的

一部分加以實作的

 

2.Math

物件

 

Math

物件的屬性   一些特殊值例如π

 

min() max()

方法

 

#捨去方法：小數值變整數

   ####### # ##

Math.ceil(25) 進一   Math.floor(25) 退一   #Math.round(25) 四捨五入

 

#random()方法  [0,1) 之間的隨機數字

 

其它方法  太多看書

 

第六章 #物件導向的程式設計

 

#6.1理解物件

 

# 6.1.1屬性類型：

 

#資料屬性：4個特性 

## 

存取器屬性：不包含資料值 4個特性透過Object.defineProperty()##定義 

6.1.2

定義多個屬性：

Object.defineProperties()  可以是資料屬性，也可以是存取器屬性。  

6.1.3

讀取屬性的特性：

Object.getOwnPropertyDescriptor()## 

 

6.2

建立物件

 

6.2.1

工廠模式

(

# #看書

)

 

6.2.2建構子模式(看書 

new  constructor  )

 

#6.2.3原型模式： 

#1.瞭解原型對象

 

2.

原型與

in

運算子( in  for-in )

## 

3.

更簡單的原型語法

(

物件字面量來存取物件

)

 

4.

原型的動態性

(

原型可以換成另一個對象，但對已經建立的實例無效了

)

 

5.原生物件的原型( 就是用原型模式，可以定義新方法在裡面，但不推薦#) # 6.原型物件的問題：沒有屬於實例自己的屬性 

6.2.4

組合使用建構子模式和原型模式#### ##### ######最常見的模式，實例有自己的屬性和方法，也有共享的。 ###### ######6.2.5###動態原型模式########## ######在上面的模式再加一個判斷語句，來動態在原型中加入方法。 ###### ######6.2.6###寄生建構函數模式########## #########和工廠模式的差異就一個### new###，還有它有多個######return#######。傳回的物件和建構函式沒有關係，導致不能用######instanceof######運算子來決定物件的型別。不太建議使用。 ######### ###

6.2.7穩健建構函數模式

 

#跟寄生建構子模式有類似處，但不用this和new。 instanceof也偵測不出

 

 

6.3繼承

# 

6.3.1

原型鏈  原型搜尋機制

 

1.

別忘了預設的原型：所有函數的默認原型都是

Object

的實例。

 

2.

確定原型與實例的關係：

instanceof    isPrototypeOf()

 3.謹慎地定義方法：必須在實例替換原型之後才能定義新的方法。  4.原型鏈的問題： 原型外的屬性也給了繼承

 

#在創造子類型的實例時，不能傳遞參數給超類型的建構子。

 

很少是單獨使用。  

6.3.2

借用建構子利用

call或

apply

來繼承和傳遞參數 但是只能使用建構函數模式。

 也很少單獨使用。

 

6.3.3

組合繼承

# 原型鏈實作 原型屬性和方法的繼承 

借用建構子實作

對實例屬性的繼承## 

最常用的繼承方式

 

##6.3.4原型式繼承(看書)  

 

沒有用到建構子 保持型別可以用，但是會跟原型模式一樣共用參考型別的屬性。  

6.3.5

寄生式繼承

#(看書#) 

不考慮建構子

可以用上

 

但是無法做到函數重複使用

 

#6.3.6

寄生組合式繼承

(閱讀)## 

組合繼承有問題：呼叫了兩次超類型的建構函數，導致實例和原型中重複了屬性。

 

寄生組合式繼承解決了這個問題，成為了最理想的繼承範式。

  

#第七章

函數表達式

############### ####定義函數方式：###### #########函數宣告###( ###函數宣告提升有#####name)   ############################################################# ### #########函數表達式###( name###為空白匿名函數######/######命名一般函數表達式都是匿名函數# #####)######### ###

7.1遞迴

 

嚴格模式不能用 arguments.callee  可以用命名函數表達式。

 

 

7.2閉包：有權存取另一個函數作用域中的變數的函數

自我總結：閉包是函數，一般用匿名函數

 

#1.閉包可以存取傳回外部函數中的變數。

 

2.另一個函數的活動物件會被保存，直到閉包的作用域連結被銷毀。

 

7.2.1閉包與變數 

 

##副作用：關閉包的作用域鏈上保存的是整個變數對象，所以返回的變數是保存的最後一個值。

 

例如在for迴圈中，則會出現不如意的情況。

 

7.2.2

關於this物件

 

##。

#閉包中的

this

對象，閉包可能在某些特殊情況被放到全局對像上，從而

this

變卻不自知。

 

7.2.3記憶體洩漏

# 

使用閉包，確保正常回收記憶體 

 

7.3

模仿區塊層級作用域

 

用匿名自執行函數來模仿。  

自我總結作用：

 #1.內部執行完就會被摧毀。

 

2.匿名自執行函數可以減少污染全域方法和屬性。  閉包就有一個記憶體的問題，用這個結合很舒適。  

 

7.4私有變數 物件上的都是公有的    

函數裡面的都是私有的

 

透過閉包來建立函數的公有方法

(

特權方法

)    ---------

用來取得私有變數

# 在建構子中建立                         -------- 建構子

this   

#this.****** = function(){ **** }; 

但是每個實例化都會重新建構一組方法，浪費。

 ###### ######7.4.1###靜態私有變數                  #### 個實例沒有自己的私有屬性######### #########靜態就用###  ###私有作用域###   ###透過閉包在全域的構造函數的原型裡面來創造特權方法。 ######### ###

增進了程式碼的重複使用性，但是每個實例沒有自己的私有變數。 (因為這個叫靜態私有變數)

 

使用實例變數，還是靜態私有變數，看特定需求。

 

 

7.4.2模組模式                   字面量   一個實例物件 

#為單一範例建立私有變數與特權方法

(

單例：只有一個執行個體的物件

) 在匿名函數內部定義私有變數和方法，然後將一個物件字面量作為函數的回傳值。

 

 

7.4.3

增強的模組模式

 必須是某種類型的實例，同時也必須加入某些屬性或方法。

 

以上是JavaScript高階程式設計介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！