神奇的javascript

时间: 2019-10-26阅读: 991标签: 特性

看一张图


这张图对js魔法的吐槽可谓非常到位。下面,我们就从这张图出发来详细讲讲js


数字类型与精度问题

虽然js是弱类型语言,声明变量时也不需要显式指定类型。但是,数据本身依旧还是有类型的,比如数字和字符串就是以不同形式存在的数据。在js中,所有数字的类型都为number。其中,一个特殊的数字就是NaN(Not a number),虽然名字叫“不是数”,但为了计算的一致性(IEEE745亦规定),NaN依旧是数字类型的。任何NaN参与的数字计算的结果都还是NaN。(NaN-NaN!=0)还需要注意的是,js中被0除非但不会报错,而且结果也不是NaN(只有0/0是NaN),而是Infinity(被除数为正)或-Infinity(被除数为负)。

由于将整数和浮点数统一处理,所以js并不存在整数和浮点数的区别——所有数字都以64位有符号浮点数(IEEE745格式)的形式存储。因此,舍入误差是js数字类型的一个大坑。最经典的当然就是0.1+0.2!=0.3了。其实这不是js的锅,大部分编程语言都有这个问题。简单的解释可以查看http://0.30000000000000004.com。很多人对浮点数都有误解,认为0.1是1 \times 10^{-1}1×10

−1

,所以可以正确的表示0.1,然而浮点数并不是这样。在2为基数的情况下,0.1=1/10是一个无限循环小数,所以在运算时会产生舍入误差。想要进一步了解可以查阅有关数值计算的材料。


Max、Min与函数参数

在js中,函数参数也是一种魔法。一般编程语言中,形参具有类似“约束”的作用,即实参的数量要与形参相符(默认值除外)。但是js魔法并不需要形参和实参相匹配,多的实参忽略,少的就是undefined。事实上,js还提供了一种访问参数的方法。在函数体上下文中,js提供了arguments(类似Python的*args)以便参数的访问。考虑到没有卵用的形参,js函数的形参更像是一个别名。

在Python中,函数重载可以通过默认值实现,而在js中,你可以随心所欲的解析arguments,可以说是很硬核了。

回到我们的max和min。EMCAScript v3之后,max和min就支持任意数量参数的调用了。从逻辑上考虑,既然没有传入任何数,那取最大的函数就不能返回一个能大于任何数的数,所以返回-Infinity不无道理。min亦然。


魔法操作符+、-

为了更好的理解接下来的坑,我们有必要先看看+、-两个操作符。这俩操作符神奇就神奇在,他们不仅仅是双目运算符,也同时是单目运算符!对于+,双目运算时其意义是数字加或字符串拼接。这里有个很坑的地方,就是只要参与运算的值不全是数字,那么+就会被视为字符串拼接(String.concat),从而把所有参数转换为字符串并进行拼接。单目运算时,+被视为取正,所有传入的参数都会被转换为数字并取正。(然而取正并没有任何卵用,所以其实就是转为数字)

相比之下-就和蔼了许多,双目是数值减,单目这是取反。


无奈的解释器

下面这个魔法涉及到的东西很多,不过我还是打算把它归类到解释器的范畴,而且这个锅要丢给REPL。{}+[]具歧义,可以被理解为:

(作为值理解)对象{}+数组,+为双目

(作为代码块理解){}为代码块,+是单目

而这两种理解下的结果也是不同的。而在REPL的上下文下,js解释器采用了第二种理解。而一旦上下文变化,提示解释器这是表达式时,解释器就会采用第一种理解。比如console.log({}+[])的结果就不再是0了。


隐式类型转换

之前在说+、-的时候,我提到了一些隐式的转换,其实这样的转换远不止出现在+、-。比如取反!,就会转成布尔型再取反。所以!+[]就是true,![]是false。考虑到运算优先级,最后得到”truefalse”。

作为一个弱类型语言,js的逻辑是,如果类型不对,那就转过去。


==与===

这是个老生常谈的东西了。这里不多讲,只要知道==可能会隐式转换类型就行。


后记

我写这篇文章的目的并不是解释这张图,因为这张图里的很多知识并不是实际编程所需要的(就像i+++++i,这些是我认为不重要的知识)。我是希望借这张图聊到一些js的语法特性,以加深对js的理解。这两点在我看来有本质的区别。

原文 https://www.qdtalk.com/2019/10/27/神奇的JavaScript/


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: http://www.fly63.com/article/detial/6172

ES6 Math方法和Number新特性简介

Math.sign() 函数返回一个数字的符号, 指示数字是正数,负数还是零。此函数共有5种返回值, 分别是 1, -1, 0, -0, NaN. 代表的分别是正数, 负数, 正零, 负零, NaN。

CSS 特性和值

CSS 声明可以为空,或者由 CSS 特性( property ),后加一个冒号 :,跟着是一个特性的值构成。中间可以有空格将它们隔开。

ES2019 新特性汇总

最近 ECMAScript2019,最新提案完成:tc39 Finished Proposals,我这里也是按照官方介绍的顺序进行整理,如有疑问,可以查看官方介绍啦~另外之前也整理了 《ES6/ES7/ES8/ES9系列》,可以一起看哈。

Html5、Css3、ES6的新特性

Html5的新特性语义化标签:有利于SEO,有助于爬虫抓取更多的有效信息,爬虫是依赖于标签来确定上下文和各个关键字的权重。表单新特性,多媒体视频(video)和音频(audio)

ES6新特性--var、let、const

var不存在块级作用域,具有变量提升机制。 let和const存在块级作用域,不存在变量提升。在同一作用域内只能声明一次。const在声明时需要赋值且无法修改,但如果常量是对象,则对象的属性可以修改。

ES12(2021)新特性: replaceAll、Promise.any、WeakRefs、数字分隔符、逻辑运算符和赋值表达式

2021年3月13日,ES2021 候选提案发布了其最终功能集的版本。如果它能够在今年6月的ECMA 大会上通过,就会成为官方的标准!这个候选提案提及到ECMAScript新特性如下所示:

CSS 的特性值

在介绍 CSS 的特性和值的时候,特地的提到了浏览器应该怎样处理错误的值 -- 应该将包含错误值,不符合句法的值的声明直接忽略。然而有些浏览器却按照自己的方式做了某些纠正,也就是浏览器容错

Angular 8的新特性介绍

在今天早些时候Angular团队发布了8.0.0稳定版。其实早在NgConf 2019大会上,演讲者就已经提及了从工具到差分加载的许多内容以及更多令人敬畏的功能。下面是我对8.0.0一些新功能的简单介绍,希望可以帮助大家快速了解新版本

你可能不知道的JS特性:可选链

今天我们来介绍一个你可能没见过的 JS 新特性,目前处于 Stage 3 阶段,它叫作 可选链(optional chaining),它可能解决很多人都面对过的痛点,让我们来了解这下~

Js对象属性的特性 和defineProperty方法

对象是无序属性的集合,而这些属性在创建是都带有一些特征值(可以理解为属性的属性,天生自带的),这些特征值是为了实现JavaScript引擎用的,因此JavaScript不能直接访问

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!