当前位置:网站首页>分享 20 个稀奇古怪的 JS 表达式,看看你能答对多少
分享 20 个稀奇古怪的 JS 表达式,看看你能答对多少
2022-07-05 14:09:00 【前端达人】
JavaScript是一种非常容错的编程语言,许多在其他编程语言中不合法的表达式在JavaScript中都能正常工作。
这导致了很多奇怪的代码。你想挑战它吗?
挑战
在这个挑战中,你将看到20个古怪表达式,并要猜出其输出结果。
1.
true + false
2.
**1.**
3.
[1, 2, 3] + [4, 5, 6]
4.
0.2 + 0.1 === 0.3
5.
10,2
6.
!!""
7.
+!![]
8.
true == "true"
9.
010 - 03
10.
"" - - ""
11.
null + 0
12.
0/0
13.
1/0 === 10 ** 1000
14.
true++
15.
"" - 1
16.
(null - 1) - "1"
17.
38 * 4343 * 2342+ (“true” — 0)
18.
5 + !5 + !!5
19.
[] + [1] + 2
20.
1 + 2 + "3"
结果和分析
true + false
试图在两个布尔值之间使用加法运算符(+)时,它们会被转换为数字。
而且我们都知道true
应该被转换为1
,false
应该被转换为0
。所以true+false
返回1
。
[,,,].length
[,,,]
输出一个有三个空槽的数组。最后一个逗号是尾部的逗号。
你可以这么想。
[,] ==> [empty,]
[,,] ==> [empty, empty,]
[,,,] ==> [empty, empty, empty,]
所以 [,,,].length
返回3。
[1, 2, 3] + [4, 5, 6]
当你试图在数组之间使用加法运算符(+)时,它们会被转换为字符串。
将一个数组转换为字符串时,数组的 toString()
方法被调用。toString()
方法是JavaScript 内部使用的,当一个数组需要显示为文本时,它将用逗号连接其元素。
[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,34,5,6"
0.2 + 0.1 === 0.3
由于浮点数很难在计算机中准确表示,数学上的0.1
和0.2
在计算机中只能用近似的数字表示。
0.1+0.2
的结果不完全是0.3
。不仅仅是JavaScript,其他编程语言也有同样的问题。
10, 2
逗号(,
)在JavaScript中也是一个合法的操作符,它评估每个操作数(从左到右),并返回最后一个操作数的值。
因此,10,2返回2
!!""
""
是一个空字符串,它是一个虚值。
注意:0、空字符串""、null 和undefined都是虚值。
!
是逻辑上的 "非 "运算符,把 true 变成 false,反之亦然。
如果我们使用两次!
,也就是!!
,它将把一个正常的值转换成一个布尔值。所以!""
返回 false
。
+!![]
数组都是真值,甚至是空数组。所以!![]
将返回true
。
!![]; // -> true
而+
号会将真值转换为其数字表示: 1
,所以 +!![]
返回 1
。
true == "true"
双等运算符(==)检查其两个操作数是否相等,并返回一个布尔值结果。
根据抽象的双等比较规则,这两个值在比较时都被转换为数字。
true == "true" ==> Number(true) == Number("true") ==> 1 == NaN
所以,ture =="true"
返回false。
010 - 03
这里有一个小小的技巧:如果一个数字以0
开头,那么在JavaScript中它就被当作一个八进制数字。所以:
010 - 03 ==> 8 - 3 ==> 5
另外:
如果一个数字以0b开头,那么它在JavaScript中被视为二进制数字。
如果一个数字以0x开头,它在JavaScript中被当作一个十六进制数字。
** ""--"" **
这看起来是一个错误的语法,但它确实工作正常。
空字符串可以被转换为布尔值false或数字值0。所以 -""
为 0
null + 0
正如我们之前所说,null
是一个虚值。它将被转换为布尔值false
或数字值0
。所以结果返回 0
。
0/0
这是一个非法的数学表达式。方程0/0没有任何有意义的数字答案,输出的结果只是NaN
。
1/0 === 10 ** 1000
虽然1/0
和之前一样也是一个非法的数学表达式。但是当除数不是0
时,JavaScript认为这个表达式的结果是Infinity
。
而10**1000
是一个很大数字,JS 无法正确表示这个数字。(JavaScript中最高的整数值是2^53-1
)。所以10 * 1000
也被当作无限大(Infinity)。
无穷大总是等于另一个无穷大,所以1/0 === 10 ** 1000
返回 true。
true++
这没有什么特别的,这只是一个语法错误。
""- 1
虽然加法运算符(+)同时用于数字和字符串,但减法运算符(-)对字符串没有用处,所以JavaScript将其解释为数字之间的操作。一个空的字符串会被类型强制为0。
"" - 1 ==> Number("") - 1 ==> 0 - 1 ==> -1
所以 "" — 1
返回 -1
** (null - 1) - "1" **
正如上面所说。
null ==> 0
(null - 1) ==> -1
"1" ==> 1
所以 (null — 1) — “1”
返回 -2
38 * 4343 * 2342+ ("true" - 0)
你可能会怀疑JS是如此疯狂,以至于它将字符串 "true" 转换为布尔值 true 的数字表示。然而,它并没有那么疯狂。实际发生的情况是,它试图将字符串转换为数字,但失败了。
Number("true"); // -> NaN
在JavaScript的数字运算中,只要有一个值是NaN,运算的最终结果就一定是NaN。38 * 4343 * 2342
只是一个烟雾弹。
5 + !5 + !!5
正如上面所说。
0、空字符串""、null和undefined都是虚值。
非零的数字是真值。
所以:
!5 ==> 0
!!5 ==> 1
**[] + [1] + 2 **
试图在数组之间使用加法运算符(+)时,它们会被转换为字符串。
[] ==> ''
[1] ==> '1'
[] + [1] ==> '1'
'1' + 2 ==> '12'
所以结果是'12'。
1 + 2 + "3"
JavaScript 从左到右执行这些操作。当数字3与字符串3相加时,字符串连接将优先进行。
1 + 2; // -> 3
3 + "3"; // -> "33"
总结
坦率地说,这些挑战并没有为我胶们编码技能提供任何价值,所以不应该在实际项目中写这种代码
但是,把这些技巧作为朋友和同事之间的一些装13,不是一件非常有趣的事情吗?
作者:Marina Mosti 译者:前端小智 来源:medium 原文:https://medium.com/frontend-canteen/20-useless-but-funny-challange-for-javascript-develor-9eea39bb8efb
边栏推荐
- Don't be unconvinced. Mobile phone function upgrade is strong
- 03_Solr之dataimport
- Make the seckill Carnival more leisurely: the database behind the promotion (Part 2)
- Why do mechanical engineers I know complain about low wages?
- 2022 machine fitter (Advanced) test question simulation test question bank simulation test platform operation
- How to introduce devsecops into enterprises?
- Detailed explanation of SSH password free login
- R语言ggplot2可视化条形图:通过双色渐变配色颜色主题可视化条形图、为每个条形添加标签文本(geom_text函数)
- Guofu hydrogen energy rushes to the scientific and Technological Innovation Board: it plans to raise 2billion yuan, and 360million yuan of accounts receivable exceed the revenue
- Implementation process of WSDL and soap calls under PHP5
猜你喜欢
让秒杀狂欢更从容:大促背后的数据库(下篇)
Guofu hydrogen energy rushes to the scientific and Technological Innovation Board: it plans to raise 2billion yuan, and 360million yuan of accounts receivable exceed the revenue
How to introduce devsecops into enterprises?
Current situation, trend and view of neural network Internet of things in the future
IP packet header analysis and static routing
Interpretation of tiflash source code (IV) | design and implementation analysis of tiflash DDL module
物联网应用技术专业是属于什么类
Tiflash compiler oriented automatic vectorization acceleration
Convolutional Neural Networks简述
金融壹賬通香港上市:市值63億港元 葉望春稱守正篤實,久久為功
随机推荐
MySQL user-defined function ID number to age (supports 15 / 18 digit ID card)
R language ggplot2 visualization: use ggplot2 to visualize the scatter diagram, and use the labs parameter to customize the X axis label text (customize X axis labels)
Lepton 无损压缩原理及性能分析
R language uses boxplot function in native package (basic import package, graphics) to visualize box plot
Zhizhen new energy rushes to the scientific innovation board: the annual revenue is 220million, and SAIC venture capital is the shareholder
UE source code reading [1]--- starting with problems delayed rendering in UE
为什么我认识的机械工程师都抱怨工资低?
R language ggplot2 visualization: visual line graph, using legend in theme function The position parameter defines the position of the legend
Laravel - view (new and output views)
Hongmeng fourth training
鏈錶(簡單)
Mingfeng medical sprint technology innovation board: annual revenue of 350million yuan, proposed to raise 624million yuan
Recommendation number | what are interesting people looking at?
Getting started with rce
tidb-dm报警DM_sync_process_exists_with_error排查
What are the advantages and characteristics of SAS interface
JS takes key and value from an array object to form a new object
TiFlash 面向编译器的自动向量化加速
一网打尽异步神器CompletableFuture
R语言ggplot2可视化:gganimate包基于transition_time函数创建动态散点图动画(gif)、使用shadow_mark函数为动画添加静态散点图作为动画背景