1、JavaScript 主要內容簡介編程基礎內置對象自定義對象JavaScrip與HTML瀏覽器兼容性JQueryAJaxJavaScript簡介基于對象的網頁腳本編程語言不支持繼承、多態、重載平臺無關ECMAScript規范（文檔）的一種實現JavaScript與Java語法與Java類似很容易同Java一同工作Jscript微軟版的JavaScriptIE 中默認使用Jscript主要差別在于文檔模型DOMJavaScript簡介制作網頁特效提供表單前端驗證動態操作網頁元素增、刪、編輯HTML元素修改CSS樣式編程基礎數據類型數值Nubmer：整數、浮點邏輯Logic：true/false字

2、符串String：/”空值null：沒有值，大小寫敏感不等于0不等于/”未定義值undefined：尚未定義值編程基礎數據類型自動類型轉換var x = “x=”+ 3；= x = “x=3”var x = “30”/5; = x=6var x = “30”/”5”; = x=6編程基礎變量命名規則大小寫敏感以下劃線、字母開頭聲明變量不用指明類型：var x = 3, y=Hello;動態修改類型：var x = 3;x = “Hello”;編程基礎變量作用域global variable var global_x = 3; function f()global_y = “Hello”;f()

3、;/ access global_x, global_y local variablefunction f()local_y = “Hello”;f();/ can not access local_y 編程基礎運算符&表達式賦值運算符=+= -= /= *= %= |= &= = =比較運算符= != ：只比較值= != ：比較值和類型【=，=比較復雜，詳細內容請參看ECMAScript規范】編程基礎運算符&表達式比較運算符（續） =算術運算符+ - * / % + -邏輯運算符& | !在邏輯表達式中，undefined 表現為false注意，表達式的值為最后一個被判斷的值編程基礎運算符&

4、表達式,表達式? : 表達式編程基礎操作符new 實例化一個對象 : var obj = new 對象名(); delete 刪除一個對象、屬性、數組、變量var x = 3; delete x;var obj = new 對象名(); delete obj.屬性; delete obj;var a = 3, 4; delete a0; delete a1; typeofinstanceofthis代表當前對象視執行上下文而定編程基礎函數定義和調用函數 function fname(param1, param2) var local / use param1, param2 fname(par

5、am1, parma2); var f = fname;f(param1, parma2);編程基礎函數匿名函數var f = function (param1, param2) var local / use param1, param2 f (param1, param2);(function fname()()編程基礎函數函數嵌套函數可以作為返回值function ff()function f()return hll;return f;console.log(ff()();編程基礎函數eval用于執行javascript字符串中的JS代碼callvar obj = name : wang

6、function f(suffix)return + + suffix;console.log(f.call(obj, !)注意用，而不是”this編程基礎控制語句ifelse if elseswitchcasedefaultwhilefor(;)for( in )var a= 2,3,4 for (var x in a) console.log(ax)breakcontinue編程基礎異常處理trycatchfinallythrow示例tryconsole.log(try)throw nothing“catch(e)console.log(e)finallyconsole

7、.log(finally)內置對象StringDateArrayObjectBooleanMathFunctionRegExpErrorargumants內置對象Stringvar s1 = “this is a String” var s2 = new String(“this is a String”) s1.toUpperCase() Anchor link創建書簽鏈接、超練級big small italics bold blink sup sub fontsize fontcolor創建字符顯示格式，, toLowerCase toUpperCaseindexOf lastindexO

8、f charAtsubstring substr splitmatch內置對象Date var d = new Date(日期參數)var today = new Date(); today.getYear() 內置對象Object 一個Object是一些properties的無序集合；propertynamevaluea set of attributes【來自ECMAScript 3規范】ReadOnly忽略寫操作并不意味著不會變DontEnum不能在forin中使用DontDelte忽略delete操作Internal沒有name訪問方式由實現決定內置對象arguments當進入一個函數

9、執行代碼時，生成一個argumetns對象callee屬性指向被執行的Function對象length參數的長度var i = console.log(function(i)if(i1)return i + arguments.callee(i-1) return 1;)(10)console.log(i)自定義對象參考 我們把一個人看成一個對象var person = name : “li”,age : 24 / 注意沒有，console.log();自定義對象var li = , wang = ; = “li”;li.age = 24;

10、 = “wang”;wang.age = 34;console.log()console.log(li.age)console.log()console.log(wang.age)動態地添加、編輯、刪除屬性delete li.agevar li = Person(“li”,24)var wang = Person(“wang”,34)function Person(name, age)return name : name,age : agevar li = Person(“li”,24)var wang = Person(“wang”,34)console.lo

11、g()console.log(li.age)console.log()console.log(wang.age)li和wang是孤立的兩個對象；自定義對象構造函數普通函數+this使用new Constructor()來生成實例this綁定在實例上 function Person(name, age) = name; this.age = age; 自定義對象 var p = new Person(“li”, 24) console.log() console.log(p.age)自定義對象添加方法 function Person

12、(name, age) = name; this.age = age; this.getAge = function()return this.age; this.setAge = function(age)return this.age = age; var p = new Person(“li”, 24) console.log() console.log(p.age) p.setAge(p.getAge()+3); console.log(p.age)自定義對象var p1 = new Person();var p2 = new Person();cons

13、ole.log(p1.getAge = p2.getAge);這樣就沒有代碼復用了！每一個實例，都有一份代碼自定義對象ECMAScript規范規定：每個函數都有一個prototype屬性，這意味著，我們可以把那些共用的屬性和方法，直接定義在prototype對象上自定義對象添加類方法Ptotype.getAge = function()return this.age;Ptotype.setAge = function(age)this.age = age;只有屬性了！自定義對象如果某個實例想變得與眾不同呢？可以添加額外的屬性或方法 li.sport = “bas

14、ketball”可以重寫共有的方法 li.getAge = function() return this.age-1; 自定義對象function Person(name, age) = name;this.age = age;var name = wang;console.log(name);Person(li,24);console.log(name);this!自定義對象不論在何處調用obj.f()f代碼塊中的this指的是objf()f代碼塊中的（eval除外）指的是global 自定義對象var Person = name : null,age : null,get

15、Age : function()return this.agevar li = Object.create(Person); = lili.age = 24;var wang = Object.create(Person); = wangwang.age = 34;自定義對象Object.createECMAScript v5規范規定的瀏覽器兼容性問題if (!Object.create) Object.create = function (o) function F() F.prototype = o;return new F();但是不能實現私有屬性和私有方

16、法，實例對象之間也不能共享數據，對類的模擬不夠全面。自定義對象function F()自定義對象function Girl()Gtotype.getAge = function ()return;console.log(li.getAge()li._proto_ = Gtotypeconsole.log(li.getAge()Gtotype.getAge = function ()return this.age;console.log(li.getAge()優先調用自定義對象更多內容，參考ECMAScript規范JavaScrip與HTML加載網頁時，瀏覽器器創建網頁的文檔對象模型(DOM, Document Object Model)DOM與平臺和語言無關JavaScrip與HTMLJavaScript中的DOMJavaScriptwindow所有瀏覽器都支持window對象表示瀏覽器窗口所有JavaScript全局對象、函數及變量均自動成為window對象的成員訪問window的屬性、方法時， 可以省略window. (this指向window)document對象也是window的屬