denysdovhan /wtfjs

🤪 A list of funny and tricky JavaScript examples

★ 37,689⑂ 2,673👁 563⑃ 202● 123▤ 25◈ 18
JavaScriptWTFPLCreated 2017-07-14bit.ly/wtfjavascript
37,689
stars
+2
2,673
forks
563
watchers
202
prs
123
issues
25
releases
18
discussions

README

What the f\ck JavaScript?

[![WTFPL 2.0][license-image]][license-url]
[![NPM version][npm-image]][npm-url]
[![Patreon][patreon-image]][patreon-url]
[![Buy Me A Coffee][bmc-image]][bmc-url]

 一个有趣和棘手的 JavaScript 示例列表。

JavaScript 是一个不错的语言。它的语法简单,生态系统也很庞大,最重要的是,它拥有最伟大的社区力量。

我们知道,JavaScript 是一个非常有趣的语言,但同时也充满了各种奇怪的行为。这些奇怪的行为有时会搞砸我们的日常工作,有时则会让我们忍俊不禁。

WTFJS 的灵感源于 Brian Leroux。这个列表受到他 在 2012 年的 dotJS 上的演讲 “WTFJS” 的高度启发:



 适用于 NodeJS 的指南手册

你可以通过 npm 安装该项目的指南手册。只需运行:


$ npm install -g wtfjs


然后在命令行中运行 wtfjs,将会在命令行中打开手册并跳转至你选择的页数 $PAGER。这不是必需的步骤,你也可以继续在这里阅读。

源码在此处: 

 翻译

如今,wtfjs 已被翻译成多种语言:

- 中文
- हिंदी
- Français
- Português do Brasil
- Polski
- Italiano
- Russian (on Habr.com)
- 한국어

[点此添加新语言的翻译][tr-request]

[tr-request]: https://github.com/denysdovhan/wtfjs/blob/master/CONTRIBUTING.mdtranslations

注意: 翻译由该语言的译者维护,因此可能缺失部分例子,或存在过时的例子等。




 Table of Contents

- 💪🏻 初衷
- ✍🏻 符号
- 👀 例子
  - [[] 等于 ![]](-%E7%AD%89%E4%BA%8E-)
  - [true 不等于 ![],也不等于 []](true-%E4%B8%8D%E7%AD%89%E4%BA%8E-%E4%B9%9F%E4%B8%8D%E7%AD%89%E4%BA%8E-)
  - true 是 false
  - baNaNa
  - NaN 不是 NaN
  - 奇怪的 Object.is() 和 ===
  - 它是 fail
  - [[] 是真值,但不等于 true](-%E6%98%AF%E7%9C%9F%E5%80%BC%E4%BD%86%E4%B8%8D%E7%AD%89%E4%BA%8E-true)
  - null 是假值,但又不等于 false
  - document.all 是一个 object,但又同时是 undefined
  - 最小值大于零
  - 函数不是函数
  - 数组相加
- 数组中的尾逗号
  - 数组的相等性是深水猛兽
  - undefined 和 Number
  - parseInt 是一个坏蛋
  - true 和 false 的数学运算
  - HTML 注释在 JavaScript 中有效
  - NaN ~~不是~~一个数值
  - [[] 和 null 是对象](-%E5%92%8C-null-%E6%98%AF%E5%AF%B9%E8%B1%A1)
  - 神奇的数字增长
  - 0.1 + 0.2 精度计算
  - 扩展数字的方法
  - 三个数字的比较
  - 有趣的数学
  - 正则表达式的加法
  - 字符串不是 String 的实例
  - 用反引号调用函数
  - 到底 call 了谁
  - constructor 属性
  - 将对象做为另一个对象的 key
  - 访问原型 __proto__
  -  ${{Object}} 
  - 使用默认值解构
  - 点和扩展运算符
  - 标签
  - 嵌套标签
  - 阴险的 try..catch
  - 这是多重继承吗?
  - yield 返回自身的生成器
  - 类的类
  - 不可转换类型的对象
  - 棘手的箭头函数
  - 箭头函数不能作为构造函数
  - arguments 和箭头函数
  - 棘手的返回
  - 对象的链式赋值
  - 使用数组访问对象属性
  - Number.toFixed() 显示不同的数字
  - min 大于 max
  - 比较 null 和 0
  - 相同变量重复声明
  - Array.prototype.sort() 的默认行为
  - resolve() 不会返回 Promise 实例
  - {}{} 是 undefined
  - arguments 绑定
  - 来自地狱的 alert
  - 没有尽头的计时
  - setTimeout 对象
  - 点点运算符
  - 再 new 一次
  - 你应该用上分号
  - 用空格分割(split)字符串
  - 对字符串 stringify
  - 对数字和 true 的非严格相等比较
- 其他资源
- 🤝 捐赠支持
- 🎓 许可证




 💪🏻 初衷

 只是因为好玩

 — _“只是为了好玩:一个意外革命的故事”, Linus Torvalds_

这个列表的主要目的是收集一些疯狂的例子,并尽可能解释它们的原理。我很喜欢学习以前不了解的东西。

如果您是初学者,您可以根据此笔记深入了解 JavaScript。我希望它会激励你在阅读规范上投入更多时间和精力。

如果您是专业开发人员,您将从这些例子中看到人见人爱的 JavaScript 也充满了非预期的边界行为。

总之,古人云:三人行,必有我师焉。我相信这些例子总能让你学习到新的知识。

 ⚠️ Note: 如果这些例子帮助到你,请务必赞助收集了这些例子的作者.

 ✍🏻 符号

// - 表示表达式的结果。例如:

js
1 + 1; // - 2


//  表示 console.log 等输出的结果。例如:

js
console.log("hello, world!"); //  hello, world!


// 则是用于解释的注释。例如:

js
// 将一个函数赋值给 foo 常量
const foo = function() {};


 👀 例子

 [] 等于 ![]

数组等于一个数组取反:

js
[] == ![]; // - true


 💡 说明:

抽象相等运算符会将其两端的表达式转换为数字值进行比较,尽管这个例子中,左右两端均被转换为 0,但原因各不相同。数组总是真值(truthy),因此右值的数组取反后总是为 false,然后在抽象相等比较中被被类型转换为 0。而左值则是另一种情形,空数组没有被转换为布尔值的话,尽管在逻辑上是真值(truthy),但在抽象相等比较中,会被类型转换为数字 

Top issues

Discussions

Latest release

v1.22.8 v1.22.8 2022-09-30
1.22.8 (2022-09-30)


 Bug Fixes

 broken link in zh-cn translation (278) (c6f8310)

Snapshot: 2026-11-10T09:35:25Z · Data license Apache-2.0 · JSON