javascript學習筆記(一)基礎知識,javascript學習筆記
基本概念
javascript是一門解釋型的語言,瀏覽器充當解譯器。js執行引擎並不是一行一行的執行,而是一段一段的分析執行。
延遲指令碼
HTML4.0.1中定義了defer屬性,它的用途是表明指令碼在執行時不會影響頁面的構造。也就是說,指令碼會延遲到整個頁面都解析完畢後再執行。因此,在<script>元素中設定defer屬性,相當於告訴瀏覽器立即下載,但順延強制。在XHTML文檔中,要把defer屬性設定為defer=“defer"
非同步指令碼
html5為<script>定義了async屬性。整個屬性與defer屬性類似,都用於改變處理指令碼的行為。同樣,與defer類似,async只適用於外部指令檔,並告訴瀏覽器立即下載檔案。但與defer不同的是,標記為async的指令碼並不保證按照指定他們的先後順序執行。
指定async的目的是不讓頁面等待指令檔下載和執行,從而非同步載入頁面其他內容。因此,建議非同步指令碼不要再載入期間操作DOM
區分大小寫
ECMASCript中的一切(包括變數,函數名和操作符)都區分大小寫。
1. JScript 的變數
變數在第一次用到時就設定於記憶體中,便於後來在指令碼中引用。使用變數之前先進行聲明。可以使用 var 關鍵字來進行變數聲明。
var count, amount, level; // 用單個 var 關鍵字聲明的多個聲明。
變數命名
變數名包括全域變數,局部變數,類變數,函數參數等等,他們都屬於這一類。
變數命名都以類型首碼+有意義的單片語成,用駝峰式命名法增加變數和函式的可讀性。例如:sUserName,nCount。
首碼規範:
每個局部變數都需要有一個類型首碼,按照類型可以分為:
s:表示字串。例如:sName,sHtml;n:表示數字。例如:nPage,nTotal;b:表示邏輯。例如:bChecked,bHasLogin;a:表示數組。例如:aList,aGroup;r:表示Regex。例如:rDomain,rEmail;f:表示函數。例如:fGetHtml,fInit;o:表示以上未涉及到的其他對象,例如:oButton,oDate;g:表示全域變數,例如:gUserName,gLoginTime;
JScript 是一種區分大小寫語言。建立合法的變數名稱應遵循如下規則:
注意第一個字元不能是數字。
後面可以跟任意字母或數字以及底線,但不能是空格
變數名稱一定不能是 保留字。
javascript是一種弱類型語言,JavaScript 會忽略多餘的空格。您可以向指令碼添加空格,來提高其可讀性。
var是javascript的保留字,表明接下來是變數說明,變數名是使用者自訂的標識符,變數之間用逗號分開。
如果聲明了一個變數但沒有對其賦值,該變數存在,其值為Jscript 值 undefined。
強制類型轉換
在 Jscript 中,可以對不同類型的值執行運算,不必擔心 JScript 解譯器產生異常。相反,JScript 解譯器自動將資料類型之一改變(強制轉換)為另一種資料類型,然後執行運算。例如:
運算 結果數值與字串相加 將數值強制轉換為字串。布爾值與字串相加 將布爾值強制轉換為字串。數值與布爾值相加 將布爾值強制轉換為數值。
要想顯式地將字串轉換為整數,使用 parseInt 方法。要想顯式地將字串轉換為數字,使用 parseFloat 方法。
JavaScript 變數的生存期:當您在函數內聲明了一個變數後,就只能在該函數中訪問該變數。當退出該函數後,這個變數會被撤銷。這種變數稱為本地變數。您可以在不同的函數中使用名稱相同的本地變數,這是因為只有聲明過變數的函數能夠識別其中的每個變數。
如果您在函數之外聲明了一個變數,則頁面上的所有函數都可以訪問該變數。這些變數的生存期從聲明它們之後開始,在頁面關閉時結束。
js變數思維導圖
2.js的資料類型
jscript 有三種->主要資料類型、兩種->複合資料型別和兩種->特殊資料類型。
主要(基本)資料類型
字串數值布爾
複合(引用)資料類型
對象數組
特殊資料類型
Null`Undefined`
字串資料型別:字串資料型別用來表示 JScript 中的文本。在js中,雖然雙引號("")和單引號('')均可表示字串,而且它們幾乎沒有任何區別。但只使用雙引號("")來表示字串被認為是最佳的。
一個字串值是排在一起的一串零或零以上的 Unicode 字元(字母、數字和標點符號)。
什麼是Unicode?
Unicode為每個字元都提供了唯一的數值,不管是什麼平台、什麼程式或什麼語言。開發unicode是為了給處理世界上存在的所有字元提供統一的編碼。
數值資料類型
我們需要明白一點,JScript 內部將所有的數值表示為浮點值,因此,在 Jscript 中整數和浮點值沒有差別。
Boolean資料類型
布爾(邏輯)只能有兩個值:true 或 false。
js數組和對象
詳情看我這篇文章->javascript學習總結— —數組和對象部分
Null 資料類型:可以通過給一個變數賦 null 值來清除變數的內容。
Jscript中 typeof 運算子將報告 null 值為 Object 類型,而非類型 null。
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title></title> <script type="text/javascript"> alert(typeof null); </script></head><body></body></html>
null用來表示尚未存在的對象,常用來表示函數企圖返回一個不存在的對象。
Undefined 資料類型:
如下情況將返回 undefined 值:
對象屬性不存在,聲明了變數但從未賦值。
null和undefined的區別
alert(typeof undefined); //output "undefined" alert(typeof null); //output "object" alert(null == undefined); //output "true"
ECMAScript認為undefined是從null派生出來的,所以把它們定義為相等的。
alert(null === undefined); //output "false" alert(typeof null == typeof undefined); //output "false"
null與undefined的類型是不一樣的,所以輸出"false"。而===代表絕對等於,在這裡null === undefined輸出false
另外,這裡介紹一種比較重要的資料類型——引用資料類型
引用資料類型
javascript引用資料類型是儲存在堆記憶體中的對象,JavaScript不允許直接存取堆記憶體空間中的位置和操作堆記憶體空間,只能通過操作對象在棧記憶體中的引用地址。所以參考型別的資料,在棧記憶體中儲存的實際上是對象在堆記憶體中的引用地址。通過這個引用地址可以快速尋找到儲存在堆記憶體中的對象。
下面我們來示範這個引用資料類型賦值過程
自然,給obj2添加name屬性,實際上是給堆記憶體中的對象添加了name屬性,obj2和obj1在棧記憶體中儲存的只是堆記憶體對象的引用地址,雖然也是拷貝了一份,但指向的對象卻是同一個。故而改變obj2引起了obj1的改變。
基本類型值指的是那些儲存在棧記憶體中的簡單資料區段,即這種值完全儲存在記憶體中的一個位置。
而參考型別值則是指那些儲存在堆記憶體中的對象,即變數中儲存的實際上只是一個指標,這個指標指向記憶體中的另一個位置,該位置儲存對象。
簡而言之,堆記憶體存放引用值,棧記憶體存放固定類型值。
在 ECMAScript 中,變數可以存在兩種類型的值,即原始值和引用值。
原始值儲存在棧(stack)中的簡單資料區段,也就是說,它們的值直接儲存在變數訪問的位置。引用值儲存在堆(heap)中的對象,也就是說,儲存在變數處的值是一個指標(point),指向儲存物件的記憶體處。
<script type="text/javascript”>var box = new Object(); //建立一個參考型別var box = "lee"; //基本類型值是字串box.age = 23; //基本類型值添加屬性很怪異,因為只有對象才可以添加屬性。alert(box.age); //不是參考型別,無法輸出;</script>
3.JScript 的運算子
優先順序:指運算子的運算順序,通俗的說就是先計算哪一部分。
結合性:同一優先順序運算子的計算順序,通俗的說就是從哪個方向算起,是左到右還是右到左。
資料類型轉換
String() 轉換為字串類型
Number() 轉換為數字類型
Boolean() 轉換為布爾類型
parseInt:將字串轉換為整數。從字串的開頭開始解析,在第一個非整數的位置停止解析,並返回前面讀到所有的整數。如果字串不是以整數開頭的,將返回NaN。如:parseInt(“150 hi”)返回的值是:150,parseInt("hi")返回的值是:NaN。
parseFloat:將字串轉換為浮點數。 從字串的開頭開始解析,在第一個非整數的位置停止解析,並返回前面讀到所有的整數。如果字串不是以整數開頭的,將返回NaN。如:parseFloat("15.5 hi") 返回的值是:15.5,parseFloat("hi 15.5")返回的值是:NaN。
eval:將字串作為javascript運算式進行計算,並返回執行結果,如果沒有結果則返回undefined。
4.js流程式控制制
對於js流程式控制制語句,這裡只講幾個比較難懂的。其他不贅述。等下附上一張思維導圖。
1.for...in 語句對應於一個對象的每個,或一個數組的每個元素,執行一個或多個語句。
for (variable in [object | array])statements
參數:
variable:必選項。一個變數,它可以是 object 的任一屬性或 array 的任一元素。
object, array:可選項。要在其上遍曆的對象或數組。
statement:可選項。相對於 object 的每個屬性或 array 的每個元素,都要被執行的一個或多個語句。可以是複合陳述式。
雖然條件控制語句(如if語句)只在執行多條語句的情況下才要求使用代碼塊(左花括弧"{"開頭,右花括弧"}"結尾),但最佳實務是始終使用代碼塊。
if(args) alert(args);//容易出錯if(args){ alert(args);//推薦使用}
js流程式控制制語句思維導圖
5.js函數
函數是由事件驅動的或者當它被調用時執行的可重複使用的代碼塊。
Jscript 支援兩種函數:一類是語言內部的函數,另一類是自己建立的。
JavaScript 函數允許沒有參數(但包含參數的小括弧不能省略),也可以向函數傳遞參數供函數使用。