JavaScript語法
什么是腳本程序和JavaScript
?*什么是腳本程序
?<html>
?<script language="javascript">
??? alert(new Date());
?</script>
?</html>
?*JavaScript簡介
? 前身叫作Livescript,是一種基于對象(Object)和事件驅動(Event Driver),并具有安全性能的腳本語言.
?*JavaScript與Java
? 是兩個公司開發的兩個不同產品,作用與用途大不一樣,但兩者語法上有很多相似之處,JavaScript并不是
? Java的子集.
?*JavaScript,JScript與ECMAScript
?*腳本代碼的位置
? 我們可以把代碼放到<script></script>標簽之間:
? <script>
??? var x=3;
? </script>
? <p>This is a HTML 段落</p>
? <script>
??? alert(x);
? </script>
? 也可以放在一個單獨的文件中:
? <html>
? <script src="script.js" language="javascript">
?*將腳本程序代碼作為屬性值
? <a href="javascript:alert(new Data());">javascript</a>
? </html>
=======================================================================================
JavaScript的基本語法
?*JavaScript中的標識符
?標識符是指JavaScript中定義的符號,例如,變量名,函數名,數組名等.標識符可以由任意順序的
?大小寫字母,數字,下劃線(_)和美元符號($)組成,但標識符不能以數字開頭,不能是JavaScript
?中的保留關鍵字.
?合法的標識符舉例: indentifler,username,user_name,_username,$username
?非法的標識符舉例: int,98.3,Hello World
?*Java嚴格區分大小寫
?computer和Computer是兩個完全不同的標識符
?*JavaScript程序代碼格式
?每條功能語句的最后必須用分號(;)結束,每個詞之間用空格,制表符,換行符或大括號,小括號這樣
?的分隔符隔開.
?*JavaScript程序的注釋
?/*...*/中可以嵌套"http://"注釋,但不能嵌套"/"...."/".
================================================================================
基本數據類型與常量
?*正型常量
?十六進制以Ox或OX開頭,例如:Ox8a.八進制必須以O開頭,例如: 0123.十進制的第一位不能為0
?(數字0除外),例如: 123
?*字符常量
?12.32,123.42,5E7,4e5等.
?*布爾值
?true和false.
?*字符串常量
?例如: "a book of JavaScript",'abc',"a",""(空字符串) .
?特殊字符需要用反斜杠(\)來轉意.
?例如: \r, \n, \t, \b, \', \\
?在JavaScript中一個連續的字符串不能分開在兩行中來寫.可以使用"+"號連起來.
?*null常量
?表示變量的值為空
?*undefined常量
?表示一個變量還沒有被復值時的狀態,或某個對象的屬性不存在.
=========================================================================================
變量
?*定義一個變量,系統就會為之分配一塊內存,程序可以用變量名來表示這塊內存中的數據.
?*聲明變量用var關鍵字
?例如: var x; (這個時候就是undifeined)
?*聲明變量的同時為其賦值
?例如: var name="lisi";
?*對已賦值的變量賦于一個其他類型的數據
?例如: name=123;
?*不事先聲明變量而直接使用
?例如: x=1234;
算術運算符
?*+ 加法運算符或正值運算符,例如, x+5, +6.
? 它還能實現多個字符串的想加,也能將字符串與其他的數據類型連成一個新的字符串,條件
? 條件是該表達式中至少有一個字符串,例如: "x"+123的結果為"x123".
?*- 減法運算符或負預算符,例如, 7-3, -8.
?** 乘法運算符,例如, 3*7.
?*/ 除法運算符,例如 9/4.
?*% 求模運算符(算術中的求余),例如, 5%2
?*++將變量值加1后再將結果賦給這個變量,分為兩種,例如a++和++a
?*--用法與++預算符一樣
?
賦值運算符
?
? 賦值運算符的作用是將一個值賦給一個變量,最常用的是"=",還可以由"="運算符和其他的一些
? 預算符組合成新的運算符,例如:
? "+=","-="等.
比較運算符
? *>大于
?? 當左邊的操作數大于右邊的操作數時,返回true.
? *<小與
? *=
? *<=
? *>=
? *==
? *!=
? 注意: 不要把"=="寫成"="
邏輯運算符
?
? *&&
? 邏輯與,當左右兩邊的操作數都為true時,返回值為true,否則為false.
? *||
? 邏輯或,當左右兩邊的操作數都為false時,返回值為false,否則為true.
? *!
? 邏輯非,當操作數為ture的時,返回值為false,否則為true.
========================================================================
程序流程控制
?
?*順序結構
?*if條件選擇語句
?*switch選擇語句
?*while循環語句
?*do while語句
?*for循環語句
?*break與continue語句
?if條件語句語法1:
?if(條件語句)
?{
?? 執行語句塊
?}
?注意:if(x==null)或if(typeof(x)=="undefined")可以簡寫成if(!x)
?if條件語句語法2:
?if(條件語句)
?{
?? 執行語句塊1
?}
?else
?{
?? 執行語句塊2
?}
?變量=布爾表達式? 語句1 :語句2
?if條件語句語法3:
?if(條件語句)
?{
?? 執行語句塊1
?}
?else if(條件語句2)
?{
?? 執行語句塊2
?}
?....
?else if(條件語句塊n)
?{
?? 執行語句塊n
?}
?else
?{
?? 執行語句塊n+1
?}
?if語句塊的嵌套
?if(x<1)
?{
? if(y==1)
??? alert("x<1,y==1");
? else
??? alert("x<1,y!=1");
? }
? else if(x>10)
? {
??? if(y==1)
????? alert("x>10,y==1);
??? else
????? alert("x>10,y!=1");??
? }
===================================================================
函數
?
?*函數的作用與定義
?*全局變量與局部變量
?*參數個數可變的函數
?*創建動態函數
?*JavaScript中的系統函數
? 定義一個函數的語法如下:
? function 函數名 (參數列表)
? {
???? 程序代碼
???? return 表達式;
? }
? 對函數調用的幾種方式:
? 1.函數名(傳遞函數的參數1,傳遞給函數的參數2,.....)
? 2.變量=函數名(傳遞函數的參數1,傳遞給函數的參數2,.....)
? 3.對于有返回值的函數調用，也可以在程序中直接使用返回結果,例如:
? alert("sum="+square(2,3));
? 全局變量與局部變量，看下面的代碼:
? <script language="javascript">
?? var msg="全局變量";
?? function show()
?? {
????? msg="局部變量";
?? }
?? show();
?? alert(msg);
? </script>
? 參數個數可變的的函數:
?<script language="javascript">
? function testparams()
? {
??? var params="";
??? for(var i=0;i<arguments.length;i++)
??? {
????? params +=" "+ arguments[i];
??? }
??? alert(params);
? }
??? testparams("abc",123);
??? testparams(123,456,"abc");
?</script>
? 注意:arguments代表了傳遞給函數的所有參數的所有集合。當函數的個數不確定，
? 獲得參數個數很多，你又不想為每個參數定義一個變量，那么你就可以定義一個
? 像上面那個一樣的，定義一個為空的參數名，在內部用循環來實現。
?創建動態函數的語法:
?var varName=new Function(argument1,....,lastArgument);
?說明:
?所有的參數都必須是字符串型的,最后的參數必須是這個動態函數的功能程序代碼.
?例子:
?<script>
?? var square=new Function("x","y",
??????????? "var sum;sum=x*x+y*y; return sum;");
?? alert(square(3,2));
?</script>
?動態函數有什么作用,在什么情況下使用?
?
?JavaScript中的系統函數:
?.encodeURI方法(比URL的描述的范圍更大,一般情況下可以等同)
?返回一個URI字符串編碼后的效果。例如:
?<script language="javascript">
?? var uriStr=encodeURI("http://www.doit.org/index.html?country=中國&name=z x");
?? alert(uriStr);
?</script>
?.decodeURI方法
?將一個已編碼的URI字符串解碼成最初的字符串并返回.
?.parseInt方法
? 第一字符串按指定的進制轉換成一個整數，語法格式為：parseInt(numString,[redix])。
? 如果沒有指定第二個參數，則前綴為'Ox'的字符串被視為十六進制，前綴為'O'的字符串
? 被視為八進制，所有其他的字符串被視為十進制。
? 例如: alert(parseInt("123abc",10));
?.parseFloat方法
? 將一個字符串轉換為小數。
?.isNaN方法(用與檢測)
?.escape方法(用于對文本的簡單加密)
? 返回對一個字符串進行編碼后的結果字符串。所有空格，標點，重音符號以及任何其他
? ASCII字符都用%xx編碼替換，其中xx等于表示該字符的Unicode編碼的十六進制數，字符
? 值大于255字符以%uxxxx格式表示。
?.unescape方法
? 將一個用escape方法編碼的字符串解碼成原始字符串。
?.eval方法
? 將其中的參數字符串作為一個JavaScript表達式執行。
=======================================================================
? 對象
?*對象與對象實例
?*構造方法與this關鍵字的作用
?*在函數中修改參數值的問題
?對象與對象實例
?.對象中所包含的變量就是對象的屬性，對象中所包含的對屬性進行操作的函數就是對象的
? 方法，對象的屬性和方法都叫對象的成員。
?.對象是某一類事物的描述，是抽象的概念；而對象實例是一類事物中的具體個例。
?.能夠被用來創建對象實例的函數就是對象的構造函數，只要定義一個對象的構造函數，就
? 等于被定義了一個對象。使用new關鍵字和對象的構造函數就可以創建對象實例，語法格式
? 如下: var ObjectInstance = new ObjName(傳遞給該對象的實際參數列表)。
? <script language="javascript">
? function Person()
? {
??? //這是一個構造函數
? }
? var person1 = new Person();? //創建了一個實例變量(對象實例)
? person1.age = 18;
? person1.name = "blovesaga"; //age和name為對象屬性
? //alert(person1.name+"."+person1.age);
? function sayFunc()
? {
??? alert(person1.name+"."+person1.age);//我們也可以使用person["age"](對象實例["成員變量"])來訪問
? }
? person1.say=sayFunc;? //把方法名賦值給了person1.say成員，我們可以在其他地方像
??????????????????????? //調用方法一樣來調用
? person1.say();
? </script>
看下面的例子:
<html>
?<script language="javascript">
?? //定義一個構造函數,也就是對象的名稱為person
?? function Person()
?? {
?? }
?? //創建一個對象實例
?? var person1=new Person();
?? person1.age=18;
?? person1.name="zxy";
?? //編寫一個成員方法
?? function sayFunc()
?? {
????? var x="name";
????? eval("alert(person1."+ x + ");");? //這個字符串中的內容將被作為JavaScipt代碼來執行
????? alert(person1.name+":"+person1.age);
?? }
?? person1.say=sayFunc; //把方法名賦值給了person1.say成員
?? person1.say=sayFunc(); //寫了括號表示執行sayFunc()函數在復值
?? person1.say();
?</script>
</html>
===================================================================
構造方法與this關鍵字
?.為一個對象實例新增加的屬性和方法，不會增加到同一個對象所產生的其它對象實例上。
?.所有的實例對象在創建都會自動調用構造函數，在構造函數中增加的屬性和方法會被
? 增加到每個對象實例上。
?.對象實例是使用new關鍵字創建的，在構造方法中不要有返回結果的return語句。
?.調用對象的成員方法時，需要使用“對象實例.成員方法"的形式，很顯然，用作成
? 員方法的函數被調用，一定伴隨有某個對象實例。this關鍵字代表某個成員方法執行時
?? ，引用該方法的當前對象實例，所以，this關鍵字一般只在用作對象成員方法的
? 函數中出現。
? <script language="javascript">
?? function Person(name,age)
?? {
???? this.age=age;
???? this.name=name;
???? this.say=sayFunc;
?? }
?? function sayFunc()
?? {
????? alert(this.name+":"+this.age);
?? }
?? var person1=new Person("張山",18);
?? person1.say();
?? var person2 = new Person("里四",30);
?? person2.say();
? </script>
例子代碼:
<html>
?<script language="javascript">
?? //定義一個構造函數
?? function Person(name,age)
?? {
???? this.name=name;//當前的對象實例增加一個成員變量name,成員變量的通過Person()參數name傳遞進來
???? this.age=age;//當前的對象實例增加一個成員變量age,成員變量的通過Person()參數age傳遞進來
???? this.say=sayFunc; //增加一個sayFunc()函數
?? }
?? function sayFunc()
?? {
???? alert(this.name + ":" + this.age);
?? }
?? //創建一個對象實例
?? var person1=new Person("張三",18);
?? person1.say();? //調用person1的say()成員方法
?? var person2=new Person("李四",29);
?? person2.say();? //調用person2的say()成員方法
?</script>
</html>
=====================================================================
在函數中修改參數值的問題
?將基本數據類型的變量作為函數參數傳遞的情況:
?<script language="javascript">
? function changeValue(x)
? {
??? x=5;
? }
? var x=3;
? changeValue(x);
? alert(x);
?</script>
注意： 在函數changeValue(x)中的x=5并不能修改主程序中的x值，函數接受的參數
就相當于一個局部變量，當函數調用完也就沒用了。所以該程序的結果為x=3;如果
我們把一個對象的實例傳遞給函數，而我們有在函數中修改了對象實例的屬性，那么
最后的結果也會變化的。