JavaScript基礎(chǔ)知識點歸納

JavaScript基礎(chǔ)學(xué)問點歸納(舉薦)

定義在函數(shù)外的變量確定是全局變量；定義在函數(shù)內(nèi)的

變量，假如聲明白var,那該變量就是局部變量，假如不聲

明var,那么該變量就是全局變量。

1、全局變量與局部變量

JavaScript

varglobal="Global”;

test;

functiontest{

varlocal="Local”;

document,writein(global);

document,writein(local);

}

document,writein(global);

document,writein(local);

2、兩種類型的Cookie

i)許久性cookie,會被存儲到客戶端的硬盤上。

ii)回話cookie：不會被存儲到客戶端的硬盤上，而是

放在閱讀器進程所處的內(nèi)存當(dāng)中，當(dāng)閱讀器關(guān)閉時則該回話

cookie就銷毀了。

3、在JavaScript中，函數(shù)(function)就是對象

4、在JavaScript中，沒有方法(函數(shù))重載的概念

5、Function對象

在JavaScript中有一個Function對象，全部自定義的

函數(shù)都是Function對象類型的。Function對象接受的全部

參數(shù)都是字符串類型的，其中最終一個參數(shù)就是要執(zhí)行的函

數(shù)體，而前面的參數(shù)則是函數(shù)真正須要接受的參數(shù)。

6、隱含的對象arguments

在JavaScript中，每個函數(shù)都有一個隱含的對象

arguments,表示給函數(shù)實際傳遞的參數(shù)。arguments,length

就表示實際傳遞的參數(shù)的個數(shù)。

7、函數(shù)名.length

每一個函數(shù)對象都有一個length屬性，表示該函數(shù)期

望接受的參數(shù)個數(shù)。它與函數(shù)的arguments不同。

arguments,length表示函數(shù)實際接受的參數(shù)個數(shù)。

8、JavaScript中有五種原始數(shù)據(jù)類型

Undefined>Null、Boolean>Number以及String。（留

意：在JavaScript中，沒有char數(shù)據(jù)類型）

Undefined數(shù)據(jù)類型的值只有一個：undefined；

Null數(shù)據(jù)類型的值只有一個：null；

Boolean數(shù)據(jù)類型的值有兩個：true和false；

9、typeof運算符

typeof是一元運算符，后跟變量的名稱，用于獲得變量

的數(shù)據(jù)類型，其返回值有5個：undefined、boolean>number>

string以及objecto

10、在JavaScript中，假如函數(shù)沒有聲明返回值，那

么會返回undefinedll>null與undefined的關(guān)系

undefined事實上是從null派生出來的。例如：

null與undefined的關(guān)系

JavaScript

alert(undefined==null);

〃閱讀器返回true

11、強制類型轉(zhuǎn)換

在JavaScript中有3種強制類型轉(zhuǎn)換：Boolean

(value),Number(value),String(value)。

12>Object對象

在JavaScript中，全部對象都是從Object對象繼承過

來的。

Object對象

JavaScript

varobject=newObject;

for(varvinobject){

alert(v);

}

上面的代碼中，閱讀器并沒有打印出什么，并不能說明

Object對象不帶有任何屬性。下面代碼測試Object對象中

的屬性是否可以枚舉，假如返回false,則說明Object對象

中的屬性是不能枚舉的。

Object對象中的屬性是不能枚舉的

JavaScript

alert(pertyIsEnumerable("prototype"));

閱讀器彈出false對話框，則說明Object對象中的屬

性是不能枚舉的。

接下來我們再看看window對象中的屬性是否可以枚舉

的

window對象中的屬性是可以枚舉的

JavaScript

for(varvinwindow){

console,log(v);

}

在Chrome閱讀器中我們會看到閱讀器調(diào)試限制臺中打

印出一大堆屬性，說明window對象中的屬性是可以枚舉的。

13、在JavaScript中，可以動態(tài)添加對象的屬性，也

可以動態(tài)刪除對象的屬性

動態(tài)添加/刪除對象的屬性

JavaScript

varobject=newObject;

alert(object,username);//undefined

object,username="zhangsan”;

alert(object,username);//zhangsan

object["password〃]=〃123〃；

alert(object,password);//123

deleteobject,username;//止匕時，username屬性已經(jīng)

被刪除

alert(object,username);

14、JavaScript中定義對象最常見的方式

定義對象最常見的方式

JavaScript

varobject={

username:zhangsan,

password:12345

);

alert(object,username);

alert(object,password);

15、數(shù)組

數(shù)組定義

JavaScript

〃方法一

vararray=newArray;

array,push(1);

array,push(2);

array,push(3);

alert(array.length);

〃方法二(舉薦)

vararray=[1,25,41;

array,sort;

alert(array);

調(diào)用數(shù)組的sort()方法，閱讀器打印1,25,4,這

并不是我們期望的結(jié)果。

對于JavaScript數(shù)組的sort方法來說，它會先將待排

序的內(nèi)容轉(zhuǎn)換為字符串(調(diào)用toString方法)，依據(jù)字符

串的先后依次進行排序。

下列方式可以得到我們期望的結(jié)果(按數(shù)組大小進行排

序)：

數(shù)組排序

JavaScript

functionpare(numl,num2){

vartempi=parselnt(numl);

vartemp2=parselnt(num2);

if(tempireturn-1;

}elseif(tempi==temp2){

return0;

}else{

return1;

)

}

vararray=[1,25,31;

array,sort(pare);

alert(array);

我們再用匿名函數(shù)的方式實現(xiàn)：

匿名函數(shù)排序

JavaScript

vararray=[1,25,31;

array,sort(function(numl,num2){

vartempi=parselnt(numl);

vartemp2=parselnt(num2);

if(tempireturn-1;

}elseif(tempi==temp2){

return0;

}else{

return1;

}

))；

alert(array);

16、JavaScript中定義對象的5種方式(JavaScript

中沒有類的概念，只有對象)i)基于已有對象擴充其屬性

和方法

基于已有對象擴充其屬性和方法

JavaScript

varobject=newObject;

〃添加name屬性

object,name="zhangsarT;

〃添加sayName方法

object.sayName=function(name){

this,name=name;

alert(this,name);

)；

object.sayName(〃kyle");〃調(diào)用sayName方法，name

屬性被修改為kyle,閱讀器將打印kyle

最簡潔的一種方式，運用起來并不便利，適合于臨時須

要一個對象。

ii)工廠方式創(chuàng)建對象

不帶參數(shù)的工廠方法：

JavaScript

〃工廠方法

functioncreateObject{

varobject=newObject;〃創(chuàng)建一個對象

object,name="zhangsarT;〃為該對象添加一個

name屬性

object,password=〃123〃；〃為該對象添加一個

password屬性

object,get=function{〃為該對象添加一個get

方法

alert(this.name+〃，〃+this.password);

)；

returnobject;〃返回該對象

}

varobjectl=createObject;〃調(diào)用createObject

工廠方法創(chuàng)建對象objectl

varobject2=createObject;〃調(diào)用createObject

工廠方法創(chuàng)建對象object2

objectl.get;〃調(diào)用對象get方法

object2.get;〃調(diào)用對象get方法

帶參數(shù)的工廠方法：

JavaScript

functioncreateObject(name,password){

varobject=newObject;

object,name=name;

object,password=password;

object,get=function{

alert(this.name+〃，〃+this.password);

)；

returnobject;

}

varobjectl=createObject("zhangsan”,〃123”);

varobject2=createObject(〃lisi〃，〃456〃)；

objectl.get;

object2.get;

上面兩種不帶參數(shù)和帶參數(shù)的工廠方法缺點：

每創(chuàng)建一個對象，內(nèi)存中就創(chuàng)建一個get方法，比較奢

侈內(nèi)存，且影響性能。而我們的期望是，創(chuàng)建兩個不同的對

象，它們的屬性是不一樣的，但方法是共用的。所以接下來

我們須要改進createObject工廠方法。

改進的工廠方法：

JavaScript

functionget{

alert(this.name+〃，〃+this.password);

}

functioncreateObject(name,password){

varobject:newObject;

object,name=name;

object,password=password;

object,get=get;

returnobject;

}

varobjectl=createObject("zhangsan”,〃123〃)；

varobject2=createObject(〃lisi〃，〃456”);

objectl.get;

object2.get;

將get方法定義在createObject函數(shù)外面，這樣每

創(chuàng)建一個對象，get方法都是共用的。讓一個函數(shù)對象被多

個對象所共享，而不是每一個對象都擁有一個函數(shù)對象。

iii)構(gòu)造函數(shù)方式創(chuàng)建對象

不帶參數(shù)的構(gòu)造函數(shù)：

JavaScript

functionPerson{

〃在執(zhí)行行代碼前，js引擎會為我們生成一個對象

this,name="zhangsan”;

this,password="123";

this.getlnfo=function{

alert(this.name+〃，“+this.password);

）；

〃此處有一個隱含的return語句，用于將之前生成

的對象返回(也是跟工廠方式不一樣的地方)

}

varpl=newPerson;

pl.getlnfo;

帶參數(shù)的構(gòu)造函數(shù)

JavaScript

functionPerson(name,password){

this,name=name;

this.password=password;

this,getlnfo=function{

alert(this.name+〃，〃+this.password);

)；

}

varpl=newPerson("zhangsan”,〃123〃)；

varp2=newPerson("lisi〃，〃456〃)；

pl.getlnfo;

p2.getlnfo;

iv)原型(prototype)方式創(chuàng)建對象

prototype是Object對象里面的一個屬性

prototype

JavaScript

functionPerson{

Person,prototype,name="zhangsan”;

Person,prototype,password=〃123〃；

Ptotype,getlnfo=function(

alert(this.name+〃，〃+this.password);

)；

varpl=newPerson;

varp2=newPerson;

pl.name=〃kyle〃;〃對象生成之后再去變更屬性

pl.getlnfo;

p2.getlnfo;

單純地運用原型方式有兩個問題：，你無法在構(gòu)造函數(shù)

中為屬性賦初值，只能在對象生成之后再去變更屬性值。

prototype

JavaScript

functionPerson{

}

Person,prototype,name=newArray;

Person,prototype,password=〃123〃；

Ptotype.getlnfo=function(

alert(this.name+〃，〃+this.password);

);

varpl=newPerson;

varp2=newPerson;

pl.name,push("zhangsan");

pl.name,push(，，lisi，/);

pl.password=〃456”;

pl.getlnfo;

p2.getlnfo

閱讀器將會打?。簔hangsan,lisi,456和zhangsan,

lisi,123.

假如運用原型方式創(chuàng)建對象，那么生成的全部對象會共

享原型中的屬性，這樣一個對象變更了該屬性也會反應(yīng)到其

他對象當(dāng)中。所以單純地運用原型方式是不行的，還須要結(jié)

合其他方式。接下來我們會接著介紹。

運用原型+構(gòu)造函數(shù)方式來定義對象

JavaScript

functionPerson{

this,name=newArray;

this.password="123";

}

Ptotype,getlnfo=function(

alert(this.name+”,〃+this.password);

);

varpl=newPerson;

varp2=newPerson;

pl.name,push(，，zhangsan，/);

p2.name.push("lisi〃)；

pl.getlnfo;

p2.getlnfo;

運用原型+構(gòu)造函數(shù)方式來定義對象，對象之間的屬性

互不干擾，各個對象間共享同一個方法，這是一種比較好的

方式。

v)動態(tài)原型方式

JavaScript

functionPerson{

this,name="zhangsan”;

this.password=〃123〃；

if(typeofPerson,flag=="undefined"){

alert("invoked");

Ptotype,getlnfo=function{

alert(this,name+〃，〃+this.password);

Person,flag=true;

varpl=newPerson;

varp2=newPerson;

pl.getlnfo;

p2.getlnfo;

在動態(tài)原型方式中，在構(gòu)造函數(shù)中通過標記量讓全部對

象共享一個方法，而每個對象擁有自己的屬性。上面代碼在

次創(chuàng)建對象時，首先通過一個推斷語句，看flag屬性是否

已經(jīng)定義，若沒有定義，則通過原型方式添加getlnfo方法,

然后將flag設(shè)置為true,那么當(dāng)其次次創(chuàng)建對象時，if語

句推斷為假，跳過執(zhí)行。這樣就達到了我們所期望的結(jié)果，

創(chuàng)建的對象屬性是互不干擾的，而對象的方法是共享的。

17、JavaScript中對象的繼承(5種方式)

種方式:對象冒充

冒充對象繼承

JavaScript

〃父類

functionParent(username){

this,username=username;

this.sayHello=function{

alert(this,username);

)；

〃子類

functionChild(username,password){

〃下面三行代碼是最關(guān)鍵的

this,method二Parent;

this,method(username);

deletethis,method;

this,password=password;

this.sayWorld=function{

alert(this,password);

)；

}

varp=newParent(〃zhangsan〃)；

varc=newChild(〃lisi”,〃123〃)；

p.sayHello;

c.sayHello;

c.sayWorld

其次種方式:call

繼承的其次種實現(xiàn)方式，call方法方式，call方法是

Function對象中定義的方法，因此我們定義的每個函數(shù)都擁

有該方法。call方法的個參數(shù)會被傳遞給函數(shù)中的this,

從第2個參數(shù)起先，逐一賦給函數(shù)中的參數(shù)。

call繼承父類

JavaScript

functiontest(str){

alert(this.name+〃，〃+str);

}

varobject=newObject;

object,name="zhangsarT;

//test,call相當(dāng)于調(diào)用了test函數(shù)

test,call(object,“html5war");〃將object賦給了

this

接下來我們用call方式實現(xiàn)對象的繼承

JavaScript

〃父類

functionParent(username){

this,username=username;

this.sayHello=function{

alert(this,username);

}；

}

〃子類

functionChild(username,password){

Parent,call(this,username);

this,password=password;

this.sayWorld=function{

alert(this,password);

}；

}

varp=newParentC'zhangsan^);

varc=newChild("lisi",〃123〃);

p.sayHello;

c.sayHello;

c.sayWorld;

第三種方式：apply

apply繼承父類

JavaScript

〃父類

functionParent(username){

this,username=username;

this.sayHello=function{

alert(this,username);

)；

〃子類

functionChild(username,password){

Parent,apply(this,newArray(username));

this.password=password;

this.sayWorld=function{

alert(this,password);

)；

}

varp=newParentC'zhangsan^);

varc=newChild("lisi〃,"123”);

p.sayHello;

c.sayHello;

c.sayWorld;

apply方法與call方法很類似，apply方法也是定義在

Func