189 8069 5689

64ES6_流程控制

 

成都创新互联公司坚持“要么做到,要么别承诺”的工作理念,服务领域包括:网站制作、网站设计、企业官网、英文网站、手机端网站、网站推广等服务,满足客户于互联网时代的长安网站设计、移动媒体设计的需求,帮助企业找到有效的互联网解决方案。努力成为您成熟可靠的网络建设合作伙伴!

 

目录

语法:...1

流程控制:...2

for循环:...3

while循环、do...while循环:...4

for ... in循环:...5

for ... of循环:...6

三种for迭代的差别:...7

break、continue:...8

 

 

 

 

语法:

 

语句块:

js使用大括号构成语句块;

ES6之前语句块是没有作用域的,从ES6开始支持作用域,let只能在块作用域中可见;

 

函数内的let、var、隐式声明都对外不可见;

块作用仅对let有效(即用let定义的对外不可见,var和隐式声明的对外可见);

 

例:

function hello() {   //函数内的let、var、隐式声明都对外不可见

   let a =1;

   var b =2;

   c =3;

}

 

// let d =100;

 

if (1) {   //块作用域仅对let有效(即用let定义的对外不可见,var和隐式声明的对外可见)

   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都能转为if...else;

另switch...case支持模式;

穿透问题,要恰当的使用break,如果没有break,会一直走下去,直至碰到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循环:

C风格;

大括号中只1条语句时,大括号可省,如if (1) return;等价于if (1) {return ;};

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

         statement

}

 

for (let i=0;i

for (;;) {}   //死循环

 

例:

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循环、do...while循环:

一般用while (true) {},有条件退出用for;

 

while (condition) {   //条件满足,进入循环,条件为真,继续循环;大括号内语句只有一句,大括号可省

         statement

}

 

do {   //先进入循环,然后判断,为真就继续循环

         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循环:

对象操作语句,用来遍历对象的属性,另数组中索引也是属性;

数组用for ... in返回的是索引;

对象用for ... in返回的是key;

根据个人喜好,或用C风格的for循环,或用for ... in都可;

 

注:

js的对象,与py的字典类似;

 

例:

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

// let arr = {   //数组可理解为像对象这种定义方式,但不能用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循环:

ES6新语法,for ... of不能迭代对象,of后面必须是一个迭代器,可类比py的for in,如for i in [];

遍历数组中的values,即数组中的元素,适合取数组的所有元素,若有条件在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);   //返回数组元素,而不是索引

}

 

// for (let i of obj) {   //error,ReferenceError: obj is not defined,不能迭代对象,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或对象属性

       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,结束当前循环;

continue,中断当前循环,直接进入下一次循环;

 

 

 

 


标题名称:64ES6_流程控制
本文URL:http://cdxtjz.com/article/igeopj.html

其他资讯