?

成都創(chuàng)新互聯(lián)公司堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時(shí)代的長安網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

?

目錄

語法：...1

流程控制：...2

for循環(huán)：...3

while循環(huán)、do...while循環(huán)：...4

for ... in循環(huán)：...5

for ... of循環(huán)：...6

三種for迭代的差別：...7

break、continue：...8

?

?

?

?

語法：

?

語句塊：

js使用大括號(hào)構(gòu)成語句塊；

ES6之前語句塊是沒有作用域的，從ES6開始支持作用域，let只能在塊作用域中可見；

?

函數(shù)內(nèi)的let、var、隱式聲明都對(duì)外不可見；

塊作用僅對(duì)let有效（即用let定義的對(duì)外不可見，var和隱式聲明的對(duì)外可見）；

?

例：

function hello() {?? //函數(shù)內(nèi)的let、var、隱式聲明都對(duì)外不可見

???let a =1;

???var b =2;

???c =3;

}

?

// let d =100;

?

if (1) {?? //塊作用域僅對(duì)let有效（即用let定義的對(duì)外不可見，var和隱式聲明的對(duì)外可見）

???let d =4;

???var e =5;

???f =6;

???if (true) {

???????console.log(d,e,f);

???????g =7;

???????var h =8;

??? }

}

?

// console.log(a);?? //error

// console.log(b);?? //error

// console.log(c);?? //error

// console.log(d);?? //error，塊作用域中的不可見；最外層的可見

console.log(e);

console.log(f);

console.log(g);

console.log(h);

輸出：

4 5 6

100

5

6

7

8

?

?

?

?

流程控制：

?

條件分支：

if (cond) {

}

else if (cond2) {

}

else if (cond3) {

}

else {

}

?

條件的false等效：undefined、null、0、NaN、''（空字串）；其它值都被視為true；

?

?

switch...case分支語句：

所有的switch...case都能轉(zhuǎn)為if...else；

另switch...case支持模式；

穿透問題，要恰當(dāng)?shù)氖褂胋reak，如果沒有break，會(huì)一直走下去，直至碰到break；

default段不是必須；

switch (expression) {

???????? case label_1:

?????????????????? statement1

?????????????????? [break;]

???????? case label_2:

?????????????????? statement2

?????????????????? [break;]

???????? ...

???????? default:?? //不是必須

?????????????????? statement_def

?????????????????? [break;]

}

?

例：

let a =1;

switch (a) {

???case 1:

???????console.log('1');

???????// break;

???case 2:

???????console.log('2');

???????break;

???default:

???????console.log('null');

???????break;

}

輸出：

1

2

?

?

?

for循環(huán)：

C風(fēng)格；

大括號(hào)中只1條語句時(shí)，大括號(hào)可省，如if (1) return;等價(jià)于if (1) {return ;}；

for ([initialExpression]);[condition];[incrementExpression]) {?

???????? statement

}

?

for (let i=0;i

for (;;) {}?? //死循環(huán)

?

例：

let arr = [10,20,30,40,50];

for (let i=0;i

???console.log(i,arr[i])

}

輸出：

0 10

1 20

2 30

3 40

4 50

?

?

?

while循環(huán)、do...while循環(huán)：

一般用while (true) {}，有條件退出用for；

?

while (condition) {?? //條件滿足，進(jìn)入循環(huán)，條件為真，繼續(xù)循環(huán)；大括號(hào)內(nèi)語句只有一句，大括號(hào)可省

???????? statement

}

?

do { ??//先進(jìn)入循環(huán)，然后判斷，為真就繼續(xù)循環(huán)

???????? statement

} while (condition);

?

例：

let i =10;

while (i--) {

???console.log(i);

}

?

do {

???console.log(i)

}while (i++ <10)

?

例，99乘法表：

for (let x=1;x<10;x++) {

???line ='';

???for (let y=1;y<=x;y++) {

???????line +=`${y}*${x}=${x*y} `;?? //插值

???????if (x ==y)

???????????console.log(line);

??? }

}

?

?

for ... in循環(huán)：

對(duì)象操作語句，用來遍歷對(duì)象的屬性，另數(shù)組中索引也是屬性；

數(shù)組用for ... in返回的是索引；

對(duì)象用for ... in返回的是key；

根據(jù)個(gè)人喜好，或用C風(fēng)格的for循環(huán)，或用for ... in都可；

?

注：

js的對(duì)象，與py的字典類似；

?

例：

let arr = [10,20,30,40,50];

// let arr = {?? //數(shù)組可理解為像對(duì)象這種定義方式，但不能用arr.0這樣訪問，不能這樣操作

//???? 0:10,

//???? 1:20,

//???? 2:30

// }

?

for (i in arr) {

???console.log(i,arr[i]);

}

輸出：

0 10

1 20

2 30

3 40

4 50

?

?

例：

function add(x,y) {

???return x +y

}

?

var obj = {?? //與py字典訪問一樣

???p1 : 100,

???p2 : 'abc',

???p3 : [1,2,3],

???p4 : add

}

?

console.log(obj['p4'](4,5));?? //屬性要用字符串,obj['p4']；obj[p4]不可以，p4 is not defined

?

for (let key in obj) {

???console.log(`${key} :${obj[key]}`);?? //插值

}

輸出：

9

p1 : 100

p2 : abc

p3 : 1,2,3

p4 : function add(x,y) {

??? return x + y

}

?

?

?

for ... of循環(huán)：

ES6新語法，for ... of不能迭代對(duì)象，of后面必須是一個(gè)迭代器，可類比py的for in，如for i in []；

遍歷數(shù)組中的values，即數(shù)組中的元素，適合取數(shù)組的所有元素，若有條件在for ... in中作判斷；

?

例：

let arr = [10,20,30,40,50];

let obj = {

???p1 : 100,

???p2 : 'abc',

???p3 : [1,2,3]

}

?

for (let i of arr) {

???console.log(i);?? //返回?cái)?shù)組元素，而不是索引

}

?

// for (let i of obj) {?? //error，ReferenceError: obj is not defined，不能迭代對(duì)象，of后必須是迭代器

//???? console.log(i);

// }

console.log(typeof(obj));?? //object

輸出：

10

20

30

40

50

object

?

?

?

三種for迭代的差別：

?

function sum(arr) {

???for (let x in arr) {?? //遍歷index或?qū)ο髮傩?/p>

???????console.log(x,typeof(x),arr[x]);

??? }

???for (let x of arr) {?? //遍歷元素

???????console.log(x,typeof(x));

??? }

???for (let x=0;x

???????console.log(x,typeof(x),arr[x]);

??? }

}

?

sum([3,6,9]);

輸出：

0 string 3

1 string 6

2 string 9

3 'number'

6 'number'

9 'number'

0 'number' 3

1 'number' 6

2 'number' 9

?

?

?

break、continue：

break，結(jié)束當(dāng)前循環(huán)；

continue，中斷當(dāng)前循環(huán)，直接進(jìn)入下一次循環(huán)；

?

?

?

?