今天浏览一些技术网站,看到这个题目。虽然觉着代码这么写的可能性低之又低,但是却也考验对js了解的程度。

在 JavaScript 中 (a ==1 && a== 2 && a==3) 可能为 true 吗?解释说nothing is impossible!

这里是两个可能的答案:

<script>
const a = {
i: 1,
toString: function () {
return a.i++;
}
} if(a == 1 && a == 2 && a == 3) {
console.log('Hello World!');
}
</script>

运行代码

<script>
const a = {
i: 1,
valueOf: function () {
return a.i++;
}
} if(a == 1 && a == 2 && a == 3) {
console.log('Hello JavaScript!');
}
</script>

运行代码

最根本的还是强制类型转换。类型==,===运算符和强制转换:

先看个表达式:

<script>
var res = "1.0e0" == { valueOf: function() { return true; } };
  console.log(res);
</script>

运行代码

是的,这个结果也是 true。

对于这个表达式我们能够注意到:

它们的类型是不一样的。原因是在运算的时候进行了强制转换。在比较之前,它们被转换成了数字。

字符串”1.0e0“被解析成数字1,而匿名对象通过调用自身的valueOf方法得到true,然后再转换成数字1。

这也是a可以同时为1,2,3的原因。

我们需要知道的是:

1、如果表达式两边的数据类型不一致,==运算符两边会进行强制转换;

2、此对象在被强制转换时,会自动优先调用了自身的valueOf方法

3、如果此对象没有valueOf方法,则会继续尝试调用toString方法

4、如果将==运算符改成===运算符,则不会强制转换;

5、如果表达式两边数据类型一致,==运算符和===运算符返回的结果是一致的

下图为==运算符针对不同类型参数的强制转换规则:

规则看着挺复杂,不幸的是,它其实也是这么复杂。所以在比较操作中,如果不同类型进行比较,不建议使用==运算符,而是使用严格相等===运算符,因为使用严格相等运算符读者会非常清晰地知道:在比较中没有涉及任何强制转换。否则,你需要读者准确的记住这些强制转换规则以解读代码的行为。

另外一个增加代码可读性的方法就是显示的进行数据类型转换:

代码1:

var today = new Date();

if(form.month.value == (today.getMonth() + 1) &&
form.day.value == today.getDate()){
//happy birthday...
}

代码2:

var today = new Date();

if(+form.month.value == (today.getMonth() + 1) &&
+form.day.value == today.getDate()){
//happy birthday...
}

很显然,代码2更加清晰地向读者传达了代码在做什么样的转换,它只是显式的使用Number函数或者一元运算符 + 将值转换为数字,而不要求读者记住这些转换规则。

JavaScript在应用中的技巧(二)的更多相关文章

  1. JavaScript在应用中的技巧(一)

    分享一些在JavaScript中遇到的一些实用的技巧. 理解JavaScript的数值型数据类型 JavaScript的数值型数据类型只有一种:number.即不管是整数还是浮点数,JavaScrip ...

  2. (译文)12个简单(但强大)的JavaScript技巧(二)

    原文链接: 12 Simple (Yet Powerful) JavaScript Tips 其他链接: (译文)12个简单(但强大)的JavaScript技巧(一) 强大的立即调用函数表达式 (什么 ...

  3. Javascript的闭包及其使用技巧实例

    Javascript的闭包及其使用技巧实例 一.闭包的基本概念 闭包(Closure)是一个引用了自由变量的函数,记录了该函数在定义时的scope chain.又称词法闭包(Lexical Closu ...

  4. SQL开发技巧(二)

    本系列文章旨在收集在开发过程中遇到的一些常用的SQL语句,然后整理归档,本系列文章基于SQLServer系列,且版本为SQLServer2005及以上-- 文章系列目录 SQL开发技巧(一) SQL开 ...

  5. 更快学习 JavaScript 的 6 个思维技巧

    更快学习 JavaScript 的 6 个思维技巧 我们在学习JavaScript,或其他任何编码技能的时候,往往是因为这些拦路虎而裹足不前: 有些概念可能会造成混淆,尤其当你是从其他语言转过来的时候 ...

  6. 细数Javascript技术栈中的四种依赖注入

    作为面向对象编程中实现控制反转(Inversion of Control,下文称IoC)最常见的技术手段之一,依赖注入(Dependency Injection,下文称DI)可谓在OOP编程中大行其道 ...

  7. 【javascript】html5中使用canvas编写头像上传截取功能

    [javascript]html5中使用canvas编写头像上传截取功能 本人对canvas很是喜欢,于是想仿照新浪微博头像上传功能(前端使用canvas) 本程序目前在谷歌浏览器和火狐浏览器测试可用 ...

  8. SQL开发技巧(二) 【转】感觉他写的很好

    本文转自: http://www.cnblogs.com/marvin/p/DevelopSQLSkill_2.html 本系列文章旨在收集在开发过程中遇到的一些常用的SQL语句,然后整理归档,本系列 ...

  9. Eclipse用法和技巧二十四:当git遇上eclipse

    git是非常优秀的代码管理工具,eclipse是非常不错的,免费的IDE.工作中两者碰到一起,有点麻烦了:eclipse对于每个项目会生成一些特定的文件,而这些文件又不是项目必须的,并且每个人的配置是 ...

随机推荐

  1. Android学习笔记-ScrollView(滚动条)

    本节引言: 本节带来的是Android基本UI控件中的第十个:ScrollView(滚动条),或者我们应该叫他 竖直滚动条,对应的另外一个水平方向上的滚动条:HorizontalScrollView, ...

  2. css中的几个小tip(一)

    原博:http://www.webhek.com/post/7-tips-web-front-developer-must-know__trashed.html 1.元素的margin-top.mar ...

  3. MySQL系列(四)---引擎

    MySql中的引擎 目录 MySQL系列(一):基础知识大总结 MySQL系列(二):MySQL事务 MySQL系列(三):索引 引擎种类 FEDERATED MRG_MYISAM MyISAM BL ...

  4. Solr6.5配置中文分词器

    Solr作为搜索应用服务器,我们在使用过程中,不可避免的要使用中文搜索.以下介绍solr自带的中文分词器和第三方分词器IKAnalyzer.  注:下面操作在Linux下执行,所添加的配置在windo ...

  5. akoj-1055-矩阵乘法

    矩阵乘法 Time Limit:1000MS  Memory Limit:65536K Total Submit:19 Accepted:7 Description 矩阵乘法是线性代数中最基本的运算之 ...

  6. [C#] out vs ref

    当需要从一个方法中有多个返回值时可以考虑使用out和ref这两个关键字.下面通过代码的方式来说明两者的用法和不同之处. 例如现在有一个如下的Add方法,Add方法只有一个返回值. static int ...

  7. sqlite 的基本使用1

    mac 下自带的sqlite3 直接在终端键入 sqlite3 即进入 sqlite的交互界面 1,创建数据库 sqlite3 命令 被用来创建新的数据库 比如sqlite3 mydb,即创建了一个m ...

  8. MATLAB匹配按列碎开的纸片

    纵向切开的纸片的拼接 2013 CUMCM_B %% paper_cutting.m clear, close all clc %% import pictures, and save into im ...

  9. sqlite数据库之简单操作

    一 sqlite介绍 Sqlite是一种嵌入式数据库,类似于一个文件系统,是跟程序在一起的.跟mysql等数据库程序跟数据分离是不一样的. 应用场景:常用于保存本地配置,类似于本地文件系统,因此他内嵌 ...

  10. python-----运算符及while循环

    一.运算符 计算机可以进行的运算有很多种,不只是加减乘除,它和我们人脑一样,也可以做很多运算. 种类:算术运算,比较运算,逻辑运算,赋值运算,成员运算,身份运算,位运算,今天我们先了解前四个. 算术运 ...