深入理解ECMAScript的几个关键语句


Posted in Javascript onJune 01, 2016

写在前面

在这一章中我们聊一聊ECMAScript中的几个关键语句switch、for-in、label等语句,加深我们对它们的理解和认识。首先从最常见的说起。

while和for

while和for是很常规的语句,无论是在JavaScript还是C还是其他编程语言中。而且在编程中我们较常用的也是for,for用起来更灵活,更简单,所以有些人可能就会产生这样一种误解:

for比while更强大,能做到while做不到的一些事情。

其实我们稍微想想while和for语句的语法应用,我们就会发现:

while循环做不到的for循环也做不到。

这是因为for循环只是把while循环有关的代码集中在了一起而已,其实有些时候,用while循环比用for循环更简单。这也是各司其职各有利弊吧。

关于循环的另一点,我们先看一段代码:

for(i=0;i<5;i++){
  console.log(i);
}
console.log(i);

在循环外打印i,打印输出是5。

可以看到,在循环内部定义的变量在外部也是可以访问的。在一些语言中比如C,大括号定义的是块级作用域,但是在ECMAScript中是没有块级作用域这个概念的,所以在循环内部定义的变量在外部也是可以访问的。

switch语句

在其他编程语言中比如C,switch语句只能使用数字,而在ECMAScript中,switch语句可以使用任何数据类型,像字符串、对象都是可以的。

这里有一点需要说明:switch语句比较的时候使用的全等操作符,即===,所以'10'和10不相等,因为在进行全等比较的时候,并不发生类型转换。

for-in语句

for-in语句是一种精确性的迭代语句,可以用来遍历对象的属性,当然也可以迭代数组的属性。下面分别以例子说明:

for-in遍历对象

•window

先遍历一个特殊的对象window:

for(var i in window){
  console.log(i);
}

会打印出一串很长很长的属性列表,大家可自行查看,在此不一一罗列赘述。

•自定义对象

遍历自定义对象

var o={prop1:'value1', prop2:'value2', prop3:'value3'};
for (var i in o){
  console.log(i);
}

打印出prop1 prop2 prop3。

•数组

遍历数组

var array1=[1,2,3,4];
for(var i in array){
  console.log(i);
}

打印输出1 2 3 4。

with语句

with语句可以用来限制作用域,即可以将代码的作用域设置到一个特定的对象中。如下:

var hostname=location.hostname;
var url=location.href;

这两句分别获取hostname和url,因为它们共用location(同一个对象下的属性),所以我们可以将作用域限定在location中,即用with语句关联location对象。如下:

with(location){
  
  var hostname=hostname;
  var url=href;
}

需要注意的是:严格模式下使用with语句会有语法错误,同时,大量使用with语句会导致性能下降,同时也会给调试带来一定的困难,所以在开发应用程序的时候,尤其是开发大型应用程序的时候,并不建议使用with语句。

label语句

label语句用来在代码中加标签,从而可以在以后来使用它。一般情况下,加标签的语句要和for循环等循环语句配合来使用。

它的语法是:

label: statement

下面给出代码详细来看看label标签的用法。

1、先给出一段基本的代码:

var num=0;
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      break;
    }
    num++;
  }
}
console.log(num);

说明:break跳出了处在内部的for循环,j剩下的5次循环不再执行,所以打印的结果是95。

2、接下来我们将break换成continue:

var num=0;
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      break;
    }
    num++;
  }
}
console.log(num);

说明:continue跳出了本次循环,就是说跳出了处在内部for循环的这一次循环,所以打印的结果是99。

3、接下来我们加上一个名为outer的label标签再分别看打印结果:

var num=0;
outer:
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      break outer;
    }
    num++;
  }
}
console.log(num);

说明:加上了标签以后,用break跳到了标签outer处,就是说程序跳出了外循环,即程序执行到了i=5且j=5时停止执行,所以打印的结果是55。

4、我们再换成continue看看:

var num=0;
outer:
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      continue outer;
    }
    num++;
  }
}
console.log(num);

说明:这一次用的是continue,所以当程序执行到i=5且j=5时并没有跳出外循环,而只是跳出了内循环,即剩下的5次不予执行,所以打印的结果是95。

放在一起这几个显得稍微有些混淆,多理解理解就会好很多。

小结

我们学习一门东西不是为学而学,是为用而学,说白了就是为了工作而学,所以单纯理解上面的东西不是最重要的,不是为记而记,是为用而记,能够熟练运用在实践中才是我们希望的。同时,做笔记是一个很好的习惯,好记性不如烂笔头,如果你在做,那么希望你坚持下去。

以上这篇深入理解ECMAScript的几个关键语句就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype使用指南之selector.js说明
Oct 26 Javascript
用javascript作一个通用向导说明
Aug 30 Javascript
JavaScript 实现打印,打印预览,打印设置
Dec 30 Javascript
jQuery中:contains选择器用法实例
Dec 30 Javascript
jQuery插件Validation快速完成表单验证的方式
Jul 28 Javascript
javascript 中的事件委托详解
Oct 25 Javascript
node使用Mongoose类库实现简单的增删改查
Nov 08 Javascript
Mint UI实现A-Z字母排序的城市选择列表
Dec 28 Javascript
js实现鼠标拖拽缩放div实例代码
Mar 25 Javascript
layui 上传文件_批量导入数据UI的方法
Sep 23 Javascript
JavaScript实现省市区三级联动
Feb 13 Javascript
Vue过滤器,生命周期函数和vue-resource简单介绍
Jan 12 Vue.js
星期几的不同脚本写法(推荐)
Jun 01 #Javascript
js获取当前年月日-YYYYmmDD格式的实现代码
Jun 01 #Javascript
jquery 将当前时间转换成yyyymmdd格式的实现方法
Jun 01 #Javascript
底部悬浮通栏可以关闭广告位的实现方法
Jun 01 #Javascript
深入理解node exports和module.exports区别
Jun 01 #Javascript
jQuery基础知识点总结(DOM操作)
Jun 01 #Javascript
jQuery图片轮播插件——前端开发必看
May 31 #Javascript
You might like
你可能不知道PHP get_meta_tags()函数
2014/05/12 PHP
跟我学Laravel之安装Laravel
2014/10/15 PHP
用JavaScript调用WebService的示例
2008/04/07 Javascript
jquery 常用操作整理 基础入门篇
2009/10/14 Javascript
js实现兼容IE6与IE7的DIV高度
2010/05/13 Javascript
Nodejs学习笔记之测试驱动
2015/04/16 NodeJs
跟我学习javascript的最新标准ES6
2015/11/20 Javascript
浅析$.getJSON异步请求和同步请求
2016/06/06 Javascript
BootStrap初学者对弹出框和进度条的使用感觉
2016/06/27 Javascript
jQuery 3.0 的 setter和getter 模式详解
2016/07/11 Javascript
Bootstrap基本插件学习笔记之Tooltip提示工具(18)
2016/12/08 Javascript
javascript输出AscII码扩展集中的字符方法
2016/12/26 Javascript
JS实现静态页面搜索并高亮显示功能完整示例
2017/09/19 Javascript
Vue路由切换时的左滑和右滑效果示例
2018/05/29 Javascript
Vue 引入AMap高德地图的实现代码
2019/04/29 Javascript
vue-axios同时请求多个接口 等所有接口全部加载完成再处理操作
2020/11/09 Javascript
[40:06]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第一场
2018/04/04 DOTA
[56:00]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第二场
2018/04/10 DOTA
[01:08:43]DOTA2-DPC中国联赛定级赛 Phoenix vs DLG BO3第一场 1月9日
2021/03/11 DOTA
操作Windows注册表的简单的Python程序制作教程
2015/04/07 Python
Python的Django框架可适配的各种数据库介绍
2015/07/15 Python
使用Python的Flask框架来搭建第一个Web应用程序
2016/06/04 Python
python使用super()出现错误解决办法
2017/08/14 Python
python计算两个矩形框重合百分比的实例
2018/11/07 Python
Django的Modelforms用法简介
2019/07/27 Python
Python3之乱码\xe6\x97\xa0\xe6\xb3\x95处理方式
2020/05/11 Python
Expedia意大利旅游网站:酒店、机票和租车预订
2017/10/30 全球购物
美国浴缸、水槽和水龙头购物网站:Vintage Tub & Bath
2019/11/05 全球购物
党的群众路线教育实践活动宣传标语口号
2014/06/06 职场文书
团队会宣传标语
2014/10/09 职场文书
李白故里导游词
2015/02/12 职场文书
大一学生个人总结
2015/02/15 职场文书
实习指导老师意见
2015/06/04 职场文书
MySQL入门命令之函数-单行函数-流程控制函数
2021/04/05 MySQL
HTML5 语义化标签(移动端必备)
2021/08/23 HTML / CSS
Python使用DFA算法过滤内容敏感词
2022/04/22 Python