til
  • README
  • Software Development Roles
  • solid
  • README
    • service-worker
  • docker
    • arg
    • 更新docker版本
  • editor
    • vscode
    • Creating a VS Code Theme
  • english
    • words
  • front-end
    • ==
    • ECMAScript
    • IIFE
    • Label
    • basic
    • html.js.css渲染顺序
    • npm-vs-yarn
    • obj-delete-key-value
    • react
    • split-join-and-replace
    • video
    • 前端自检清单
    • 递归及去重
    • css
      • css换肤
      • flex
      • list
      • nth-child和nth-of-type区别
      • padding
      • position
      • 层叠上下文
      • 层叠样式(+)
      • 正方形
      • 语义化标签
    • dom
      • DOCTYPE
      • HEAD
      • 修改document
      • 自定义表单验证
    • electron
      • basic
    • es6
      • basic-type
      • basic
      • prototype-example
      • defineProperty
      • understanding-es6
        • 0.introduction
        • Appendix A: Smaller Changes
        • Appendix B: Understanding ES7
        • Block-Binding
        • Proxies&Reflection
        • class
        • 解构赋值
        • function
        • improved-array
        • iterators&generators
        • modules
        • object
        • promise
        • Map&Set
        • symbol
    • images
      • 前端角度看图片
    • interview_case
      • lexical_scope
      • redux和localstroage存储位置
    • javascript
      • fuck-the-js
      • js-engine-work
      • js原生操作dom
      • what-is-function-program
      • 执行上下文
      • articles
        • JavaScript中使用函数组合
        • JavaScript中的依赖注入
        • JavaScript作用域链中的标识符解析和闭包
        • JavaScript是何如工作的--概述
        • JavaScript深拷贝
        • JavaScript的全局变量是如何工作的
        • js继承常见的误解
        • node12&chrome中7个新的提案功能
        • 你真的懂JavaScript吗
      • date
        • index
      • engines
        • basic
        • JavaScript引擎基础:外形和内联缓存
        • v8中推测性优化的介绍
        • 优化原型
        • 更快的异步功能和promise
      • events
        • baisc
        • 事件冒泡和捕获
        • 定义事件
        • 页面生命周期
      • higher-order-function
        • curry
        • monad
      • module
        • basic
        • main&module
      • objects
        • iterator
        • spread
        • examples
          • iterator
      • performance
        • blocking-css
        • cache
      • prototype
        • Property-Descriptors
        • basic
        • prototype-shadow
      • you-dont-known-js
        • async&performance
          • Chapter 1: Asynchrony: Now & Later
          • Chapter 2: Callbacks
          • Chapter 3: Promises
          • Chapter 4: Generators
        • scope & closures
          • apA
          • apB
          • apC
          • apD
          • chapter1-what-is-scope
          • chapter2-lexical-scope
          • chapter3-function-vs-block-scope
          • chapter4-hoisting
          • chapter5-scope-closure
        • this & object prototypes
          • chapter1-this-or-that
          • chapter2-this-make-sense
          • chapter3-objects
          • chapter4-mixing(up)-class-object
          • chapter5-prototype
          • chapter6-behavior-delegation
        • types&grammer
          • Chapter1-Types
          • Chapter2-Values
          • Chapter3-Natives
          • Chapter4-coercion
          • Chapter5-grammer
        • up & going
          • chapter1-into-programming
          • chapter2-into-javascript
          • chapter3-into-YDKJS
    • mobile
      • iPhone分辨率终极指南
    • npm
      • arguments
      • build
    • react-native
      • prop-methods
    • react
      • PropTypes
      • basic
      • codebase-overview
      • component-element-instance
      • context
      • how-to-known-component-is-func-or-class
      • overview
      • react16.9
      • react18计划
      • react的设计原则
      • reconciliation
      • setState
      • useMemo
      • why-do-we-write-super-props
      • 从头实现一个react
      • concurrent
        • 引入并发模式(仅试验)
      • conf
        • conf-2019
      • events
        • 合成事件概述
      • hooks
        • custom-hook
        • effect-hook
        • hooks-api
        • intro
        • overview
        • rules
        • state-hook
        • hooks-vs-class
          • thinking-in-react-hooks
      • overreact
        • Development模式是如何工作的
        • How-Does-setState-Know-What-to-Do
        • Why-Do-React-Elements-Have-a-$$typeof-Property
        • Why-Do-React-Hooks-Rely-on-Call-Order
        • how-to-known-component-is-func-or-class
        • preparing-tach-talk-motivation
        • react作为ui运行
        • things-i-dont-known-as-2018
        • ui-element-problem-and-build-yourself
        • why-do-we-write-super-props
        • 一份完整的useEffect指南
        • 为什么X不是Hook
        • 函数组件与类有什么不同?
        • 演讲准备2-what-why-how
        • 编写弹性组件
        • 让setInterval在React-Hooks中为声明式
      • practice
        • render
      • react-dom
        • basic
      • react-redux
        • apiv7.1-hooks
        • connect
        • shallow-equal
      • redux
        • applyMiddleware
        • applyMiddleware2-细节
        • example
    • regex
      • index
    • stories
      • 数组下标
      • 阻止事件冒泡
    • svelte
      • compile-svelte-in-your-head-1
      • compiler-overview
      • parser
        • 写一个解析器-JavaScript的JSON解析器
    • turbopack
      • basic
    • typescript
      • interface和type的区别
    • webpack
      • hash
      • webpack4-for-react
      • webpack4
      • webpack4to5
      • babel
        • babel-parser和acorn的区别
        • babel.7.11
        • family
        • react16.14使用new-transform
        • update-to-7
    • pdf
      • deep-js
        • basic
      • react
        • reintroducing
  • git
    • capital
    • emoji
  • http
    • http2.0
    • response
  • rails
    • api
    • flash
    • middleware-vs-metal
    • model
    • performance
    • routes
    • environment
      • error
    • patterns
      • service
    • sidekiq
      • params
    • deploy
      • capistrano
        • ssh
  • ruby
    • self
    • net
      • http请求携带cookie
  • server
    • ss
    • ssh
    • user
    • crawler
      • puppeteer
    • nginx
      • domain-without-80
      • nginx节省带宽
  • sql
    • rails
    • search
Powered by GitBook
On this page
  • 整数的工作机制
  • 识别整数
  • Safe Integers
  • new math methods
  • Unicode Identifiers
  • Formalizing the proto Property
  1. front-end
  2. es6
  3. understanding-es6

Appendix A: Smaller Changes

Previous0.introductionNextAppendix B: Understanding ES7

Last updated 6 years ago

整数的工作机制

在之前类型化数组里有讨论到关于,IEEE 754引起了很多的混乱。 js需要付出巨大努力才能确保开发人员不必担心数字编码的细节,但问题仍然不时泄漏。ES 6旨在通过使整数更容易识别和使用来解决这个问题。

识别整数

ES6添加了Number.isInteger方法来表示是否整数。虽然js使用IEEE 754编码系统来表示整数和浮点型,但是他们的存储有些不同,isInteger就是利用这一点,去检查值是不是一个整数。这就意味着看起来是浮点型的数字,可能存储的是整数,导致isInteger返回的是true。

console.log(Number.isInteger(25));      // true
console.log(Number.isInteger(25.0));    // true
console.log(Number.isInteger(25.1));    // false

Safe Integers

IEEE 754只能准确地表示-2的53次方和2的53次方之间的整数,并且在这个“安全”范围之外,二进制最终会复用于多个数值。 这就意味着js只能表示这个安全范围内的数字:

console.log(Math.pow(2, 53));      // 9007199254740992
console.log(Math.pow(2, 53) + 1);  // 9007199254740992

可以发现,超出这个范围就不行了。 ES6通过Number.isSafeInteger方法去识别一个数字是不是安全的。Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER表示最大和最小的值。 看下面这个例子:

var inside = Number.MAX_SAFE_INTEGER,
    outside = inside + 1;

console.log(Number.isInteger(inside));          // true
console.log(Number.isSafeInteger(inside));      // true

console.log(Number.isInteger(outside));         // true
console.log(Number.isSafeInteger(outside));     // false

你可以试下,MAX_SAFE_INTEGER就是2的53次方减1。

new math methods

ECMAScript 6为Math对象添加了几种方法,以提高常见数学计算的速度。提高通用计算的速度还可以提高执行许多计算的应用程序的整体速度,例如图形程序。

Math.acosh(x)返回x的反双曲余弦值。

Math.asinh(x)返回x的反双曲正弦值。

Math.atanh(x)返回x的反双曲正切

Math.cbrt(x)返回x的立方根。

Math.clz32(x)返回x的32位整数表示中的前导零位数。

Math.cosh(x)返回x的双曲余弦值。

Math.expm1(x)返回从x的指数函数中减去1的结果。

Math.fround(x)返回x的最近的单精度浮点数。

Math.hypot(... values)返回每个参数的平方和的平方根。

Math.imul(x,y)返回执行两个参数的真正32位乘法的结果。

Math.log1p(x)返回1 + x的自然对数。

Math.log10(x)返回x的基数10对数。

Math.log2(x)返回x的基数2对数。

Math.sign(x)如果x为负,则返回-1;如果x为+0或-0,则返回0;如果x为正,则返回1。

Math.sinh(x)返回x的双曲正弦值。

Math.tanh(x)返回x的双曲正切值。

Math.trunc(x)从float中移除小数位并返回一个整数。

解释每种新方法及其详细功能超出了本章的范围。但是,如果对应用程序需要进行常见的计算,请务必在自己实现之前检查新的Math方法。

Unicode Identifiers

ES6相对之前的版本提供了更好的支持,它还可以更改可用作标识符的字符。在ECMAScript 5中,已经可以将Unicode转义序列用于标识符。例如:

// Valid in ECMAScript 5 and 6
var \u0061 = "abc";

console.log(\u0061);     // "abc"

// equivalent to:
console.log(a);          // "abc"

在此示例中的var语句之后,可以使用\ u0061或a来访问该变量。在ECMAScript 6中,还可以使用Unicode代码点转义序列作为标识符,如下所示:

// Valid in ECMAScript 5 and 6
var \u{61} = "abc";

console.log(\u{61});      // "abc"

// equivalent to:
 console.log(a);          // "abc"
  1. 第一个字符必须是$,_或任何带有ID_Start的派生核心属性的Unicode符号。

  2. 每个后续字符必须是$,_,\ u200c(零宽度非连接符),\ u200d(零宽度连接符),或具有ID_Continue的派生核心属性的任何Unicode符号。

ID_Start和ID_Continue派生的核心属性在Unicode标识符和模式语法中定义,作为识别适用于变量和域名等标识符的符号的方法。该规范不是特定于JavaScript。

Formalizing the proto Property

甚至在ECMAScript 5``完成之前,几个JavaScript引擎已经实现了一个名为__proto__的自定义属性,可用于获取和设置[[Prototype]]属性。 实际上,__ proto__是Object.getPrototypeOf和Object.setPrototypeOf方法的早期前身。期望所有JavaScript引擎删除此属性是不 现实的(有流行的JavaScript库使用__proto__),因此ECMAScript6也正式化了__proto__行为。但正式化出现在ECMA-262的附录B中以及此警告:

这些功能不被视为核心ECMAScript语言的一部分。编写新的ECMAScript代码时,程序员不应使用或假设存在这些特性和行为。不鼓励ECMAScript实现这 些功能,除非实现是Web浏览器的一部分或者需要运行Web浏览器遇到的相同的旧ECMAScript代码。

ECMAScript规范建议使用Object.getPrototypeOf和Object.setPrototypeOf,因为__proto__具有以下特征: 1. 只能在对象文字中指定__proto__一次。如果指定两个__proto__属性,则会引发错误。这是具有该限制的唯一对象文字属性。 2. 计算形式[“__ proto__”]的作用类似于常规属性,不会设置或返回当前对象的原型。与对象文字属性相关的所有规则都适用于此形式,而非计算形式则具有例外。

虽然应该避免使用__proto__属性,但规范定义它的方式很有趣。在ECMAScript 6引擎中,Object.prototype .__ proto__被定义为一个访问器属性, 其get方法调用Object.getPrototypeOf并且其set方法调用Object.setPrototypeOf方法。这与使用__proto__和Object.getPrototypeOf/ Object.setPrototypeOf之间 没有什么区别,只是__proto__允许直接设置对象文字的原型。看下面例子:

let person = {
    getGreeting() {
        return "Hello";
    }
};

let dog = {
    getGreeting() {
        return "Woof";
    }
};

// prototype is person
let friend = {
    __proto__: person
};
console.log(friend.getGreeting());                      // "Hello"
console.log(Object.getPrototypeOf(friend) === person);  // true
console.log(friend.__proto__ === person);               // true

// set prototype to dog
friend.__proto__ = dog;
console.log(friend.getGreeting());                      // "Woof"
console.log(friend.__proto__ === dog);                  // true
console.log(Object.getPrototypeOf(friend) === dog);     // true

此示例不是调用Object.create来创建friend对象,而是创建一个标准对象文字,为__proto__属性赋值。使用Object.create方法创建对象时,必须为任何其他对象属性指定完整属性描述符。不够直接。

此外,ECMAScript 6根据Unicode,它提供了以下规则:

js存储数字类型的不同
标准附件#31:Unicode标识符和模式语法正式指定了有效标识符