a = 1;
a.b = 2;
a.b // undefined
对一个原始值1添加属性，
会在该原始值的基础上，自动创建一个包装对象，temp = new Number(1)，
a.b = 2;赋值操作，实际上是为这个包装对象添加属性temp.b = 2;，
此时，a的值还是原始值1。
等到我们再访问原始值1的属性a.b，
则会创建一个新的包装对象，temp2 = new Number(1)，
当然有，temp2.b === undefined。
下面我们从ES2017规范的角度来验证一下。
1. 获取属性
我们先来看获取属性值，过后再来看添加属性。
1.1 语法和语义
属性访问涉及到的产生式（production）和动态语义（runtime semantics）如下：
12.3.2.1 Runtime Semantics: Evaluation
其中，bv是通过调用RequireObjectCoercible得来的。
针对不同的参数类型，RequireObjectCoercible的返回值情况如下，
Undefined，Null：抛TypeError异常，
Boolean，Number，String，Symbol，Object：直接将参数返回。
得到bv以后，最终会返回一个引用类型（The Reference Specification Type）的值，
它的base value component为bv，reference name component为propertyNameString。
1.2 引用类型的GetValue
引用类型，是一个规范内置类型（Specification Type），
可以参考，6.2.4 The Reference Specification Type。
对于引用类型，可以通过内置的GetValue / PutValue来取值和赋值。
这里可以先看GetValue，PutValue大同小异。
可以看到，如果IsPropertyReference为true，并且HasPrimitiveBase也为true，
就会将base设置为ToObject(base)。
其中ToObject，会针对不同的参数类型，返回不同的结果：
Undefined，Null，抛TypeError异常，
Object，直接将参数返回，
Boolean，Number，String，Symbol，返回对应的包装对象。
我们问题中遇到的读取a.b的值，就是这种场景，
其中a为1，则base就被设置为了new Number(1)。
而后的base.[[Get]]是调用Object类型的内置[[Get]]方法，
最终得到属性值。
注：
NOTE中写道，5.a.ii Set base to ! ToObject(base).可能会创建一个对象，
这个对象在GetValue之外，以及[[Get]]方法之外，外界无法访问。
具体实现中，可以不必实际新建一个对象。
2. 添加属性
2.1 语法和语义
添加属性涉及到的产生式和动态语义如下：
12.15.4Runtime Semantics: Evaluation
其中，LeftHandSideExpression可以是MemberExpression，
而MemberExpression可以是MemberExpression.IdentifierName，
因此，LeftHandSideExpression求值后可能会得到一个引用类型的值，
用以表示对属性值的引用。
分析动态语义部分，发现最终调用了PutValue(lref, rval)。
2.2 引用类型的PutValue
而PutValue和以上介绍的GetValue都有ToObject的过程。
因此，实际添加属性的是这个新建的Object对象，
而不是那个原始值对象。
参考
ES2017: 6.2.4 The Reference Specification Type
ES2017: 12.3.2 Property Accessors
ES2017: 12.15 Assignment Operators
网友评论