003-讀書筆記-JavaScript高級程序設計 基本概念(上)

這篇筆記的內容對應的是《JavaScript高級程序設計(第三版)》中的第三章。

1.語法

1-1 區分大小寫

ECMAScript 中的一切都是區分大小寫的。

• test 和 Test 首字母不一樣，那麼它們就不相同
• typeof 和 typeOf 中間有個字母大小寫不一樣，那麼它們也不相同

1-2 標識符

認識標識符

1. 標識符的做用：用於變量、函數名、屬性名、函數的參數
2. 標識符的規則：

1. 第一個字符必須是字母、下劃線(_)或美圓符($)
2. 其餘字符能夠是字母、數字、下劃線或美圓符

注：
1. ECMAScript 標識符通常採用駝峯方式定義，即第一個字母小寫，剩下每一個有意義的單詞首字母大寫(不是強制規定)
2. 不能使用關鍵字、保留字、true、false 和 null 做爲標識符(強制規定)

思考：可不可使用 undefined 做爲標識符？

使用 var 來定義變量的時候不能夠：

var undefined = 123;
console.log(undefined); // undefined

使用 const 或 let 定義變量的時候能夠：

let undefined = 123;
console.log(undefined); // 123

結論：儘可能不要使用 undefined 做爲標識符

1-3 註釋

註釋的方式有兩種：

1. 單行註釋
2. 多行註釋

// 單行註釋

/**
 * 多行註釋
 */

1-4 嚴格模式

ECMAScript5 中引入了嚴格模式的概念。

1. 嚴格模式的做用：爲 JavaScript 定義一種不一樣的解析與執行模型
2. 嚴格模式的啓用：在文件中定義一個編譯指令 "use strict";

嚴格模式能夠在文件中使用，也能夠在函數中使用。若是要在整個文件中使用嚴格模式，就要在文件頂部添加編譯指令；若是要讓函數在嚴格模式下執行，要在函數體中增長編譯指令。

"use strict";

// js文件中的其餘代碼

function func(){
  "use strict";
  // 函數體
}

1-5 語句

語句通常以分號結尾。

var num = 123;

結尾分號不是必須的，若是沒有分號，以解析器肯定語句的結尾。

var num = 123

語句結尾手動增長分號的好處：

1. 提升代碼的性能(解析器不須要推測在哪裏須要插入分號)
2. 避免一些沒必要要的錯誤(如代碼壓縮時出錯)

推薦語句的結尾使用分號

2.關鍵字和保留字

關鍵字在 ECMA-262 中具備特定的用途，通常用於：

1. 用於控制語句的開始或結束
2. 用於執行特定的操做等

ECMA-262 中的關鍵字以下：

列	列	列	列	列
break	do	instanceof	typeof	case
else	new	var	catch	finally
return	void	continue	for	switch
while	debugger	function	this	with
default	if	throw	delete	in
try

ECMA-262 中的保留字沒有任何意義，可是之後有可能被用做關鍵字：

列	列	列	列	列
abstract	boolean	byte	char	class
const	debugger	double	enum	export
extends	final	float	goto	implements
import	int	interface	long	native
package	private	protected	public	short
static	super	synchronized	throws	transient
volatile	let	yield

關鍵字和保留字不能用做標識符

3.變量

ECMAScript 中定義變量的方式，var 操做符後面跟上變量名，如 var num;。

ECMAScript 每一個變量僅僅是一個用來保存值的佔位符而已，ECMAScript 中的變量能夠保存任意類型的值：

var num = 123; // 定義一個變量，初始值爲數字
num = '123'; // 更改變量的值，這個時候數值類型爲字符串

不建議修改變量所保存的值的類型

若是變量在聲明的時候，沒有指定初始值，會保存一個特殊的值 undefined。

var num;
console.log(num); // undefined

一條語句能夠定義多個變量，可是要使用逗號操做符分割：

var num = 123, 
    str = 'test', 
    flag = true;

注意：嚴格模式下，不能定義名字爲 eval 或 arguments 的變量，不然會報錯。

'use strict';

var arguments = 123;
console.log(arguments);

會報出下面的錯誤：

SyntaxError: Unexpected eval or arguments in strict mode

分析：定義變量並結合做用域

在函數內部經過 var 定義的變量，在函數外部不能訪問。

function func() {
  var name = 'wang'; // 這是一個局部變量，當函數執行結束的時候，該變量會被銷燬
}
func();
console.log(name); // ReferenceError: name is not defined

若是在函數內部定義變量的時候不使用 var 關鍵字，那麼就會默認定義的是一個全局變量。

function func() {
  name = 'wang';
}
func();
console.log(name); // 'wang'

上面的代碼和下面的代碼等價，由於發生了變量聲明提高：

var name;
function func() {
  name = 'wang';
}
func();
console.log(name); // 'wang'

4.數據類型

ECMAScript 中有 5 種簡單的數據類型和 1 種複雜的數據類型。

• 簡單數據類型：Undefined Null Boolean Number String
• 複雜數據類型：Object

4-1 typeof 操做符

typeof 是一個操做符，不是一個函數，雖然在判斷數據類型的時候能夠寫成 typeof(123)，可是括號不是必須的。

typeof 123
typeof(123)

使用 typeof 操做符，返回值是下面值中的一個：

• undefined : 值未定義

var arg1;
var arg2 = undefined;
var arg3 = void 0;

• boolean : 值是布爾值

var arg1 = true;
var arg2 = false;

• string : 值是字符串

var arg1 = '';
var arg2 = 'false';

• number : 值是數值

var arg1 = 123;

• object : 值是對象或 null

var arg1 = new Object();
var arg2 = null;

• function : 值是函數

function func() {}
console.log(typeof func); // function

注意：typeof 操做符後面的內容能夠是變量，也能夠是字面量。

var str = 'test';
console.log(typeof str); // 變量
console.log(typeof 'test'); // 字面量

4-2 Undefined 類型

Undefined 類型中只有一個值：undefined。Undefined 類型存在的做用就是比較。不管什麼狀況下，都沒有必要把一個變量的值，顯示指定爲 undefined。

變量在聲明的時候沒有初始化，那麼默認該變量的值就是 undefined。

var arg;
console.log(arg === undefined); // true

還沒有聲明的變量，只能執行一項操做，就是檢測該變量的數據類型。

console.log(typeof name); // undefined

因爲聲明爲初始化和未聲明的變量，經過 typeof 操做符獲得的結果相同，所以在變量初始的時候，通常給其賦初始值，這樣，在使用 typeof 操做符的時候，就能判斷該變量是否是未聲明的變量。

4-3 Null 類型

Null 類型中只有一個值：null。null 表示的是空對象指針，所以，使用 typeof 操做符獲得的結果是 object。

var arg = null;
console.log(arg); // null

若是定義的變量，未來用來保存對象，那麼就在定義的時候，初始化爲 null。

var obj = null; // 保存對象的引用

undefined 派生自 null，所以，在相等測試中返回 true。

console.log(null == undefined); // true

4-4 Boolean 類型

Boolean 類型中有兩個值：true 和 false。

Boolean 能夠將其餘數據類型轉成 Boolean 類型，轉換規則以下：

數據類型	true	false
Boolean	true	false
String	任意非空字符串	""(空字符串)
Number	任意非零數字	0和NaN
Object	任意對象	null
Undefined	不適用	undefined

使用方式：

Boolean('string') // true

在流程控制語句中，會自動執行 Boolean 進行轉換：

var str = 'test';
if(str){ // 至關胡 if(Boolean(str)){
  console.log(123)
}

4-5 Number 類型

Number 類型使用 IEEE754 來表示整數和浮點數。

認識不一樣的進制：

1. 十進制：0-9表示，逢10進1
2. 八進制：0-7表示，逢8進1
3. 十六進制：0-9和A-F表示，逢16進1

var num1 = 12; // 十進制
var num2 = 014; // 八進制，以0開頭
var num3 = 0x12; // 十六進制，以0x開頭

無效的八進制會自動解析成十進制：

var num = 029; // 因爲八進制中沒有9，會自動解析成十進制的29

在嚴格模式下定義八進制的數字會報錯：

'use strict';
var num = 017; // SyntaxError: Octal literals are not allowed in strict mode.

浮點數的組成：存在小數點，小數點後面存在數字。

var num1 = 0.1; // 浮點數
var num2 = .2; // 雖然小數點以前能夠沒有數字，可是不推薦這種寫法

浮點數佔用的內存是整數的兩倍，所以，ECMAScript 會把小數點後面沒有數字或數字爲0的浮點數轉成整數來節約內存。

var num1 = 1.;  // 解析成 1
var num2 = 1.0; // 解析成 1

能夠用科學計數法表示很大的值或者很小的值：

var num1 = 3.123e10; // 可使用e，也可使用E
var num2 = 3.123e-10; // 表示小數

ECMAScript 可以表示的最大值 Number.MAX_VALUE 和最小值 Number.MIN_VALUE。能夠經過 isFinite() 方法判斷數值是否在 ECMAScript 可以表示的數值範圍以內。

console.log(isFinite(123)); // true

超出這個可表示的範圍的值，就是正無窮(Number.POSITIVE_INFINITY)和負無窮(Number.NEGATIVE_INFINITY)了。無窮大(Infinity)是不能參與運算的值，所以，若是有一個值的結果是無窮大，那麼計算獲得的值還是無窮大。

console.log(Number.POSITIVE_INFINITY + 1) // Infinity

NaN 是一個比較特殊的值，這個數值用來表示，原本應該返回數字的值，而最終的結果沒有返回數值。

2/0 // NaN

NaN 和任何數值進行運算，獲得的結果都是 NaN。

NaN + 1 // NaN

須要注意的是 NaN 和任何值都不相等，包括和本身自己。

console.log(NaN == NaN);  // false
console.log(NaN === NaN); // false

可使用 isNaN 函數來判斷一個數是否不是數字，規則：若是參數能轉成數字，返回 false；若是參數不能轉成數字，返回 true。

isNaN(NaN) // true
isNaN(true) // false

4-6 數值轉換

把非數值轉成數值，有三個函數可使用：

• Number() : 將任意數值類型轉成數字
• parseInt() : 將字符串轉成整數
• parseFloat() : 將字符串轉成浮點數

Number() 方法

1.布爾類型:

Number(true)  // 1
Number(false) // 0

2.數值類型: 原樣輸出

Number(12)   // 12
Number(12.3) // 12.3

3.Null類類型:

Number(null) // 0

4.字符串:

Number('123')    // 123，數字會轉成對應的十進制的值
Number('+123')   // 123
Number('-123')   // -123
Number('123.12') // 123.12
Number('')       // 0，空字符串結果爲0
Number('0xf')    // 十六進制對應的十進制
// 其他字符串轉成 NaN

使用一元加操做符，獲得的結果和 Number 函數的結果相同

+'' // 0

parseInt() 方法

該方法在轉換成數值類型的時候，會有下面的操做：

1. 首先檢查字符串開頭的字符是不是 '+' '-' 空格 數字，若是不是，則轉成 NaN
2. 若是是，則檢查到第一個不爲數字的字符爲止，中間的內容轉成數字

parseInt('123')      // 123
parseInt('  12.012') // 12
parseInt('a12')      // NaN

該方法能夠指定第二個參數，表示第一個參數是哪一種進制的數值字符串：

parseInt('12', 8) // 10，12是八進制值，轉成十進制就是10

parseFloat() 方法

該方法在轉換成數值類型的時候，會有下面的操做：

1. 首先檢查字符串開頭的字符是不是 '+' '-' 空格 數字 小數點，若是不是，則轉成 NaN
2. 若是是，則檢查到第一個不爲數字或小數點的字符爲止，中間的內容轉成數字
3. 注意：若是字符串以小數點開頭，那麼到第二個小數點的位置爲止，中間的值做爲浮點數

parseFloat('.12')  // 0.12
parseFloat('.12.') // 0.12
parseFloat('+.12') // 0.12
parseFloat('a.12') // NaN

這個方法沒有第二個參數。

4-7 String 類型

String 類型用於表示由零個或多個16位 Unicode 字符組成的字符序列，即字符串。字符串能夠由引號(單引號或雙引號均可以)括起來表示。

'這是一個由單引號括起來的字符串'
"這是一個由雙引號括起來的字符串"

轉義字符:

字面量	含義
\n	換行
\t	製表符
\b	空格
\r	回車
\\	斜槓
\'	單引號
\"	雙引號
\xnn	以十六進制代碼nn表示一個字符，如\x41表示'A'
\unnnn	以十六進制代碼表示一個 Unicode 字符

字符串的特色:

字符串一旦建立，值就不能改變。若是要改變，須要從新開闢內存，建立字符串，而後更新變量的指向。

轉成字符串:

除了 null 和 undefined，每一個數據類型都有 toString，所以，可使用 toString 方法轉成字符串。

123..toString()  // '123'，第一個點會被解析成小數點，第二個纔是調用方法的操做符
(123).toString() // '123'

toString 的第二個參數用來指定轉成數字的基數。

12..toString(2) // 轉成二進制

若是對 null 和 undefined 使用 toString 方法會報錯：

undefined.toString() // TypeError: Cannot read property 'toString' of undefined
null.toString()      // TypeError: Cannot read property 'toString' of null

一種更增強大的轉換成字符串的方法 String，能夠接收 null 或 undefined，做爲參數；同時也能夠接收其餘數據類型做爲參數。

console.log(String(null));      // null
console.log(String(undefined)); // undefined

一種更簡單的轉成字符串的方式是，將數值類型與空字符串相加：

123 + ''  // '123'
null + '' // 'null'

4-8 Object 類型

建立 Object 實例的方式，能夠經過構造函數的形式建立：

var obj = new Object();

若是構造函數中沒有傳遞參數，那麼能夠省略括號：

var obj = new Object; // 這種方式不推薦

每一個 Object 實例都有下面的屬性和方法：

• Constructor : 構造函數，用於建立對象的函數
• hasOwnProperty(propertyName) : 檢查實例中是否包含某個屬性，不是實例原型上的屬性
• isPrototypeOf(object) : 檢查傳入的對象是不是另外一個對象的原型
• propertyIsEnumerable(propertyName) : 屬性可否使用 for-in 語句進行遍歷
• toLocalString : 轉成與本地運行環境相匹配的字符串
• toString : 返回對象的字符串表示
• valueOf : 返回對象的字符串、數值或布爾值的表示

這些內容做爲記憶，在後續的章節會有對這些內容的詳細解釋。