JavaScript同样的意思,更巧的写法
2013-06-08 16:25
295 查看
今天来介绍一下javascript不一样的写法,很简单哦。
1、当条件成立时执行a方法,当条件失败是执行b方法
通常我们会这样写:
还可以这样表达:
2、当条件成立执某个方法
通常方式:
我更喜欢这样写:
如果一个变量没定义或没有值则给它一默认值
上面的方式可行,是因为在js逻辑运算中,返回值不一定是true或false,也可以是其他任何值,而且 0、""、null、false、undefined、NaN都会判为false,其他都为true。举例:
3、当进行多个条件判段时
给一个例子:每种颜色对应一个值,比如"white","red","green","yellow","gray","blue" 分别对应的值为0,1,2,3,4,5
1) 问题一:根据值获取颜色
实现方式一
实现方式二
实现方式三
调用: var color=getColorByVal(2);
方式一和方式二相比没什么差别,但方式二稍微好一点,而方式三则是让人眼前一亮,短小精悍就完成了功能。不过有的人会说颜色的值刚好是数组下标,所以我们再来一题:
2) 问题二:根据颜色获取值
你可以用if 或switch 语句来完成,不过这里给出另外两种方式:
方式一:
方式二:
调用: var val=getValByColor("red");
对比一下很明显,方式二更简单而且易懂,巧妙在于构造一个对象,通过属性获取值,从而避开了繁琐的判断。
4、交换两个变量的值
通常是这样实现的:
不过还可以更巧一些:
方式二
两种方式都得到了对象colors的属性(arr=["white", "red", "green", "yellow", "gray", "blue"]), 第二种方式不过搭了 for in 语句的顺风车。方式一中for in语句依次从colors获取一个属性赋值给key,只不过在方式二中赋值给了arr[i++]。这个纯粹是为了好玩,享受编程的乐趣也是编程的一部分吧。。
是不是发现javascript也很有意思呢? 有意思就推荐一下吧。
1、当条件成立时执行a方法,当条件失败是执行b方法
通常我们会这样写:
var result; if(isOk){ result=funA(); }else{ result=funB(); }
还可以这样表达:
var result=isOk? funA():funB()
2、当条件成立执某个方法
通常方式:
if(isOk){ doSomething(); }
我更喜欢这样写:
isOk&&doSomething();
如果一个变量没定义或没有值则给它一默认值
str=str||"ok"; arr=arr||[];
上面的方式可行,是因为在js逻辑运算中,返回值不一定是true或false,也可以是其他任何值,而且 0、""、null、false、undefined、NaN都会判为false,其他都为true。举例:
1&&"OK" //表达式的值为字符串"OK",逻辑上被判定为 true 1||"OK" //表达式的值为数字1,逻辑上被判定为 true null||[] //表达式的值为数组[],逻辑上被判定为 true null&&[] //表达式的值为null,逻辑上被判定为 false
3、当进行多个条件判段时
给一个例子:每种颜色对应一个值,比如"white","red","green","yellow","gray","blue" 分别对应的值为0,1,2,3,4,5
1) 问题一:根据值获取颜色
实现方式一
function getColorByVal(val) { var color = ""; if (val == 0){ color = "white"; }else if (val == 1) { color = "red"; } else if (val == 2) { color = "green"; } else if (val == 3) { color = "yellow"; } else if (val == 4) { color = "gray"; } else if (val == 5) { color = "blue"; } return color; }
实现方式二
function getColorByVal(val) { var color; switch (val) { case 0: color = "white"; case 1: color = "red"; break; case 2: color = "green"; break; case 3: color = "yellow"; break; case 4: color = "gray"; break; case 5: color = "blue"; break; } return color; }
实现方式三
function getColorByVal(val) { return ["white","red","green","yellow","gray","blue"][val]; }
调用: var color=getColorByVal(2);
方式一和方式二相比没什么差别,但方式二稍微好一点,而方式三则是让人眼前一亮,短小精悍就完成了功能。不过有的人会说颜色的值刚好是数组下标,所以我们再来一题:
2) 问题二:根据颜色获取值
你可以用if 或switch 语句来完成,不过这里给出另外两种方式:
方式一:
function getValByColor(color){ var colors=["white","red","green","yellow","gray","blue"]; var result; for(var i=colors.length;i--;){ if(colors[i]==color){ result=i; break; } } return result; }
方式二:
function getValByColor(color){ return {"white":0,"red":1,"green":2,"yellow":3,"gray":4,"blue":5}[color]; }
调用: var val=getValByColor("red");
对比一下很明显,方式二更简单而且易懂,巧妙在于构造一个对象,通过属性获取值,从而避开了繁琐的判断。
4、交换两个变量的值
通常是这样实现的:
var temp=0,a=5,b=10; temp=a; a=b; b=temp;
不过还可以更巧一些:
var a=5,b=10; a=[b,b=a][0];
a=[b,b=a][0] 执行过程:先执行数组里两个表达式b和b=a,作用是把5赋值给b并产生一个数组[10,5] ,然后 a=[10,5][0]即 a=10,这样就完成了交换,不过也借助了无名的数组,但看起来好想没借助第三个变量,不过不提倡这样做,毕竟第一种方式更易懂。 5、获取对象的属性 方式一
var arr=[],i=0; var colors={"white":0,"red":1,"green":2,"yellow":3,"gray":4,"blue":5}; for(var key in colors){ arr[i++]=key; }
方式二
var arr=[],i=0; var colors={"white":0,"red":1,"green":2,"yellow":3,"gray":4,"blue":5}; for(arr[i++] in colors);
两种方式都得到了对象colors的属性(arr=["white", "red", "green", "yellow", "gray", "blue"]), 第二种方式不过搭了 for in 语句的顺风车。方式一中for in语句依次从colors获取一个属性赋值给key,只不过在方式二中赋值给了arr[i++]。这个纯粹是为了好玩,享受编程的乐趣也是编程的一部分吧。。
是不是发现javascript也很有意思呢? 有意思就推荐一下吧。
相关文章推荐
- JavaScript同样的意思,更巧的写法
- JavaScript同样的意思,更巧的写法
- JavaScript同样的意思,更巧的写法
- javascript 中(function{})()这种写法什么意思
- javascript中(function($){...})(jQuery)写法是什么意思
- javascript中(function($){...})(jQuery)写法是什么意思
- Javacript同样的意思,更巧的写法
- javascript中(function($){...})(jQuery)写法是什么意思
- HTML中调用JavaScript的几种情况和规范写法
- Javascript下IE与Firefox下的差异兼容写法总结
- Javascript疑问八:原型prototype是什么,"_name"前面的下划线是什么意思
- 【推荐】同样的焦点图不同的写法
- 详解JavaScript的另类写法
- javascript定义对象写法-------作者:虫虫3000 日期:2009-9-7 10:14:9
- Javascript添加收藏夹和设为首页兼容写法
- JavaScript入门:004—JS注释的写法和基本运算符
- 容易混淆的JavaScript写法例举
- javascript 回退到前一页的写法及区别
- JavaScript模块化编程--模块的写法
- Javascript关于绑定事件方法attachEvent和addEventListener区别与兼容写法