上傳人：麻***

認(rèn)證信息

認(rèn)證類型：個人認(rèn)證

認(rèn)證主體：鐘**（實(shí)名認(rèn)證）

IP屬地：北京

IP屬地：北京 上傳時間：2022-08-16 格式：DOCX 頁數(shù)：14 大?。?.61MB 積分：6 舉報 版權(quán)申訴

1、JavaScript函數(shù)、對象學(xué)習(xí)目標(biāo)會創(chuàng)建和使用函數(shù) 掌握J(rèn)avaScript的對象函數(shù)函數(shù)的定義函數(shù)是定義一次但卻可以調(diào)用或執(zhí)行任意多次的一段 JS 代碼。 函數(shù)有時會有參數(shù)，即函數(shù)被調(diào)用時指定了值的局部變量。 函數(shù)常常使用這些參數(shù)來計算一個返回值， 這個值也成為函數(shù)調(diào)用表達(dá)式的值。函數(shù)的JavaScript中的函數(shù)：function函數(shù)是一種數(shù)據(jù)類型，這種寫法不能先調(diào)用再參數(shù)和返回值函數(shù)的參數(shù)函數(shù)可以有任意多個參數(shù) 函數(shù)的參數(shù)不需要設(shè)置類型 調(diào)用函數(shù)時可以傳入任意多個參數(shù)var functionName = function()console.log(函數(shù)); 34functionNam

2、e(); 5var temp = functionName;temp();function functionName()console.log(函數(shù)); 34functionName();函數(shù)沒有重載內(nèi)置對象arguments為傳入的參數(shù)數(shù)組 arguments.length獲得參數(shù)個數(shù)函數(shù)也可以作為參數(shù)傳遞給另一個函數(shù)函數(shù)可以有返回值通過return返回值 函數(shù)不需要有返回類型/函數(shù)作為參數(shù)傳遞給別的參數(shù)function a()return 123; 4function b(obj)console.log(345+obj); 78b(a();/ 函數(shù)參數(shù)function say(str,st

3、r2,str3)/ console.log(arguments);if(arguments.length=1)console.log(o world);else if(arguments.length=2)console.log(o js);elsevar res=;for(var i=0;iarguments.length;i+)res+=argumentsi; 1213console.log(res); 141516say(o world);say(o world,o js);say(o world,o js,o css,o api);/ 函數(shù)參數(shù)function say(str,str2

4、,str3)console.log(say:+str+str2+str3); 456say(o world,o js,o css,o api);對象對象的對象的屬性對象后可以直接添加屬性和方法時直接添加屬性和方法對象的方法JavaScript添加方法和添加屬性相同 JavaScript中的this誰調(diào)用就指向誰var color = gray;function show() var obj = name:tom, age:18; / JSONconsole.log(objname); 3function Student()=tom;6 var obj = new Studen

5、t();console.log();var obj = new Object(); = tom;console.log();1 var obj = new Object(); 23 var obj = Object();45 var obj = ; /掌握！6 var arr = ; / 數(shù)組7function Student()var obj = new Student();function a()return 123;3 var num1=a();console.log(num1);原型屬性通過prototype為原型添加屬性1 functi

6、on Student()2 =HTML;3 this.lesson=30;4 this.say=function()5console.log(this.lesson);1 Stotype.tall=176;2 var obj3 = new Student();3 console.log(obj3.tall);/176 45 var obj4=new Student();6 console.log(obj4.tall)/1761 function User()2 = userName;3 4 function Student() 5 th

7、is.userName = mike;6 this.userGender = 男;7 this.sayHi=function()8 console.log( o mike);9 10 1112 var obj3 = new Student();13 obj3.tall=175;14 console.log(obj3.tall);/175 1516 var obj4=new Student();17 console.log(obj4.tall)/undefined34 5678910111213141516console.log(this.color)show();/ gray var obj1

8、 = color: red, s: show;obj1.s();/ redvar obj2 = color: blue, s: show;obj2.s();/ blue作業(yè)掌握函數(shù)的使用 掌握對象的使用 JavaScript面 象設(shè)計(了解)JavaScript中創(chuàng)建對象不需要類提示：可以使用多種模式創(chuàng)建對象工廠模式工廠模式解決多個類似對象678910 11121314151617181920 2122this.say2=function(str,str2) console.log(str+str2+)var stu=new Student(); stu.say();stu.

9、say2(我,學(xué)習(xí));/ console.log();/ console.log(stu.lesson);/ console.log(stulesson); Stotype.sex=男; Stotype.say3=function()console.log(新增一個方法);console.log(stu.sex); stu.say3();工廠模式解決了重復(fù)實(shí)例化 每個對象都是獨(dú)立的 無法知道對象的真正類型 alert(typeof user1);/Object alert(user1 instanceof Object); /true構(gòu)造

10、函數(shù)模式創(chuàng)建兩個對象，會創(chuàng)建兩個function對象，浪費(fèi)資源 解決方案如下：缺點(diǎn)：造成大量全局函數(shù)存在原型模式原型模式缺點(diǎn)： 不具有構(gòu)造函數(shù) 屬性 對象類型時會發(fā)生共享問題,例如原型屬性有數(shù)組，則左右對象公用數(shù)組1 var o=2 a:1,3 b:24 ;5 function User() 67 8Us =Tom;Us rototype.age=18;Us rototype.text=o;Us rototype.sayHi=function()console.log();14 1516var user1=new User();=

11、Jerry;user1.text.a=gai;console.log(user1.text.a);var user2=new User();console.log(user2.text.a);user1.sayHi();user2.sayHi();console.log(user1 instanceof Object);console.log(user1 instanceof User);混合模式構(gòu)造函數(shù)+原型=混合模式動態(tài)原型模式若不為User原型設(shè)置sayName則使用默認(rèn)定義創(chuàng)建對象實(shí)例創(chuàng)建一個類似Java中的StringBuer的對象12345678/ push,shift,pop,u

12、nshift/ 所有動作都影響到原來數(shù)組/ push:往數(shù)組的最后 一個元素/ shift:從數(shù)組的最前取出一個元素，/ pop:從數(shù)組的最后面彈出一個元素/ unshift:往數(shù)組的最前端 一個元素var arr=a,b,c,d;91011121314151617181920/ arr.push(1);/ / console.log(arr);/ var str=arr.shift();/ console.log(str);/ console.log(arr);/ var str=arr.pop();/ console.log(str);/ console.log(arr); arr.uns

13、hift(123);/ console.log(str); console.log(arr);繼承：對象冒充使用對象冒充時需要創(chuàng)建臨時方法并及時刪除提示：使用對象冒充可以實(shí)現(xiàn)多重繼承繼承：call()方法call()方法的用法/ 基類function User(name)=name;this.sayName=function()console.log();6 7 / 學(xué)生類，繼承于User類function Student(name,age)this.tmp=User;this.tmp(name);delete this.tmp; 13this.age=ag

14、e;this.sayAge=function()console.log( this.age);17 18 /測試代碼var stu=new Student(tom,22);stu.sayName();stu.sayAge();使用call()實(shí)現(xiàn)對象冒充繼承：apply()方法apply()方法與call()方法相似 不同點(diǎn)在于參數(shù)傳遞時除了第一個參數(shù)都要放在數(shù)組中/ 學(xué)生類，繼承于User類function Student(name,age)/ this.tmp=User;/ this.tmp(name);/ delete this.tmp; 67 User.call(this,name);

15、 8this.age=age;this.sayAge=function()console.log( this.age);12 13 繼承：原型鏈方式不支持多重繼承，構(gòu)造函數(shù)不能有參數(shù)繼承：混合模式function Box(name)this.bname=name; 3function Desk(name)this.dname=name; 6function Table(name)this.tname=name; 9/先讓Desk繼承BoxDtotype=new Box(box);/讓Table繼承DeskTtotype=new Desk(desk); 14/Table同時繼承了Desk