摘要:學習筆記一入門篇最近正在看高級程序設計,一直沒來得及總結一下,順便對之前看的編程藝術進行一些簡單的總結,如有一些不正確的地方還請多指出討論。其他字符可以是字母下劃線美元符號或者數字。
JavaScript 學習筆記一 (入門篇)
最近正在看《JavaScript高級程序設計》,一直沒來得及總結一下,順便對之前看的《JavaScript DOM編程藝術》進行一些簡單的總結,如有一些不正確的地方還請多指出討論。
第1章 基本概念 1.1 區分大小寫在學習 JavaScript 之前要理解的第一個概念就是在 ECMAScript 中所有的一切(變量、函數名和操作符)都是區分大小寫的。比如變量 test 和 Test 是兩個不同的變量,typeof 不能用在函數名上,因為它是一個關鍵字,但 typeOf 完全可以是一個函數名,因為在 ECMAScript 中變量、函數名和操作符等等都是區分大小寫的。
1.2 標識符在學習之前還需要了解的第二個概念就是「標識符」,所謂標識符就是指變量、函數、函數的參數和屬性的名字,標識符可以下列格式規則組合起來的一個或多個字符:
第一個字符必須是是字母、下劃線(_)或者美元符號($)。
其他字符可以是字母、下劃線、美元符號或者數字。
按照慣例,ECMAScript 標識符采用駝峰大小寫格式,也就是第一個字母小寫,剩下的每個單詞的首字母大寫,例如:
firstSecond
myCar
doSomethingImportant
第2章 數據類型ECMAScript 中有 5 種基本數據類型:Undefined、 Null、 Boolean、 String 和 Number。還有 1 種復雜數據類型:Obect,Object 本質上是由一組無序的名值對組成。ECMAScript 不支持任何創建自定義類型的機制,而所有值最終都將是上述 6 種數據類型之一。
2.1 typeof 操作符由于 ECMAScript 是松散類型的,所以需要有一種方法來檢測給定變量的數據類型,typeof 就是負責提供這方面信息的操作符。對一個值使用 typeof 操作符可能返回下列某個字符串:
"undefined",如果這個值未定義;
"boolean",如果這個值是布爾值;
"string",如果這個值是字符串;
"number",如果這個值是數值;
"object",如果這個值是對象或 null;
"function",如果這個值是函數。
例如:
var message = "Some Message!" alert(typeof message); // "string" alert(typeof(message)); // "string" alert(typeof 95); // "number"
由此可以看出 typeof 操作符的操作數可以是變量(message),也可以是數值字面量。注意,typeof 是一個操作符而不是函數,所以例子中的圓括號盡管可以使用,但不是必需的。
這里需要注意一下的是,如果對 null 進行 typeof 操作的話,會返回 "object",因為 null 會被認為是一個空的對象引用。還有一些比較奇怪的返回值,比如 Safari 5 及之前的版本、 Chrome 7 及之前的版本在對正則表達式調用 typeof 操作符時會返回 "function",而在其他瀏覽器下則會返回 "object"。
2.2 Undefined 類型Undefined 類型的值只有一個,即特殊的 undefined。當用 var 關鍵字聲明一個變量但未對它進行初始化時,這個變量的值就是 undefined,例如:
var message; alert(message == undefined); // true
這個例子只對 message 進行了聲明,但未對其進行賦值操作,此時 message 的值就是 undefined,這個例子和下面這個例子是等價的:
var message = undefined; alert(message == undefined); // true
這個例子使用 undefined 值顯式初始化了變量 message。但我們沒有必要這么做,因為未經初始化的值默認就會取得 undefined 值。
對于 Undefined 類型還有一點需要注意的就是,聲明了變量但是未對其進行初始化賦值操作和根本就沒有聲明變量是不同的:
var message; // 聲明變量后默認取得 undefined // 下面這個變量根本沒有聲明 // var age; alert(message); // undefined alert(age);// Uncaught ReferenceError: age is not defined
對于第一個警告框大家肯定沒疑問,彈出的應該是 "undefined",由于傳遞給第二個警告框的是一個未申明的變量,所以在這里會導致一個錯誤。
對于尚未申明的變量,只能對其進行一項操作,即使用 typeof 對其進行數據類型的判斷。不過有一點比較奇怪的就是,對未進行初始化賦值操作的變量和未申明的變量使用 typeof 操作符,都會返回 "undefined":
var message; // 聲明變量后默認取得 undefined // 下面這個變量根本沒有聲明 // var age; alert(typeof message); // "undefined" alert(typeof age); // "undefined"
結果表明對未進行初始化賦值操作的變量和未申明的變量使用 typeof 操作符,都會返回 "undefined"。
2.3 Null 類型Null 類型是第二個只有一個值的數據類型,這個特殊的值是 null。從邏輯角度來看,null 值表示一個空對象指針,而這也正是使用 typeof 操作符檢測 null 值時會返回 "object" 的原因,如下面的例子所示:
var car = null; alert(typeof car); // "object"
如果定義的變量準備在將來用于保存對象,那么最好將該變量初始化為 null 而不是其他值。這樣一來,只要直接檢查 null 值就可以知道相應的變量是否已經保存了一個對象的引用,如下面的例子所示:
if (car != null){ // 對 car 對象執行某些操作 }
實際上,undefined 值是派生自 null 值的,因此 ECMA-262 規定對它們的相等性測試要返回 true:
alert(null == undefined); //true
這里有一點也要注意的是,這里的相等操作符(==)出于比較的目的,會對比較的兩個類型進行類型轉換(后面會對這個知識點進行一些詳細的總結)。
盡管 undefined 派生自 null,但它們的用途卻不相同,無論在什么情況下都沒有必要對一個變量的值顯示的賦值為 undefined,而同樣的道理對 null 卻不適用,換句話說,只要意在保存對象的變量還沒有真正的保存對象,就應該明確地地讓該變量保存 null 值。這樣做不僅可以體現 null 作為空對象指針的慣例,也有助于進一步的區分 undefined 和 null。
2.4 Boolean 類型Boolean 類型的值有兩個,分別是 true 和 false,這兩個值和數字值不是一回事,也就是說 true 不一定等于 1,false 不一定等于 0,還有一點值得注意的是文章一開始就強調的一個概念,在 ECMAScript 中所有的一切都是區分大小寫的,所以 True 和 False (以及其他混合大小寫的形式)并不是 Boolean 類型的兩個值,只是標識符。以下是為變量賦 Boolean 類型值的例子:
var found = true; var lost = false;
盡管 Boolean 類型的值只有兩個,但是在 ECMAScript 中,所有類型的值都有與這兩個 Boolean 值等價的值,將任意一種類型的值轉換為對應的 Boolean 值,可以調用轉型函數 Boolean(),例如:
var message = "Hello World!"; var messageAsBoolean = Boolean(message);
上面這個例子中,message 字符串被轉換成了 Boolean 值,轉換后的 Boolean 值被儲存在變量 messageAsBoolean 中。可以對任何數據類型的值調用 Boolean() 函數,而且總會返回一個 Boolean 值。至于具體返回是 true 還是 false 則要要具體的情況而定,下面給出了轉換的規則:
數據類型 | 轉換為true的值 | 轉換為false的值 |
---|---|---|
Boolean | ture | false |
String | 任何非空字符串 | ""(空字符串) |
Number | 任何非零數字值(包括無窮大) | 0和NaN(參見本章后面有關NaN的內容) |
Object | 任何對象 | null |
Undefined | n/a① | undefined |
Number 類型應該算是幾種基本數據類型中比較復雜的類型吧。
在 Number 類型中,最簡單的應該算是十進制整數吧,十進制整數可以直接像下面這樣在代碼中輸入:
var intNum = 9; // 整數 9
除了十進制以外,整數還可以用二進制、八進制和十六進制來表示。
其中八進制必須以 0 開頭,然后是八進制數字序列(0-7),如果字面中的值超出了范圍,則第一個 0 將被忽略,后面的數值將被當成十進制數值解析。
var num1 = 070; // 八進制 56 var num2 = 079 // 無效的八進制數,被解析成十進制數 79 var num3 = 08; // 無效的八進制數,被解析成十進制數 8
八進制字面量在嚴格模式下是無效的,會導致支持的 JavaScript 引擎拋出錯誤。
十六進制必須以 0x 開頭,然后是十六進制數字序列(0-9 及 A-F),其中字母可以大寫也可以小寫,例如:
var num1 = 0xA; // 十六進制的 10 var num2 = 0x1f; // 十六進制的 31
在進行算數計算時,所有的八進制和十六進制表示的數值最終都將被轉換成十進制數值。
2.5.1 浮點數值浮點數值必須包含一個小數點,且小數點后面必須要有一位**非 0 **數字才算是浮點數值,如果小數點后沒有數字,則 ECMAScript 會自動忽略這個小數點,小數點前面則不一定要有數字,但不推薦這種寫法:
var num1 = 1.1; var num2 = 0.1; var num3 = .1; // 有效但不推薦 var num4 = 1.; // 小數點后面沒有數字,被解析為 1 var num5 = 1.0; // 被解析成整數 1
由于浮點數值所需的內存是整數數值所需要的內存的兩倍,所以 ECMAScript 會不失時機的將浮點數值轉化為整數。
還有一點需要注意的是,浮點數值的最高精度是 17 位小數,在進行算術計算的時候其精度遠遠不如整數數值。比如,0.1 加上 0.2 的結果并不是 0.3,而是 0.30000000000000004。這個小小的舍入誤差會導致無法測試特定的浮點數值,例如:
var a = 0.1; var b = 0.2; if (a + b = 0.3) { // 不要這么測試 alert("You got 0.3."); }2.5.2 數值范圍
由于內存的限制,ECMAScript 并不能保存所有的數值,ECMAScript 能夠表示的最小數值保存在 Number.MIN_VALUE 中,能夠表示的最大數值保存在 Number.MAX_VALUE 中,具體的來說,如果一個數值超出了 ECMAScript 所能保存的數值范圍,并且如果這個值是負數,則會被轉換成 -Infinity(負無窮),如果這個值是正數,則會被轉換成 +Infinity(正無窮)。
如果一個數被轉換成了無窮大(Infinity),則不能進行下一次運算,因為 Infinity 是不能被運算的數值。要想確定一個數值是不是有窮的(是不是最大值和最小值之間),可以使用 isFinite() 函數來確定,如果處于最大值和最小值之間,則會返回 true,例如:
var result = Number.MAX_VALUE + Number.MAX_VALUE; var min = Number.MIN_VALUE; var max = Number.MAX_VALUE; alert(isFinite(result)); // false alert(isFinite(min)); // true alert(isFinite(max)); // true
由上可知,最大值和最小值也算是有窮的。
2.5.3 NaNNaN 即非數值(Not a Number)是一個特殊的數值,NaN 是用來表示本來應該返回一個數值卻沒有返回數值的情況(這樣就不會拋出異常了),例如在 ECMAScript 中,0 除以 0 并不會報錯,而是會返回 NaN,因此不會影響其他代碼的執行。在這里有一點需要注意的是,并不是任意數值除以 0 都會返回 NaN 的,例如:
alert(0 / 0); // "NaN" alert(1 / 0); // "Infinity" alert(-1 / 0); // "-Infinity" alert(NaN / NaN); //"NaN"
由上可知,當正數除以 0 的時候,返回的是 Infinity,當負數除以 0 的時候,返回的是 -Infinity,只有 NaN 或者 0 初除以 0 的時候返回的才是 NaN。
NaN 有兩個特點,首先,任何涉及 NaN 的操作都會返回 NaN;其次,NaN 與任何值都不相等,包括 NaN 本身。例如下面代碼會返回 false:
alert(NaN = NaN); // false
為了判斷某個數值是否是「非數值」,ECMAScript 定義了 isNaN() 函數,該函數接受一個任意類型的參數,如果這個參數是 NaN,則返回 true,如果不是 NaN,則返回 false,例如:
alert(isNaN(NaN)); // true alert(isNaN(10)); // false(10 是一個數值) alert(isNaN("10")); // false(可以被轉換成數值 10) alert(isNaN("blue")); // true(不能轉換成數值) alert(isNaN(true)); // false(可以被轉換成數值 1)
由上可知,如果一個參數不能被轉換成數值,則 isNaN() 函數會返回 true。
值得一提的是,isNaN() 函數同樣適用于對象,在對對象調用 isNaN() 時,會首先調用對象的 valueOf() 方法試圖把對象轉換為數值,如果不能轉換為數值,則基于這個對象再調用 toString() 方法,在測試返回的值。
2.5.4 數值轉換可以把非數值轉換成數值的函數有 3 個,分別是 Number()、 parseInt() 和 parseFloat()。其中 Number() 適用于任何數據類型,另外兩個則專門用于把字符串轉換成數值。
Number() 函數的轉換規則如下:
如果是 Boolean 值,true 和 false 將分別被轉換為 1 和 0。
如果是數字值,只是簡單的傳入和返回。
如果是 null 值,返回 0。
如果是 undefined,返回 NaN。
如果是字符串,遵循下列規則:
如果字符串中只包含數字(包括前面帶正號或負號的情況),則將其轉換為十進制數值,即"1"會變成 1,"123"會變成 123,而"011"會變成 11(注意:前導的零被忽略了);
如果字符串中包含有效的浮點格式,如"1.1",則將其轉換為對應的浮點數值(同樣,也會忽略前導零);
如果字符串中包含有效的十六進制格式,例如"0xf",則將其轉換為相同大小的十進制整數值;
如果字符串是空的(不包含任何字符),則將其轉換為 0;
如果字符串中包含除上述格式之外的字符,則將其轉換為 NaN。
如果是對象,則調用對象的 valueOf()方法,然后依照前面的規則轉換返回的值。如果轉換的結果是 NaN,則調用對象的 toString() 方法,然后再次依照前面的規則轉換返回的字符串值。
下面則是一些具體的例子:
var num1 = Number("Hello world!"); //NaN var num2 = Number(""); //0 var num3 = Number("000011"); //11 var num4 = Number(true); //1
parseInt() 的轉換規則如下:
var num1 = parseInt("1234blue"); // 1234 var num2 = parseInt(""); // NaN var num3 = parseInt("0xA"); // 10(十六進制數) var num4 = parseInt(22.5); // 22 var num5 = parseInt("070"); // 56(八進制數) var num6 = parseInt("70"); // 70(十進制數) var num7 = parseInt("0xf"); // 15(十六進制數)
parseInt() 在轉換字符串的時候會忽略字符串前面的空格,直到找到第一個非空格字符,如果第一個字符不是數字字符或者負號,parseInt() 就會返回 NaN;如果第一個字符是數字字符,parseInt() 會繼續解析第二個字符,知道解析完所有后足字符或遇到了一個非數字字符。有一點應該注意的是 parseInt() 轉換空字符串時會返回一個 NaN,而 Number() 轉換一個空字符串則會返回數字 0。
parseInt() 默認解析的是十進制數,但也可以解析指定的進制,例如:
var num1 = parseInt("10", 2); //2 (按二進制解析) var num2 = parseInt("10", 8); //8 (按八進制解析) var num3 = parseInt("10", 10); //10 (按十進制解析) var num4 = parseInt("10", 16); //16 (按十六進制解析)
parseInt() 可以接受第二個參數,第二個參數只能是 2、 8、 10 和 16,分別對應相應的進制。為了避免錯誤,當我們用 parseInt() 轉換數值時指定相應的進制是非常有必要的。
parseFloat() 的轉換規則如下:
var num3 = parseFloat("22.5"); //22.5 var num4 = parseFloat("22.34.5"); //22.34 var num5 = parseFloat("0908.5"); //908.5 var num6 = parseFloat("3.125e7"); //31250000
與 parseInt() 類似,parseFloat() 也是從第一個字符開始解析每個字符,一直解析到字符串的末尾,或者解析到一個無效浮點數字字符為止。與 parseInt() 不同的是,parseFloat() 解析到的第一個小數點是有效的,而第二個小數點則無效,因此它后面的字符串也將被忽略。與 parseInt() 第二個不同的是 parseFloat() 會始終忽略第一個 0。
還有一點需要注意的是,如果字符串包含的是一個可解析為整數的數(沒有小數點,或者小數點后都是零),parseFloat() 會返回整數:
var num1 = parseFloat("1234blue"); //1234 (整數) var num2 = parseFloat("1234.000"); //1234 (整數)
parseFloat() 只解析十進制數,所以它不接受第二個參數,這也是為什么 parseFloat() 始終會把十六進制的數值轉換成 0 的原因:
var num2 = parseFloat("0xA"); // 02.6 String 類型
String 類型表示字符串,可以由雙引號("")或單引號("")表示,所以下面這兩種字符串都是有效的:
var firstName = "Clear"; var lastName = "Design";
但有一點需要注意的是,以什么引號開頭就必須以什么引號結尾,比如下面這種寫法就是錯誤的:
var name = "Clear Design";2.6.1 字符字面量
String 數據類型包含一些特殊的字符字面量,也叫轉義序列,如下:
字面量 | 含義 |
---|---|
換行 | |
制表 | |
空格 | |
回車 | |
f | 進紙 |
斜杠 | |
" | 單引號("),在用單引號表示的字符串中使用。例如:"He said, "hey."" |
" | 雙引號("),在用雙引號表示的字符串中使用。例如:"He said, "hey."" |
xnn | 以十六進制代碼nn表示的一個字符(其中n為0~F)。例如,x41表示"A" |
unnnn | 以十六進制代碼nnnn表示的一個Unicode字符(其中n為0~F)。例如,u03a3表示希臘字符Σ |
ECMAScript 中的字符串是不可變的,字符串一旦創建,它們的值就不能改變。要改變某個變量保存的字符串,首先要銷毀原來的字符串,然后再用另一個包含新值的字符串填充該變量,例如:
var lang = "Java"; lang = lang + "Script";
上面的 lang 開始時包含 "Java",而第二行代碼把 lang 重新定義為 "Java" 和 "Script" 的組合,即 "JavaScript"。第二行代碼并不是把原來的 lang 的值改變了,而是首先創建一個能容納 10 個字符的新字符串,然后在這個字符串中填充 "Java" 和 "Script",由于新的字符串拼接完成后,原來的字符串已經沒有用了,所以原來的字符串 "Java" 和 "Script" 會被銷毀,這些都是發生在后臺的。
2.6.3 轉換為字符串前面提到 Number 數據類型的時候有提到 parseInt() 和 parseFloat() 兩個函數,這兩個函數的作用是將可轉換成數值的字符串轉換成數值,而 String 數據類型同樣也提供了一個 toString() 函數,它的作用是把可轉換為字符串的數據類型轉換成字符串:
var age = 22; var ageAsString = age.toString(); // "22" var found = true; var foundAsString = found.toString(); // "true"
Number、 Boolean、 Object 和 String(沒錯,String 本身也具有 toString() 方法,該方法返回該字符串的一個副本)都有 toString() 方法,但 Null 和 Undefined 沒有這個方法。
toString() 方法接受一個參數,參數只能是 2、 8、 10 和 16,分別對應相應的進制。例如:
var num = 10; alert(num.toString()); // "10" alert(num.toString(2)); // "1010" alert(num.toString(8)); // "12" alert(num.toString(10)); // "10" alert(num.toString(16)); // "a"
默認情況(沒有傳入參數)下 toString() 方法以十進制格式返回數值的字符串表示。在不知道傳入的值是不是 Null 或 Undefined 的時候,可以使用 String() 轉型函數,該函數支持把任意數據類型的值轉換為字符串,String() 函數的轉換規則如下:
如果值有 toString() 方法,則調用該方法(沒有參數)并返回相應的結果;
如果值是 null,則返回 "null";
如果值是 undefined,則返回 "undefined"。
下面再看幾個例子:
var value1 = 10; var value2 = true; var value3 = null; var value4; alert(String(value1)); // "10" alert(String(value2)); // "true" alert(String(value3)); // "null" alert(String(value4)); // "undefined"2.7 Object 類型
Object 類型是 ECMAScript 中 6 種數據類型中唯一一種復雜數據類型,簡單的說的話 ECMAScript 中對象就是一組數據和功能的集合。創建對象的方法有很多,這里說一下比較常用的一種方法,就是通過執行 new 操作符后跟要創建的對象類型的名稱來創建:
var o = new Object();
在了解對象之前,首先要先理解一個重要的思想:在 ECMAScript 中,Object 類型是所有它的實例的基礎。也就是說,Object 類型所具有的任何屬性和方法也同樣存在于更具體的對象中。
Object 的每個實例都具有下列屬性和方法:
constructor:保存著用于創建當前對象的函數。對于前面的例子而言,構造函數(constructor)就是 Object()。
hasOwnProperty(propertyName):用于檢查給定的屬性在當前對象實例中(而不是在實例的原型中)是否存在。其中,作為參數的屬性名(propertyName)必須以字符串形式指定(例如:o.hasOwnProperty("name"))。
isPrototypeOf(object):用于檢查傳入的對象是否是傳入對象的原型(第 5 章將討論原型)。
propertyIsEnumerable(propertyName):用于檢查給定的屬性是否能夠使用 for-in 語句
(本章后面將會討論)來枚舉。與 hasOwnProperty() 方法一樣,作為參數的屬性名必須以字符串形式指定。
toLocaleString():返回對象的字符串表示,該字符串與執行環境的地區對應。
toString():返回對象的字符串表示。
valueOf():返回對象的字符串、數值或布爾值表示。通常與 toString() 方法的返回值相同。
在 ECMAScript 中,Object 是所有對象的基礎,也是 ECMAScript 中需要掌握的重點,所以筆者將在后面的學習筆記中詳細地對 Object 進行總結,這里就先了解一些 Object 類型的基本概念的方法。
2.8 總結以上部分主要是筆者對 ECMAScript 中的一些基本概念的簡單總結,本篇主要寫的還是在進一步學習 ECMAScript 中需要了解的一些基本且重要的概念。
如有寫的不好的地方還請多指出討論。
原文地址:http://www.cleardesign.me/javascript-study-note-1
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/85862.html
摘要:開發篇版本管理工具,無腦的視圖操作,功能強大并且支持多賬號點我跳轉網站篇學習最重要的是經常百度,要始終堅信著你的水平能遇到的坑,別人都幫你踩過了。另外就是開發過程多看文檔,很多問題文檔都會有相關的解決方案,多看幾次就能想到解決方法。 IDE篇 程序員最重要的的就是IDE了,一個好的IDE可以幫你省略大量的時間,以及少生很多悶氣,下面開始前端的IDE推薦: VSCode 最推薦的IDE...
摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復雜性。異步編程入門的全稱是前端經典面試題從輸入到頁面加載發生了什么這是一篇開發的科普類文章,涉及到優化等多個方面。 TypeScript 入門教程 從 JavaScript 程序員的角度總結思考,循序漸進的理解 TypeScript。 網絡基礎知識之 HTTP 協議 詳細介紹 HTT...
摘要:特意對前端學習資源做一個匯總,方便自己學習查閱參考,和好友們共同進步。 特意對前端學習資源做一個匯總,方便自己學習查閱參考,和好友們共同進步。 本以為自己收藏的站點多,可以很快搞定,沒想到一入匯總深似海。還有很多不足&遺漏的地方,歡迎補充。有錯誤的地方,還請斧正... 托管: welcome to git,歡迎交流,感謝star 有好友反應和斧正,會及時更新,平時業務工作時也會不定期更...
摘要:前言月份開始出沒社區,現在差不多月了,按照工作的說法,就是差不多過了三個月的試用期,準備轉正了一般來說,差不多到了轉正的時候,會進行總結或者分享會議那么今天我就把看過的一些學習資源主要是博客,博文推薦分享給大家。 1.前言 6月份開始出沒社區,現在差不多9月了,按照工作的說法,就是差不多過了三個月的試用期,準備轉正了!一般來說,差不多到了轉正的時候,會進行總結或者分享會議!那么今天我就...
閱讀 766·2023-04-25 17:33
閱讀 3626·2021-07-29 14:49
閱讀 2480·2019-08-30 15:53
閱讀 3435·2019-08-29 16:27
閱讀 2000·2019-08-29 16:11
閱讀 1030·2019-08-29 14:17
閱讀 2432·2019-08-29 13:47
閱讀 2016·2019-08-29 13:28