天天看点

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

英文 | https://medium.com/frontend-canteen/20-useless-but-funny-challange-for-javascript-developer-9eea39bb8efb

翻译 | 杨小爱

由于JavaScript 是一种容错率极高的编程语言,许多在其他编程语言中非法的表达式在 JavaScript 中都能正常工作,是不是觉得很神奇?

正是因为JavaScript的这个特点,于是,导致很多奇怪的代码,今天我们就一起来看看这些代码, 我一共总结汇总了20个特别有趣有意思的代码题,你敢用它去挑战一下你的朋友同事吗?

在这20个代码题中,我都附加了分析解释,当然,你也可以自己先试一遍,看看你那边的结果如何。

好了,我们现在开始吧。

01、true + false

题目如下:

true + false      

分析

当你尝试在两个布尔值之间使用加法运算符 (+) 时,它们将转换为数字。

而且我们都知道 true 应该转换为 1 , false 应该转换为 0 。所以 true + false 返回 1 。

输出结果:

1      

02、[,,,].length

[,,,].length      

分析

[,,,] 输出一个包含三个空槽的数组,最后一个逗号是尾随逗号。

你可以这样想:

[,]     ==> [empty,]
[,,]    ==> [empty, empty,]
[,,,]   ==> [empty, empty, empty,]      
我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

所以 [,,,].length 返回 3。

输出结果:

3      

03、[1, 2, 3] + [4, 5, 6]

[1, 2, 3] + [4, 5, 6]      

分析

当我们尝试在数组之间使用 add operator(+) 时,它们将转换为字符串。

当我们尝试将数组转换为字符串时,将调用数组的 toString() 方法。当需要将数组显示为文本时,JavaScript 在内部使用 toString() 方法,它将用逗号连接其元素。

[1, 2, 3].toString() ==> '1, 2, 3'
[4, 5, 6].toString() ==> '4, 5, 6      

所以,[1, 2, 3] + [4, 5, 6]的结果为:

[1, 2, 3] + [4, 5, 6] ==> '1, 2, 3' + '4, 5, 6' ==> "1,2,34,5,6"      

04、0.2 + 0.1 === 0.3

0.2 + 0.1 === 0.3      

分析

由于浮点数在计算机中很难准确表示,因此数学上的 0.1 和 0.2 在计算机中只能用近似数来表示。

0.1 + 0.2 的结果并不完全是 0.3。 不只是 JavaScript; 其他编程语言也有同样的问题。

输出结果:

false      

想了解更多,可以转到此 StackOverflow 上查看:https://stackoverflow.com/questions/588004/is-floating-point-math-broken

05、10, 2

10,2      

分析

逗号 (,) 在 JavaScript 中也是一个合法的运算符,计算它的每个操作数(从左到右),并返回最后一个操作数的值。

所以 10, 2 返回 2。

输出结果:

2      

06、!!""

!!""      

分析

"" 是一个空字符串,它是一个假值。

注意:0 、 empty string  "" 、 null 和 undefined 都是假值。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

!是逻辑 NOT 运算符,将真为假,反之亦然。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

如果我们使用 ! 两次,就是!!,它将普通值转换为布尔值。所以 !!"" 返回 false。

输出结果为:

false      

07、+!![]

+!![]      

分析

数组都是真值,甚至是空数组。所以 !![] 将返回 true。

!![]; // -> true      

加号字符会将 true 转换为其数字表示:1

+true; // -> 1      

所以 +!![] 返回 1 。

输出结果为:

1      

08、true == "true"

true == "true"      

‍分析

相等运算符 (==) 检查它的两个操作数是否相等,返回一个布尔结果。

根据抽象相等比较的规则,这两个值在比较时都转换为数字。

true == "true" ==> Number(true) == Number("true") ==> 1 == NaN      

所以 ture == "true 返回 false。

false      

那么,这段代码的结果是什么?

false == '0'      

09、010 - 03

010 - 03      

分析

这是一个小技巧:如果一个数字以 0 开头,它在 JavaScript 中被视为八进制数。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

所以

010 - 03 ==> 8 - 3 ==> 5      

输出结果:

5      

还有:

  • 如果一个数字以 0b 开头,它在 JavaScript 中被视为二进制数。
  • 如果一个数字以 0x 开头,它在 JavaScript 中被视为十六进制数字。

10、"" - - ""

"" - - ""      

分析

这看起来像一个错误语法,但它确实工作正常。

空字符串可以转换为布尔值 false 或数值 0 。

所以 -"" 表示 0

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

此表达式将返回 0。

输出结果:

11、null + 0

null + 0      

正如我们之前所说,null 是一个假值,它将被转换为布尔值 false 或数值 0

所以它会返回 0。

12、0/0

0/0      

这是一个非法的数学表达式,方程 0/0 没有有意义的数字答案,输出只是 NaN。

13、1/0 === 10 ** 1000

1/0 === 10 ** 1000      

虽然 1/0 和前面一题一样,也是一个非法的数学表达式。但是当被除数不为 0 时,JavaScript 认为这个表达式的结果是无穷大。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

而 10 ** 1000 这么大的数字,JavaScript 无法正确表示这个数字。(JavaScript 中的最高整数值为 2^53–1), 所以 10 * 1000 也被视为无穷大。

Infinity 总是等于另一个 Infinity,所以 1/0 === 10 ** 1000 返回 true。

输出结果:

true      

14、true++

true++      

这没什么特别的。 这只是一个语法错误。 我们的第一个也是唯一的语法错误。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

15、"" - 1

"" - 1      

分析

虽然加法运算符 (+) 用于数字和字符串,但减法运算符 (-) 对字符串没有用处,因此 JavaScript 将其解释为数字之间的操作,空字符串被强制转换为 0。

"" - 1 ==> Number("") - 1 ==> 0 - 1 ==> -1      

所以 "" -1 返回 -1 :

16、(null - 1) - "1"

(null - 1) - "1"      

正如我们之前所说:

null ==>  0
(null - 1) ==> -1
"1" ==> 1      

所以 (null - 1) -“1” 返回 -2 :

输出结果:

-2      

17、38 * 4343 * 2342+(“true” - 0)

38 * 4343 * 2342+ (“true” — 0)      

分析

你可能会怀疑 JS 太疯狂了,以至于它会将字符串文字“true”转换为布尔值 true 的数字表示。实际发生的是它尝试将字符串转换为数字并失败。

Number("true"); // -> NaN      

在 JavaScript 数值运算中,只要有一个值为 NaN 的值,运算的最终结果一定是 NaN。38 * 4343 * 2342 只是一个烟雾弹。

输出结果:

NaN      

18、5 + !5 + !!5

5 + !5 + !!5      

分析

正如我们之前所说:

  • 0 、空字符串 "" 、null 和 undefined 都是假值。
  • 非零数字是真值。

所以:

5 + !5 + !!5;      

 输出结果为:

6      

19、[] + [1] + 2

[] + [1] + 2      

正如我们之前所说:当我们尝试在数组之间使用加法运算符(+)时,它们将被转换为字符串。

[] ==> ''
[1] ==> '1'
[] + [1] ==> '1'
'1' + 2 ==> '12'      

所以结果是 '12' 。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

最终输出结果为:

"12"      

20、1+2+"3"

1 + 2 + "3"      

分析

JavaScript 会从左到右执行这些操作。当数字 3 与字符串 3 相加时,字符串连接将优先。

1 + 2; // -> 3
3 + "3"; // -> "33"      

因此,输出结果为:

"33"      

写在最后

坦率地说,这些代码题对我们的编码技能没有太多价值,并且我们也不应该在实际项目中编写这种代码。

但是,将这些技巧作为我们与朋友同事之间的谈点,这也是些代码的价值,是不是也是一件很有趣的事?

只是,我在实际生活中,我用这些问题来测试我的朋友后,结果我被一群人殴打了一顿,至于你是否需要用它来测试的朋友或者同事,请自行决定。

我只是用这20个JavaScript的代码题来测试我的朋友同事,结果我被他们殴打了一顿

继续阅读