js中常常容易忘記的基本概念

靜逸發表於2015-05-09
JS

javascript組成部分

一個完整的javascript實現應該由三個不同的部分組成：核心（ECMAScript）、文件物件模型（DOM）、瀏覽器物件模型（BOM） Web瀏覽器只是ECMAScript實現可能的宿主環境之一。宿主環境不僅提供基本的ECMAScript實現，同時也會提供該語言的擴充套件，以便言語和環境之間對接互動。

ECMAScript語言郵下列組成：語法、型別、語句、關鍵字、保留字、操作符、物件 文件物件模型（DOM）：提供訪問和操作網頁內容的方法和介面 瀏覽器物件模型（BOM）提供與瀏覽器互動的方法與介面

javascript基本常識

1：javascirpt是嚴格區分大小寫的。

2：javascript（識別符號）命名規則：第一個字元必須是一個字母、下劃線、美元符號，其它字元可以是字母、下劃線、美元符號或數字

3：ECMAScript識別符號采用駝峰大小寫格式，也就是第一個字母小寫，剩下的每個單詞的首字母大寫。（但是沒有誰強制要求這個格式）

4：

//單行註釋
/*
*這是多行註釋
*/

5：每條語句最好用一個分號結尾，但是也可以省略分號。

6：

if (test)
alert(test); //有效但容易出錯，最好不要使用

if (test) {
alert(test);//推薦使用
}

7:var obj; 像這樣未經過初始化的變數會儲存一個特殊的值undefined

8:obj=100 這樣雖然有效，但不推薦，這樣相當於宣告瞭一個全域性變數

9：ECMAScript有5種簡單資料型別：Undefined,Null,Boolean,Number和String

　　1種複雜資料型別Object

10:typeof操作符　

var message = 'message';
typeof message
typeof(message)

11：Undefined型別只有一個值，即特殊的undefined

12:

var message;
alert(message)//undefined
alert(age);//報錯啦

13:最好顯示的初始化變數，這樣的話當typeof操作符返回undefined值時，我們就知道被檢測的變數沒有被宣告，而不是尚未初始化

　　因為沒有宣告的變數用typeof操作符就會直接返回undefined

14要將一個值轉換為其對應的Boolean值，可以呼叫轉型函式Boolean()

15Number型別：八進位制字面值的第一位必須是零，十六進位制的字面值的前兩位必須是Ox

　　浮點婁可以這樣：var floatNum = .1;但是不推薦這樣使用

　　如果浮點數小數點後面沒有任何數字，那個這個數值就可以被作為整數值來儲存，同樣，如果浮點數本身就表示一個整數（如1.0）那麼該值也會被轉換為整數

14：Number.MAX_VALUE整數的最大值

　　Number.MIN_VALUE整數的最小值

　　如果計算得到一個超出javascript數值範圍的值，那麼這個數值自動轉換為特殊的Infinity,如果某次返回正的或負的Infinity值，那麼該值將無法繼續參與下一次計算

　　要想確定一個數值是不是有窮的，可以使用isFinite()函式

　　訪問Number.NEGATIVE_INFINITY和Number.POSITIVE_INFINITY可以得到正和負的Infinity的值，所以其實這兩個屬性分別儲存著-Infinity和Infinity

15NaN特點：1任何涉及到NaN的操作都會返回NaN，2NaN與任何值都不相等，其中包括NaN本身 isNaN()這個函式接受一個引數，該引數可以是任何型別，而此函式會幫我們確定這個引數是否“不是數值”

16parseInt能夠各種整數格式

Number(789)//不能轉換789Yun
parseInt("789Yun");
parseInt("0xa313", 16);//有基數設定 也可以轉換八進位制
parseInt(""); //NaN

parseFloat只解析十進位制值，因此它沒有用第二個引數指定基數的用法

parseFloat解析字串，如果此字串包含一個可解析為整數的數（沒有小數點或者小數點後面全部都是零） parseFloat()會返回整數

parseFloat("32.32")

17用雙引號表示的字串和用單引號表示的字串完全相同，任何字串長度都可以通過其length屬性取得

　　轉換為字串方法toString(),數值、布林值、物件和字串都有些方法，但null和undefined值沒有此方法

　　toString()如果是數值呼叫的話，還可以傳遞基數 eg:var a = 123; a.toString(16);

　　在不知道值為null或undefined值時，可以使用轉型函式String()，這個函式能夠將任何型別的值轉換為字串，String()函式遵循轉換規則：1如果值有toString()方法，則呼叫該方法（沒有引數）返回相應的結果2如果值是null則返回"null"3如果值為undefined則返回"undefined"

18ECMAScript中的物件其實就是一組資料和功能的集合。在ECMAScript中，如果不能建構函式傳遞引數，則可以省略後面的那一對圓括號

如下所示

var obj = new Object();
var obj = new Object;

19Object的每個例項都具有下列屬性和方法

　　constructor儲存著用於建立當前物件的函式

　　hasOwnProperty(propertyName)用於檢查給定的屬性在當前物件例項中（而不是在例項的原型中）是否存在

　　isPrototypeOf(object)用於檢查傳入的物件是否是另一個物件的原型

　　propertyIsEnumerable(propertyName)用於檢查給定的屬性是否能夠使用for-in語句

20with語句：　

with (location) {
var qs = search.substring(1);
var hostName = hostname;
var url = href;
}

21switch

var num = 25;
switch (true) {
case num < 0: alert('less than 0'); break;
case num >= 0 && num <= 10: alert('between 0 and 10'); break;
case num > 10 && num <= 20: alert('between 10 and 20'); break;
default: alert('more than 20');
}

switch語句在比較值時使用的是全等操作符，因此不會發生型別轉換

22函式中return語句之後的任何程式碼都永遠不會執行

　return 語句也可以不帶有任何返回值，這種情況 下，函式在停止執行後將返回undefined值　

23通過arguments物件的length屬性可以獲得有多少個引數傳遞給了函式，沒有傳遞值的命名引數將自動被賦予undefined值（ECMAScript中的所有引數傳遞的都是值，不可能通過引用傳遞引數）

24ECMAScript函式沒有過載

25與其它語言不同，ECMAScript沒有為整數和浮點數值分別定義不同的資料型別，Numer型別可用於表示所有數值

26ECMAScript中無須指定函式的返回值，因為任何ECMAScript函式都可以在任何時候返回任何值

27ECMAScript函式中函式引數是以一個包含零或多個值的陣列的形式傳遞的

28可以向ECMAScript函式傳遞任意數量的引數，並且可以通過arguments物件來訪問這些引數

在html中使用javascript

script屬性：

charset：表示通過src屬性指定的程式碼的字符集

defer:表示指令碼可以延遲到文件完全被解析和顯示之後再執行

包含在script元素內部的javascript程式碼將從上到下依次解釋

在javascript程式碼的任何地方不要出現“</script>”字串，因為按照解析嵌入式程式碼的規則，當瀏覽器遇到字串“</script>”時，就會認為那是結束的</script>標籤，而通過把這個字串分隔為兩部分可解決這個問題

外部javascript檔案帶有js副檔名，但這個副檔名不是必需的，因為瀏覽器 不會檢查包含javascript的檔案的副檔名

帶有src屬性的<script>元素不應該在其<script>標籤與</script>標籤之間再包含額外的javascript程式碼

另外通過<script>元素的src屬性還可以包含來自外部域的javascript檔案

瀏覽器會按照<script>元素在頁面中出現的先後順序對它們依次進行解析

一般都把全部的javascript引用放在body元素中，放在頁面的內容後面。

<script>標籤定義了defer屬性，表明指令碼在掛靠時不會影響頁面的構造，也就是說指令碼會被延遲到整個頁面都解析完畢後再執行，因為在<script>元素中設定defer屬性（ defer="defer" ），實際上與把script引用放到頁面最底部的效果是一樣的。（但是現在只有IE和Firefox3.1是目前唯一支援defer屬性的主流瀏覽器）

XHTML（Extensible Hypertext Markup Language）

編寫XHTML程式碼的要比編寫html嚴格很多

CData片段是文件中的一個特殊區域，這個區域中可以包含不需要解析的任何格式的文字內容，因此在在html中可以出現的小於號 加上了CData片段後也可以在XHTML文件中正常執行了

如下所示：

<![CDATA[
function compare(a, b) {
if (a < b) {
alert('A is less than B');
} else {
if (a > b) {
alert('A is greater than B');
} else {
alert('A is equal to B');
}
}
}
]]>

 

在相容XHTML的瀏覽器，這個方法可以解決問題，但是實際上，還有不少瀏覽器不相容XHTML，因為不支援CData片段，再使用javascipt註釋將CData標記註釋掉就行了

如下所示：

//<![CDATA[
function compare(a, b) {
if (a < b) {
alert('A is less than B');
} else {
if (a > b) {
alert('A is greater than B');
} else {
alert('A is equal to B');
}
}
}
//]]>

 

讓不支援<script>元素的瀏覽器能夠隱藏嵌入的javascript程式碼， 這個方案就是把javascript程式碼包含在一個html註釋中，

如下所示

<!--
function sayHi() {
alert('Hi');
}
//-->

 

其實作用外部檔案比嵌入程式碼的優勢主要體現在可維護性及可快取（如果兩個頁面都作用同一個外部檔案的話，那麼這個檔案只須下載一次）這兩方面

文件模式：混雜模式與標準模式

<noscript>元素中的內容只有在瀏覽器不支援指令碼或者瀏覽器支援指令碼但指令碼被禁用。瀏覽器支援指令碼，也啟用指令碼的情況下，不會出現noscript元素中的任何內容

eg:

<noscript>
<p>本頁面需要瀏覽器支援（啟用）JavaScript</p>
</noscript>

 

相關文章