##最近正在学 JS,找了点练习来做,然后看到如下的代码:
for (var i = 0; i < oBtn.length; i++)
然后我上网搜了一下明白了 var c=a||b;这种情况时
{
oBtn[i].index = i;
oBtn[i].onclick = function ()
{
this.index == oBtn.length - 1 && (oDiv.style.cssText = "");
changeStyle(oDiv, oAtt[this.index], oVal[this.index]);
}
}
a && b :如果执行 a 后返回 true,则执行 b 并返回 b 的值;如果执行 a 后返回 false,则整个表达式返回 a 的值,b 不执行。和
a || b :如果执行 a 后返回 true,则整个表达式返回 a 的值,b 不执行;如果执行 a 后返回 false,则执行 b 并返回 b 的值。
但还是不明白这句 this.index == oBtn.length - 1 && (oDiv.style.cssText = "");怎么操作的 index ???萌新望大佬解答
1
whileFalse 2018-03-25 09:33:09 +08:00 4
这种炫技代码是需要被狠狠修理的。
|
2
aa6563679 2018-03-25 09:37:11 +08:00 via iPhone 1
js 其实不管什么东西都能往判断语句里塞。那段代码等同与 if(this.index == oBtn.length - 1){
oDiv.style.cssText = ""; } |
4
Daoma OP @whileFalse 刚刚搞懂了。。。这种写法除了图省事炫技外有弊端吗?
|
5
DOLLOR 2018-03-25 10:01:07 +08:00 via Android
短路求值
|
6
gam2046 2018-03-25 10:16:36 +08:00 2
反正我觉得这样的写法并不好,除了提升逼格,毫无意义。因为令人更难理解了。常见的写法还有
foo = a || b a 和 b 都是一个对象,表达的意思就是 if( typeof(a) == "undefined"){ foo = b }else{ foo = a } 也就是说 b 是一定兜底的值,确保 foo 一定被定义了。 反正自己觉得动态语言真的是写的一时爽,重构火葬场。 |
7
crysislinux 2018-03-25 10:18:54 +08:00
弊端就是会挨打
|
8
lihongjie0209 2018-03-25 10:32:26 +08:00 1
傻逼写法, 不可取
|
9
mywaiting 2018-03-25 10:35:49 +08:00
&& 相当于 and, || 相当于 or 这样理解就可以了~
|
10
Pastsong 2018-03-25 10:40:36 +08:00
var a = b && c || d ? e : f
|
11
we2ex 2018-03-25 11:02:55 +08:00 via Android
|| 在 ES6 之前经常被作为实现默认参数的 tricky 手段
|
12
vegito2002 2018-03-25 11:56:19 +08:00
short circuit. 严格来说并不算是炫技了. 上 OS 的时候的 Pintos 系统的源码里面就有这种写法.
|
13
vegito2002 2018-03-25 11:57:35 +08:00
至于赋值语句直接当成 boolean 来用这个的话, 除了 C 以外的语言确实推荐少用, 是容易被喷.
|
14
watzds 2018-03-25 12:36:20 +08:00 via Android
|| 在其他语言里也差不多啊,不就是前面不满足就用后面嘛,只是其他语言里要求 bool
|
15
xjp 2018-03-25 12:42:10 +08:00 via iPhone
&& || 返回的值并不是 boolean
|
16
codermagefox 2018-03-25 13:42:25 +08:00
@gam2046 说&&炫技我资磁,但是||咋就炫技了?
不用这个,如何确保自己传值的时候每个字段名都有缺省值? |
17
raawaa 2018-03-25 14:12:12 +08:00 1
|| 不算啥,&& 才比较绕。
第一次见到 return a && b 的时候我是懵逼的。 不过弄懂了之后其实也很简单。 |
18
raawaa 2018-03-25 14:14:15 +08:00
其实很简单啊。
|| 是如果前面的结果是 true,就不运行后面的了。 && 是如果前面的结果是 false,就不运行后面的了。 许多语言的 boolean 运算不都是这样的嘛。 |
19
lihongjie0209 2018-03-25 18:27:19 +08:00
@raawaa #18 真的简单的话就不需要你去弄懂了, 也不需要你去解释给我们听了
|
20
SoloCompany 2018-03-25 18:54:21 +08:00 via iPhone
只要写过 shell 脚本的根本不会存在理解门槛
|
21
wee911 2018-03-25 20:06:32 +08:00
这种代码人见人恨,一行代码做两件事情,你是爽,其他都不爽
|
22
noe132 2018-03-25 20:44:08 +08:00
写这种代码的人会被下一个接手的维护者掘地三尺
|
23
codehz 2018-03-25 21:23:21 +08:00
其实||这种还是可以理解的(如果用于 null 判断,毕竟 js 没有二元的?:/??运算符
|
24
kotokz 2018-03-25 21:42:12 +08:00
short circuit 这种写法能避免尽量避免吧
多少会导致 cpu 没办法做 branch prediction 优化,从而影响效率 不是一个好的编程习惯 |
25
kingwl 2018-03-25 21:45:40 +08:00 via Android 7
你们是不是对炫技有什么误解?
|
26
weixiangzhe 2018-03-25 21:47:19 +08:00 via iPhone
我接触的前端 大都这样写啊
|
27
shisang 2018-03-25 22:01:01 +08:00
正常写法啊,这有什么不好理解的
|
28
tomychen 2018-03-25 22:41:53 +08:00
同感,很不喜欢这种写法,不是看不明白,而是看到一半的时候要停下来思考一下这是啥意思的时候,那种不连续感,是极其不舒服的。
而不是所有人都喜欢这种表示法的。 |
29
Hsinchu 2018-03-26 01:48:00 +08:00 via Android
我只说一下我写这种代码的场景。var a = b || {},把 b 赋值给 a 但如果 b 为空值 a 赋值为一个空对象,var a = b && b.data,把 b 的属性 data 赋值给 a,但 b 可能为 undefined。这两个场景下这样写可以少写一个几乎没实际意义的 if 语句,我也只在这两种场景下使用&&和||的这个特殊用法,没有炫技成分,就是很实在的减少代码长度。
|
30
congeec 2018-03-26 02:26:22 +08:00
楼上有几个写过 shell 的?我还以为搞前端的学了 node.js ,会顺带学一下 shell 啥的呢
|
31
Mutoo 2018-03-26 07:54:27 +08:00
举一个栗子
function example(options /*optional*/ ) { let paramOne = options && options.p1 || "default"; ... 这里 options 为可选参数对象,p1 为可选参数,"default" 为默认值 |
32
witcherhope 2018-03-26 08:03:30 +08:00 via iPhone
这种用法还是蛮常见的,写 React 组件时候用这个进行短路渲染因为 JSX 不支持 if/else 写法
|
34
weixiangzhe 2018-03-26 08:43:03 +08:00 via iPhone
所以最新的草案里有
var a = b?.c 这种写法了 |
35
KuroNekoFan 2018-03-26 09:32:20 +08:00 via iPhone
这种算是表达式,有的地方会有用,比如 jsx 里面
|
36
faceRollingKB 2018-03-26 09:34:59 +08:00
我懒,所以经常这么写,比如 this.dispose && this.dispose(),清晰明了
|
37
baixiangcpp 2018-03-26 09:58:37 +08:00
短路求值成了炫技了,我也是服了
|
38
scofieldpeng 2018-03-26 10:08:51 +08:00
楼上那些说炫技的,我真的快笑死了,这种最常见的写法难道一样写一堆 if else ?
|
39
royzxq 2018-03-26 10:12:10 +08:00
是不是对炫技有什么误解。
|
41
LeungJZ 2018-03-26 10:35:38 +08:00
楼上说炫技的,估计不是写前端的吧??
data.errors = data.unusual ? data.unusual.map(error => ({ type: errorTypes[error.unusualType], record: error['unusualRecord'], time: error['unusualTime'] })) : [] 难道我每次都要用 if else 去校验存在不存在???? |
42
LeungJZ 2018-03-26 10:42:13 +08:00 1
@Daoma
a && b 的意思是,先执行 a 语句,如果执行结果不是假值(不一定必须是 true ),则执行 b 并返回 b 的执行结果。 多数用于判断 a 是否存在,并执行 b 语句。如根据是否传入回调来判断是否需要执行回调: function(cb => { // do sth. cb && cb(result) }) a || b 的意思是,先执行 a 语句,如果执行结果不是假值(不一定必须是 true ),则直接返回。否则,则执行 b 并返回 b 的执行结果。 以前多数用来判断是否传参,是否使用默认值。 function (one, two) { one = one || 'one' two = two || 'two' } |
43
uolcano 2018-03-26 11:26:41 +08:00 via Android
|
44
codehz 2018-03-26 11:40:57 +08:00
@uolcano #43 所以你是没看二元这个词吗,用三元运算符要表达同样的意思就得 a ? a : b 不仅看着长而且如果 a 是一个有副作用的求值表达式就会出问题
|
45
GabrielChen 2018-03-26 12:36:19 +08:00
这样设置默认值也有 falsy 值问题,这样写比较好
ES6: ``` function fn(opts = {}) { // ... } ``` ES5: ``` function fn(opts ) { opts = (typeof opts !== 'undefined') ? opts : {}; //.. } ``` |
46
GabrielChen 2018-03-26 12:42:27 +08:00
如果执行 a 后返回 false,则整个表达式返回 a 的值,b 不执行。
应该为如果执行 a 后返回假值,则整个表达式返回 a 的值,b 不执行,所以用来做默认参数是不安全的 ``` var a=undefined ,b=true ; a&&b; //=>undefined var a=null,b=true ; a&&b; //=>null var a=0,b=true ; a&&b; //=>0 var a="",b=true ; a&&b; //=>"" var a=false,b=true ; a&&b; //=>false var a="1",b=true ; a&&b; //=>true var a=1,b=true ; a&&b; //=>true ``` |
47
uolcano 2018-03-26 12:44:40 +08:00 via Android
@codehz ?:在语言标准里,不都是三元的么?我是直接忽略了你说的“二元”。你说的 gcc 和 js 本就没有可比性,?: 二元是哪个语言的标准,还是插件支持?比较也要将基本法吧。
|
48
wangcheng 2018-03-26 12:47:38 +08:00
不要写这样的代码,别人看了会骂的。反正最后要 uglify,何必呢?
|
49
codehz 2018-03-26 13:27:40 +08:00
@uolcano #47 都是 C-like 语言,有何不可比较的? 二元 ?: 是 GCC 和 clang 支持的扩展,好多项目里都有使用,目的就是提供类似 Csharp 的那种??的语法(以及单次求值的特性) https://gcc.gnu.org/onlinedocs/gcc-5.3.0/gcc/Conditionals.html 我只是随口提了一下,你要较真就看这个链接吧
|
50
SimbaPeng 2018-03-26 14:00:31 +08:00
写个短路求值就要被骂了?还傻逼写法?真是笑喷。最近爬微信公众号的文章,微信 web 端的 js 代码全是这种写法,某些人没那个实力还喜欢喷人装逼,真是醉了。。。
|
51
SimbaPeng 2018-03-26 14:01:40 +08:00
一个成语能搞定的事情,非要别人用一段话来描述,到底是谁的问题?
|
52
DOLLOR 2018-03-26 14:21:02 +08:00
知道 JAVA 语法为何啰嗦冗长么?就是因为想加一点方便的语法就被喷成炫技。
说好的,谁在 JAVA 用 lambda 和 var 谁是小狗。 |
53
grewer 2018-03-26 15:47:38 +08:00
这也算炫技? 前端工作 1,2 年后只能算基础写法吧
当然 && 这种 1 行最多一个,不然可读性太差 |
54
duzhihao 2018-03-26 16:59:16 +08:00
我也不理解为什么这么写是"炫技",自从用了 react 感觉三元表达式和一元表达式太好用了。阅读起来也没什么障碍
|
55
imn1 2018-03-26 17:07:08 +08:00
其实,我不太明白这问题跟&&||有啥关系
|
56
h1367500190 2018-03-26 17:14:56 +08:00
其它语言中 a ?: b 是正常的写法,到了 JS 里 a || b 就成了炫技,也是佩服一些人的思维
|
57
zhengxiaowai 2018-03-27 10:13:05 +08:00
JS 中 || 和 && 还算常用,但是有人和我炫 !!'' 我也是比较无语的
|