js基礎01--js的簡介、使用、語法、輸出、註釋、變數、型別轉換、表

yzf01發表於2021-09-09

一、 js的簡介

JavaScript一種直譯式指令碼語言,是一種動態型別、弱型別、基於原型的語言,內建支援型別。它的直譯器被稱為JavaScript引擎,為瀏覽器的一部分,廣泛用於客戶端的指令碼語言,最早是在(標準通用標記語言下的一個應用)網頁上使用,用來給HTML網頁增加動態功能。

在1995年時,由公司的,在瀏覽器上首次設計實現而成。因為與合作,管理層希望它外觀看起來像,因此取名為JavaScript。但實際上它的語法風格與及較為接近。[1]推出了,CEnvi推出ScriptEase,與JavaScript同樣可在瀏覽器上執行。為了統一規格,因為JavaScript相容於ECMA標準,因此也稱為。

  • JavaScript 被設計用來向 HTML 頁面新增互動行為。

  • JavaScript 是一種指令碼語言(指令碼語言是一種輕量級的程式語言)。

  • JavaScript 由數行可執行計算機程式碼組成。

  • JavaScript 通常被直接嵌入 HTML 頁面。

  • JavaScript 是一種解釋性語言(就是說,程式碼執行不進行預編譯)。

  • 所有的人無需購買許可證均可使用 JavaScript。

  • 區分大小寫

  • 每行結尾的分號可有可無(建議寫上)

二、 如何使用js

1.      透過

中直接編寫

2.      透過

連結外部的js檔案

3.      作為某個元素的事件屬性或是超連結href屬性值(不常用)

三、 程式碼遮蔽(不支援js的情況下)

四、 Js的基礎用法

1.      js的執行順序:

按照在html檔案中出現的順序依次執行

若js放在

建議將js包裹在window. = function(){ js程式碼}

        window.=function(){

            // js程式碼

        }

   

 

2.      js的語法規範

1.      JavaScript嚴格區分大小寫:大小敏感

2.      忽略空白符和換行符:js會忽略關鍵字、變數名、數字、函式或其它各種元素之間的空格、製表符或換行符;我們可以使用縮排、換行來使程式碼整齊、提高可讀性。

3.      使用;結束語句,建議寫上

4.      可以把多個語句寫在一行,但不建議這樣寫;建議一句一行

5.      最後一個語句的分號可以省略,但儘量不要省略

6.      可以使用{ }括成一個語句組,形成一個塊block

3.      基本輸出:

document.write(‘向頁面中輸出語句’);

console.log(‘在控制檯輸出’);--除錯語法錯誤

alert(‘彈框’);--除錯邏輯錯誤

4.      註釋:

單行註釋//     快捷鍵:ctrl+/

多行註釋  快捷鍵:

五、 js的基礎語法

1.      js變數

a.      透過var關鍵字宣告變數

            //宣告一個變數a

            var a;

            //給a變數賦值

            a = 'muzidigbig';

            console.log(a);//muzidigbig

            //在同一作用域中,後面再給a變數賦值會把之前的賦值給掉

            a = 'reset';

            console.log(a);//reset

 

b.      可以宣告變數的同時給變數賦值

var a = 'muzidigbig';

 

c.      可以一次宣告一個變數也可以一次宣告多個看變數

var c,d,e;

            c='1';

            d='2';

            e='3';

            console.log(c+d+e);

 

d.      如果只宣告變數未對其賦值,預設值為undefined

e.      如果變數重名產生覆蓋

注意:變數必須以字母開頭

變數也能以 $ 和 _ 符號開頭(不過我們不推薦這麼做)

變數名稱對大小寫敏感(y 和 Y 是不同的變數)

提示:JavaScript 語句和 JavaScript 變數都對大小寫敏感。

2.  原始資料型別(整數、浮點數、特殊值:Infinity無窮大【1.79e309~~-1.79e309】NaN【0/0,可以透過isNaN()檢測值是否為NaN,不能和自身做比較】)

圖片描述

3.  特殊資料型別

a.  無定義資料型別undefined;宣告變數未賦值/宣告瞭一個不存在的屬性值

b.  空值null;表示空值,什麼都沒有,相當於一個佔位符

區別:undefined宣告變數未賦值,null宣告變數賦值為null

var m;

            console.log(m);//undefined

            var z = null;

            console.log(z);//null

 

4.複合資料型別(物件(object)、陣列(array)、函式(function))後面細說。

六、 型別轉換

隱式轉換:

1、轉換成布林型別假:undefined->false、null->false、數值型0或0.0或NaN->false、字串長度為0->false、其它物件->true

    var a;//undefined

    //typeof得到變數的型別

    console.log(a);

    var a = null;

    //0,0.0,NaN->false

    var a = 0;

    var a = '';//空字串

    if(a){

        alert('真');

    }else{

        alert('假');

    }

 

1、 轉換為數值型資料:undefined->NaN、null->0、true->1|false->0、 內容為數字->數字,否則轉換成NaN、其它物件->NaN

    var b =undefined;

    b = null;

    b = true;

    b = false;

    alert(b+1);

 

2、 轉換為字串型資料:undefined->"undefined"、null->"NaN"、 true->"true"、false->"false"、數值型->NaN、0或者與數值對應的字串、其它物件->如果存在這個物件則轉換為toString()方法的值,否則轉換為Undefined

 

顯示轉換:

1.      轉換成數值:

1. 透過Number函式強制轉換成數值:數值->轉換成原來的值、字串->如果可以解析為數值,則轉換成數值;否則轉換成NaN或者0、true->1,false->0、undefined->NaN、null->0

  2. 轉換成整型:parseInt(string)

  3. 轉換成浮點型:parseFloat(string)

  4. 注意

  Number函式將字串轉換為數值比praseInt函式嚴格很多。基本上只要有一個字元無法轉換成數值,整個字串就會被轉換成NaN

var num = Number(123);

    num = Number('234');

    num = parseInt('1434dfdf')

    console.log(num);

 

2.      轉換成字串:

1.      透過String函式轉換成字串 :數值->數值本身、字串->字串本身、true->"true",false->"false"、undefined->"undefined"、null->"null"

2.      轉換成字串型:toString()

var str = String('123');

    str = 123;

    str = true;

   

    console.log(str);

 

3.      轉換成布林型別:

透過Boolean函式強制轉換成布林值:0、-0->false、NaN->false、空字串->false、undefined->false、null->false

var test = Boolean(0);

    test = Boolean(-0);

    console.log(test)

 

七、 表示式與運算子

1.表示式:表示式是用於JavaScript指令碼執行時進行計算的式子,可以包含常量、變數、運算子

//表示式簡單的說,通常就是我們程式設計中的變數宣告、賦值運算
var a ;
a = '木子大大';
var b = '21';

2.運算子

       a. 算術運算子:+、-、*、/、%、++、--

      

       在未參與運算的時候++、--都是加減1.

       在參與運輸的時候,++、--分為字首形式和字尾形式;字首形式先加減1在執行;字尾形式先執行在加減1。

       ++、--支援number型別的;不支援String

    var a = 1;

    a++;

    console.log(a);

    var b = 2;

    var c = 3;

    var d = 4;

    var b = b++;

    console.log(b);//2

    var f = b+++--c+d--;

    console.log(b);//3

    console.log(c);//2

    console.log(d);//3

    console.log(f);//8

 

注意:

       +號用來連線兩個字串

       只要+連線的運算元中有一個是字串型,Js就會自動把非字串型資料作為字串型資料來處理

       Js程式碼的執行順序是從左到右,所以在+連線的表示式中,遇到字串型資料之前,所有出現的數值型資料(或者可以自動轉換為數值型的資料)仍被作為數值來處理。為了避免這種情況,我們可以在表示式前拼一個空字串

var mu = 1;

var zi = 2;

var dig ='muzidigbig';

console.log(mu+zi+dig);//3muzidigbig

console.log(''+mu+zi+dig);//12muzidigbig

console.log(dig+mu+zi);//muzidigbig12

 

b. 字元連線符:透過+連線字串

 

c.      賦值運算子:=、+=、-=、*=、/=、%=

var big = 2;

big += 3;//相當於big+3;再賦值給自身即:big = big + 3;

console.log(big);//5

 

d.      比較運算子:

  >、>=、

  注意:

         比較運算子的結果為布林型別

         ==只比較值是否相等、===比較值和型別

              e. 邏輯運算子:&&、||、!

                     注意:

                            邏輯運算子的結果為布林型別

                            &&如果第一個表示式為false,造成短路

                            ||如果第一個表示式為true,造成短路

              var b = 2;

 var c = 3;

 var d = 4;

if(b>=c){

    console.log('ok');

}else{

    console.log('false');

}

if(b>=c&&c

    console.log('ok');

}else{

    console.log('false');

}

if(b=d){

    console.log('ok');

}else{

    console.log('false');

}

 

f.三元運算子:exp1?exp2:exp3;如果exp1為真,則執行exp2的程式碼;exp1為false,執行exp3;相當於簡單的if(){ }els(){ }語句

var bb = (b>=c)?2:3;

console.log(bb)//3

 

g. 其它運算子:

       逗號運算子

              逗號用來將多個表示式連線為一個表示式,新表示式的值為最後一個表示式的值,多用在變數宣告處

var a,b,c,d;

var i=1,j=2;

var z=(n=1,m=2,p=3);

console.log(z);//3

 

       void運算子

              void運算子用來指明一個表示式無返回結果

var z= void(n=1,m=2,p=3);

console.log(z);//undefined

 

       typeof運算子

              typeof運算子用來返回一個字串,返回的是運算元的資料型別

h. 3.運算子的優先順序

圖片描述

       透過( )改變優先順序

 

八、 流程控制

1.條件語句

       if(exp)執行一句程式碼

       if(exp){執行程式碼段;}

       if(exp){exp為true執行程式碼段}else{exp為false執行程式碼段;}

       if( ){...}else if( ){...}

              switch(變數){...case..}

       if(2>3){

    document.write('ok');

}else if(2>=4){

    document.write('goood ok');

}else if(2

    document.write('very good');

}else(

    document.write('都沒有')

);

 

var mm = "altman";

switch(mm){

    case 'li':

    document.write('al');

    break;

    case 'c':

    document.write('aaa');

    break;

    case 'altman':

    document.write('altman');

    break;

    default:

    document.write('上面的結果都沒有匹配到,只能執行我了!')

}

 

              if巢狀(外面的條件判斷成功之後才執行裡面的語句)

if(2

    document.write('我贏了');

    if(3

        document.write('我輸了');

    }

}

2.迴圈語句:

a. for迴圈

for(定義變數;條件表示式;自增/自減){

    迴圈體程式碼

}

執行順序:

首先定義變數

如果條件表示式結果為true的時候,執行for迴圈裡的程式碼,如果為false,迴圈體程式碼終止執行。控制迴圈次數

先執行變數和條件表示式迴圈一次,再執行自增自減。

for(var i=0;i

    console.log(i);

}

for..in多用於物件的遍歷(也可用於迴圈陣列)

for(var  key  in  obj){    console.log(key+':'+obj[key]);    }

var obj = {

    width: 100,

    height: 200

};

for (var i in obj) {

    console.log(i+':'+obj[i])

}

for...of多用於陣列的遍歷

這裡的索引index從1開始;陣列中的索引從0開始

var arr = [1, 2, 3, 4, 5];

for (var index of arr) {

    console.log(index+':'+arr[index -1])

}

 

b. while迴圈

While(條件表示式){

       只要條件表示式結果為true,迴圈一直執行,當條件表示式結果為false的時候,迴圈終止;

}

While迴圈語句需先在迴圈體外定義變數;用變數來控制迴圈的次數;常用於未知迴圈次數的情況

 

c.do...while迴圈

Do{

     迴圈體程式碼;首先執行該迴圈體程式碼一次。如果while後邊的表示式結果為true,該迴圈體會一直迴圈。如果結果false,該迴圈終止。

}while(條件表示式);

do…while 比while迴圈多迴圈一次。do…while先執行迴圈體再判斷條件。

var s = 1;

while(s

    console.log('我是do迴圈!'+s);

    s++;

}

 

var s = 1;

do{

    console.log('我是do迴圈!'+s);

    s++;

}while(s

           d. 3.特殊迴圈控制:

    break終止迴圈

在迴圈體內,只要程式碼執行遇到break,程式立馬結束當前迴圈。

當前迴圈指的是break語句所在的迴圈體。

 

    continue跳過當次迴圈,進入下次迴圈

Continue語句指的是跳出本次迴圈,該語句後面的程式碼不再執行,整個迴圈體繼續迴圈。

for(var i=1;i

    if(i%2==0){

        console.log('i:'+i);

        break;

    }

}

for(var n=1;n

    if(n==6){

        continue;

    }else{

        console.log('n:'+n);

    }

}

 

 

九、 Js函式

1.什麼是函式?

       函式是完成某一功能的程式碼段

       函式是可重複執行的程式碼段

              函式方便管理和維護

2.自定義函式

       透過function關鍵字

              function 函式名稱([引數,...]){

                     程式碼段;

                     return 返回值;

}

//定義一個無參函式

function fun(){

    console.log('我是簡單的function函式');

}

//呼叫函式

fun();

//定義一個傳參函式

function fun1(name){

    console.log(name+'  我是簡單的function函式');

}

//呼叫函式

fun1('muzidigbig');

 

              注意:

                     函式名稱不要包含特殊字元

                     函式名稱最好含義明確

                     函式名稱最好遵循駝峰標記法或者下劃線法

                     函式名稱嚴格區分大小寫

                     函式名稱如果重複會產生覆蓋

                     函式可以有引數也可以沒有引數,可以有一個引數也可以有多個引數

                     函式透過return加返回值,如果沒有return 預設返回undefined;返回多個值可以返回一個陣列/物件、、,也可以返回一個函式

                     函式不呼叫不執行

       匿名函式:

              函式表示式可以儲存在變數中,變數也可以作為一個函式使用

              可以將匿名函式作為引數傳遞給其它函式,接收方函式就可以透過所傳遞進來的函式完成某些功能

              可以透過匿名函式來執行某些一次性的任務

       透過Function()建構函式

              透過內建JavaScript函式構造器(Function())定義

                     var myFunction=new Function('a','b','return a+b');

                     var myFunction=function(a,b){return a+b;};

                     注意:

                            以上兩種方式是等價的

                                   儘量避免使用new關鍵字

       3.呼叫函式

       作為一個函式呼叫

              透過 函式名稱(); 進行呼叫,如果有引數傳遞相應引數即可。

              在HTML中預設的全域性物件是HTML頁面本身,所以函式是屬於HTML頁面。在瀏覽器中的頁面物件是瀏覽器視窗(window物件).所以函式會自動變為window物件的函式。也可以透過 window.函式名稱(); 進行呼叫

       全域性物件

              當函式沒有被自身的物件呼叫時,this的值就會變成全域性物件。在web瀏覽器中全域性物件是瀏覽器視窗window對。

              函式作為全域性物件呼叫,會使this的值稱為全域性物件。使用window物件作為一個變數容易造成程式崩潰

       函式作為方法呼叫

              可以將函式定義為物件的方法進行呼叫

       使用建構函式呼叫函式

              如果在函式呼叫前使用了new關鍵字,則呼叫了建構函式

       作為回撥函式呼叫函式

              call()

                     apply()

       4.引數

     函式可以有引數也可以沒有引數,如果定義了引數,在呼叫函式的時候沒有傳值,預設設定為undefined;

       在呼叫函式時如果傳遞引數超過了定義時引數,js會忽略掉多餘引數

       js中不能直接寫預設值,可以透過arguments物件來實現預設值效果

       可以透過arguments物件實現可變引數的函式

       透過值傳遞引數在函式體內對變數做修改不會影響變數本身

              透過物件傳遞引數在函式體內對變數做更改會影響變數本身

//實現預設引數的形式

function fun2(x,y){

    x=x||0;

    y=y||0;

    return x+y;

}

console.log(fun2());

console.log(fun2(2));

console.log(fun2(2,7));

 

//arguments物件用來接收函式傳來的實參;arguments物件是用一個類似於陣列的方式來儲存傳過來的實參

function fun3(x,y){

    console.log(arguments);

    for(var i=0;i

        console.log('arguments:'+arguments[i]);

    }

}

// fun3();

// fun3(1);

fun3(1,2);

 

       5.變數的作用域

       區域性變數

              在函式體內宣告的變數,僅在函式體內可以使用

       全域性變數

              函式體外宣告的變數,在變數宣告開始到指令碼結束都可以是使用

總結:小範圍內定義的變數不能被大範圍使用,只能被自己所定義的範圍使用;大範圍內定義的變數除了被自己所定義的範圍使用外,還能被自身的小範圍使用並影響改變它。

       注意:

              儘量控制全域性變數的數量,容易引發bug即全域性變數的汙染

                     最好總是使用var語句來宣告變數

//變數作用域

var x = 2;//全域性作用域

function test(){

    console.log('函式體內x的值為:'+x);

    x=44;

    console.log('函式體內對x重新賦值,此時的x值為:'+x);

    var y = '區域性變數y';

    console.log(y);

}

test();

console.log('函式體外x的值為:'+x);

console.log(y); //y is not defined--error

// test();

 

6.JavaScript全域性函式

       parseInt(string,radix):返回轉換成整數的值

              注意:

                     當引數radix的值為0,或者沒有設定這個引數,parseInt()會根據string來判斷數字的基數

                     當忽略radix,JavaScript預設數字的基數規則為

                     如果string以0x開頭,parseInt()會把string的其餘部分解析為十六進位制的整數

                     如果string以0開頭,那麼ECMAScript v3允許parseInt()的一個實現把其後的字元解析為八進位制或十六進位制的數字

                     如果string以1~9的數字開頭,parseInt()將把它解析為十進位制的整數

                     字串如果以合法字元開始,擷取合法字元

                     開頭和結尾的空格是允許的

                     如果字串的第一個字元不能被轉換為數字,parseInt()會返回NaN

                     在字串以"0"為開始時舊的瀏覽器預設使用八進位制基數。ECMAScript 5,預設的是十進位制的基數。

       parseFloat(string):返回轉換成浮點型的值

            該函式指定字串中的首個字元是否是數字。如果是,則對字串進行解析,直到到達數字的末端為止,然後以數字返回該數字,而不是作為字串。

       isFinite(value):檢測某個是是否是無窮值

              如果number是NaN或者+Infinity或者-Infinity的數,isFinite()返回false

       isNaN(value):檢測某個值是否是NaN

              isNaN()檢測是否是非數字值,如果值為NaN返回true,否則返回false

       encodeURI(uri):將字串編碼為URI

              注意:

                     使用 decodeURI() 方法可以編碼URI(通用資源識別符號:UniformResourceIdentifier,簡稱"URI")。

                     對以下在 URI 中具有特殊含義的 ASCII 標點符號,encodeURI() 函式是不會進行轉義的: , / ? : @ & = + $ # (可以使用 encodeURIComponent() 方法分別對特殊含義的 ASCII 標點符號進行編碼。).

       decodeURI(uri):解碼某個個編碼的URI

       encodeURIComponent(uri):將字串編碼為URI元件

              注意:

                     該方法不會對 ASCII 字母和數字進行編碼,也不會對這些 ASCII 標點符號進行編碼: - _ . ! ~ * ' ( )

                     其他字元(比如 :;/?:@&=+$,# 這些用於分隔 URI 元件的標點符號),都是由一個或多個十六進位制的轉義序列替換的

       decodeURIComponent():解碼一個編碼的URI元件

       escape():對字串進行編碼

              注意:

                     escape() 函式可對字串進行編碼,這樣就可以在所有的計算機上讀取該字串。

                     該方法不會對 ASCII 字母和數字進行編碼,也不會對下面這些 ASCII 標點符號進行編碼: * @ - _ + . / 。其他所有的字元都會被轉義序列替換。

                      escape()函式不能用於編碼 URIs(通用資源識別符號(UniformResourceIdentifier,簡稱"URI"))

       unescape():解碼由escape()編碼的字串

       eval():將JavaScript字串當作指令碼來執行

              注意

                     如果引數是一個表示式,eval() 函式將執行表示式。如果引數是Javascript語句,eval()將執行 Javascript 語句。

                     eval()函式是一種由函式執行的動態程式碼,比直接執行指令碼慢很多

                     慎重使用eval()函式,儘量不用,保證程式的安全性

       Number(object):把物件的值轉換為數字

              注意

                     如果物件的值無法轉換為數字,Number()函式返回NaN

                     如果引數的Date物件,Number()返回從1970年1月1日到現在所經歷的毫秒數

       String():把物件的值轉換為字串

              String() 函式返回與字串物件的toString()方法值一樣

 

十、 Js中的物件

1.JavaScript物件

       Javascript物件是基本資料型別之一,是複合型別

       Javascript中幾乎所有事物都是做物件

       Javascript的物件是擁有屬性和方法的資料。

       JavaScript 中的物件可以簡單理解成"名稱:值"對(name:value)的無序組合

              名稱

                     "名稱"部分是一個 JavaScript 字串

                            注意:

                                   可以將屬性名括在引號之間

                                          這三種形式一樣

                                                 var obj={prop:1}

                                                 var obj={"prop":1}

                                                 var obj={'prop':1}

                                          必須放到引號之間:

                                                 1.如果屬性名是Javascript的保留字之一

                                                 2.如果屬性名種包含特殊字元(除字母、數字、下劃線以外的字元)

                                                 3.如果屬性名以數字開頭

                                                 4.在ECMAScript5中,保留字可以用作不帶引號的屬性名,但對於ECMAScript3中必須用引號括起來

                                                 5.在ECMAScript5中物件直接量中的最後一個屬性後的逗號將被忽略,在ECMAScript 3的大部分實現中也可以忽略這個逗號,但在IE中報錯

              值

                     "值"部分可以是任何 JavaScript 的資料型別——包括物件

2.訪問物件的屬性和方法

      

       屬性操作:

              訪問屬性

                     物件名.屬性名

                     物件名[屬性名](如果屬性不確定需要使用[ ])

                     當處於某個物件方法內部的時候,可以透過this來訪問同一物件的屬性

              新增屬性

                     物件名.屬性名=值

                     物件名[屬性名]=值

              修改屬性

                     物件名.屬性名=值

                     物件名[屬性名]=值

              刪除屬性

                     delete 物件名.屬性名

                     delete 物件名[屬性名]

                     注意:

                            delete只能刪除自身屬性,不能刪除繼承屬性

                            要刪除繼承屬性,只能從定義它屬性的原型物件上刪除它,而且這會影響到所有繼承自這個原型的物件

                            delete只是斷開屬性和宿主物件的聯絡,而不會去操作屬性的屬性

                            delete不能刪除哪些可配製性為false的屬性

              遍歷屬性

                     for in遍歷屬性

       訪問方法

              物件名.方法名();

              注意:

                     如果物件名.方法名的形式,將返回定義函式的字串

屬性特性的詳解:

              資料屬性

                     資料屬性包含一個資料值的位置,在這個位置可以讀取和寫入值

                     4個描述行為的特性

                            [[writable]]

                                   表示能否修改屬性的值。預設值為true

                            [[Enumerable]]

                                   表示能否透過for in迴圈返回屬性。代表屬性是否可以列舉。直接在物件上定義的屬性預設值為true

                            [[configurable]]

                                   表示是否能透過delete刪除屬性從而重新定義屬性,能否修改屬性的特性,或者能否把屬性修改為訪問器屬性。直接在物件上定義的屬性,他們的預設值為true

                            [[value]]

                                 包含這個屬性的資料值。讀取屬性值的時候,從這個位置讀取。

                                   寫入屬性值的時候,把新值儲存在這個位置。這個特性的預設值為undefined

              存取器屬性

                     get

                            獲取屬性的值

                     set

                            設定屬性的值

       三個相關的物件特性(Object attribute)

              物件的原型(prototype)指向另外一個物件,本物件的屬性繼承自它的原型物件

                     透過物件字面量建立的物件使用Object.prototype作為它們的原型

                     透過new建立的物件使用建構函式的prototype屬性作為他們的原型

                     透過Object.create()建立的物件使用第一個引數(也可以是null)作為它們的原型

              物件的類(class)是一個標識物件型別的字串

                     ECMAScript3和ECMAScript5都未提供這個屬性的方法,可以透過物件的toString()方法間接查詢

              物件的擴充套件標記(extensible flag)指明瞭(在ECMAScript5中)是否可以向該物件新增新屬性

                     所有內建物件和自定義物件都是顯示可擴充套件的,宿主物件的可擴充套件性由JavaScript引擎定義的。

                     可以透過Object.preventExtensions()將物件設定為不可擴充套件的,而且不能再轉換成可擴充套件的了,可以透過Object.isExtensible()檢測物件是否是可擴充套件的

                     preventExtensions()隻影響到物件本身的可擴充套件性,如果給一個不可擴充套件的物件的原型新增屬性,這個不可擴充套件的物件同樣會繼承這些新屬性

                     可擴充套件性的目的是將物件鎖定,防止外接干擾,通常和物件的屬性的可配置行與可寫性配合使用

                     Object.seal()和Object.preventExtensions()類似,除了能夠將物件設定為不可擴充套件的,還可以將物件的所有自身屬性都設定為不可配置的。也就是說不能給這個物件新增新屬性,而且它已有的屬性也不能刪除或配置,不過它已有的可寫屬性依然可以設定。可以透過Object.isSealed()檢測物件是否封閉

                     Object.freeze()將更嚴格地鎖定物件--凍結(frozen).除了物件設定為不可擴充套件的和將其屬性設定為不可配置的之外,還可以將它自身的所有資料屬性設定為只讀(如果物件的儲存器屬性具有setter方法,存取器屬性將不受影響,仍可以透過給屬性賦值呼叫它們)。可以使用Object.isFroze()來檢測物件是否凍結。

 

 

//透過物件字面量的形式建立物件

var obj = {};

// console.log(obj); //object{}

 

var obj1 = {

    age:'21',

    name:'muzidggbig',

    person:{

        'name':'muzidigbigson',

        'age':21

    },

    array:[1,2,3,4],

    fun:function(){

        // console.log('function屬性方法');

        return this.name+this.age;

    }

}

//訪問屬性

console.log(obj1.name);

//訪問屬性方法

console.log(obj1.fun());

//新增屬性

obj1.sex = '男';

console.log(obj1);

//修改屬性

obj1.age = '24';

console.log(obj1);

//刪除屬性

delete obj1.array;

console.log(obj1);

//遍歷屬性

for(var key in obj1){

    console.log(key+'---'+obj1[key]);

}

 

// var obj2 = new Object();//建立一個空物件{}

 


 

若有不足請多多指教!希望給您帶來幫助!

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2334/viewspace-2811281/,如需轉載,請註明出處,否則將追究法律責任。

相關文章