首頁 > 開發者 > JavaScript
1、什麼是JavaScript?
(1) HTML只是描述網頁長相的標記語言，沒有計算，判斷能力，如果所有計算，判斷(比如判斷文字框是否為空白，判斷兩次密碼是否輸入一致)店鋪放到伺服器端執行的話網頁的頁面會非常的慢，用起來也很難用，對伺服器的壓力也很大，因此要求能在瀏覽器中執行一些簡單的運算，判斷，JavaScript就是一種在瀏覽器端執行的語言。
(2) JavaScript和Java沒有直接的關係，唯一的關係就是JavaScript原名LiveScript，後來吸取了Java的一些特性，升級為JavaScript，JavaScript有時被簡稱為JS。
(3) JavaScript是解釋性語言，無需編譯就可以隨時執行，這樣哪怕文法有錯誤，沒有語法錯誤的部分還是能夠正確的執行。
JS的開發環境
(1) VS中JavaScript，Jqery的自動完成功能。
(2) JS是非常靈活的動態語言，不像C#等靜態語言那樣嚴謹。
JS入門
(1)
(2) JavaScript代碼放到<script>標籤中，<script>可以放到<head>,<body>等任意位置，而且可以有不止一個<script>標籤。alert函數是彈出訊息視窗，new Date()是建立一個Date類的對象，預設值就是當前的時間。
(3) 放到<head>中的<script>在body載入之前就已經運行了，寫在body中的<script>是隨著頁面的載入而一個個的執行的。
(4) 除了可以再頁面中聲明JavaScript之外，還可以將JavaScript寫在單獨的JS檔案中，然後在頁面中引入：<script src=”common.js” type=”text/javascript”></script>。聲明到單獨的JS檔案的好處是多頁面也可以共用，減少網路流量。
事件
(1) <a href="javascript:alert('Hello')">點擊我</a>
<a href="javascript:void(0)">我就不彈出東西</a><br />
<a href="JSoop.htm" onclick="alert('您確認你要跳轉嗎？')">單擊我</a>
(2) JavaScript中也有事件的概念，當按鈕被點擊的時候
1) <input type="button" value="單擊我" onclick="alert('終於單擊我了')" />
2) 只有超連結的href中的JavaScript中才需要”JavaScript:”，因為他不是事件，而是把”JavaScript:'看成像”http:”，”ftp:”，”thunder://”，ed2k://，mailto://一樣的網路通訊協定，交由JS解析引擎處理，只有href中這一個特列。
JS變數
(1) JavaScript中既可以使用雙引號聲明字串，也可以使用單引號聲明字串，主要是方便和HTML整合，避免轉義符的麻煩。
(2) var i=10; //聲明一個變數，名字為i，指向10這個整數，一旦指向10，i就是int類型， alert(i);
(3) JavaScript中有null，underfined兩種，null表示變數的值為空白，underfined則表示變數還沒有指向任何的對象，未初始化。
(4) JavaScript是弱類型，表示變數的時候無法：int i=10.只能通過var i=10;聲明變數，和C#中的var不一樣，不是C#中的那樣的類型推斷。
(5) JavaScript中也可以不用var聲明變數，直接用，這樣的變數是”全域變數”，因此除非確實想用全域變數，否則使用的時候最好加上var。
(6) JS是動態類型的，因此var i=10;i=”abc”是合法的。
JavaScript
(1) 複製代碼 代碼如下:var sum = 0;
for (var i = 0; i <= 100; i++) {
sum = sum + i;
}
alert(sum);
(2) 如果JavaScript中的代碼有語法錯誤，瀏覽器會彈出報錯資訊，查看報錯資訊就能協助排查錯誤。
(3) JavaScript的調試，使用VS可以很方便的進行JavaScript的調試，調試時需要注意幾點：
1) IE的調試選項要開啟，Internet選項-進階，去掉”禁用指令碼調試”前的勾選。
2) 以調試方式運行介面。
3) 設定斷點，監視變數等操作和C#一樣。
判斷變數初始化
(1) JavaScript中判斷變數，參數是否初始化的三種方法。 複製代碼 代碼如下:var r;
if (r == null) { if (typeof (r) == "undefined") { if (!x) {
alert("null"); alert("undefined"); alert("不X");
}
}
}
註：推薦用最後一種方法
函數的聲明
(1) JavaScript中聲明函數的方法： 複製代碼 代碼如下:function Add(i1, i2) {
return i1 + i2;
}
(2) 不需要聲明傳回值類型，參數類型，函數定義以function開頭 複製代碼 代碼如下:var r = Add(10, 20);
alert(r);
var r = Add("tom，", "您好");
alert(r);
(3) JavaScript中不像C#中那樣要求所有路徑都有傳回值。
匿名函數
(1) 複製代碼 代碼如下:var f1 = function sum(i1, i2) {
return i1 + i2;
}
alert(f1(10, 20));
(2) 類似於C#中的匿名函數。
(3) 這種匿名的用法在Jquery中用法特別多。
(4) 複製代碼 代碼如下:alert(function sum(i1, i2) {
return i1 + i2;
} (100, 10));
註解：C#中匿名函數使用委託來調用。
JS物件導向基礎
(1) JavaScript中沒有類的文法，是用函數閉包(closure)類比出來的，下面講解的時候還是用C#中的類，建構函式等概念，JavaScript中string，date等”類”都被叫做”對象”，JavaScript中聲明類(類不是類，是對象)。
(2) 複製代碼 代碼如下:function Person(name, age) { //聲明一個函數，當成類用
this.Name = name;
this.Age = age;
this.SayHello = function () {
alert("你好，我是" + this.Name + ",我今年：" + this.Age + "歲了");
}
}
var p1 = new Person("韓迎龍", "23");
p1.SayHello();
(3) 必須要聲明類名，function Person(name,age)可以看做是聲明建構函式，Name,Age這些屬性也是使用者動態添加了。
Array()對象
(1) JavaScript中的Array對象就是數組，首先是一個動態數組，而且是一個像C#中數組ArrayList，Hashtable等的超強綜合體。
(2) 複製代碼 代碼如下:var names = new Array();
names[0] = "韓迎龍";
names[1] = "得到";
names[2] = "說的";
for (var i = 0; i < names.length; i++) {
alert(names[i]);
}
(3) 無需預先制定大小，動態。
Array()練習1
(1) Array練習，求出一個數組中的最大值。 複製代碼 代碼如下:<script type="text/javascript">
function MyMax(arr) {
var max = arr[0];
for (var i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i];
} }
return max;
}
var arr = new Array();
arr[0] = 20;
arr[1] = 10;
arr[2] = 34;
alert(MyMax(arr));
</script>
Array()練習2
(1) 將一個字串數組的元素的順序進行反轉，{3,9,5,34,54}{54,34.5.9.3}。不要使用JavaScript中的反轉函數，提示：第i個和第length-i-1進行交換，定義函數。 複製代碼 代碼如下:<script type="text/javascript">
function MyReverse(arr) {
for (var i = 0; i < arr.length / 2; i++) {
var temp = arr[i];
arr[i] = arr[arr.length - i - 1];
arr[arr.length - i - 1] = temp;
}
}
var arr = new Array();
arr[0] = "3";
arr[1] = "9";
arr[2] = "5";
arr[3] = "34";
arr[4] = "54";
alert(arr);
MyReverse(arr);
alert(arr);
Array()練習3
(1) 將一個字串數組輸出為|分割的形式，比如：韓迎龍|試試|訂單。不要使用JavaScript中的Join函數，arr.join(1)將數組用分割符連結成一個字串。 複製代碼 代碼如下:<script type="text/javascript">
function MyJoin(arr) {
if (arr.length <= 0) {
return;
}
var s = arr[0];
for (var i = 1; i < arr.length; i++) {
s = s + "|" + arr[i];
}
return s;
}
var arr = new Array();
arr[0] = "韓迎龍";
arr[1] = "試試";
arr[2] = "訂單";
alert(MyJoin(arr));
//第二種方法
alert(arr.join("|"));
</script>
Array的字典用法
(1) JS中的Array是一個寶貝，不僅是一個數組，還是一個Dictionary，還是一個Stack。
(2) 複製代碼 代碼如下:var names = new Array();
names["人"] = "ren";
names["扣"] = "kou";
names["手"] = "shou";
alert(names["人"]);
alert(names.人);
for (var k in names) {
alert(k);
}
(3) 像Hashtable,Dictionary那樣用，而且像他們一樣的效率高。
Array()的簡化聲明
(1) Array還可以有簡化的方式
var arr=[3,4,5,6,7]; //普通數組初始化
這種數組可以看做是names[“人”]=”ren”;的特例，也就是key為0,1,2,3,4,5
(2) 字典風格的簡化建立方式
var arr={”tom”=30,”jim=”30};
數組，for和其它
(1) 對於數組風格的Array來說，可以使用join方法拼接為字串。 複製代碼 代碼如下:var arr = ["tom", "jim", "kencery"];
alert(arr.join(",")); //JS中join是array的方法，不像.net中是string的方法
(2) for迴圈可以像C#中的foreach一樣的使用。 複製代碼 代碼如下:for (var e in document) {
alert(e);
}
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
