一、遇到的问题
本来是研究 JS 的原型污染,后来发现有个小细节别人都没讲,JSON.parse()
和 对象字面量
对于 __proto__
的处理是不同的,特此记录分析的过程;
使用 lodash 4.17.10 之前的版本
- 对象字面量不会触发原型污染:
function Person(name) {
this.name = name;
}
let lee = new Person('lee');
let o1 = {"a": 1, "__proto__": {"b": 2}};
_.defaultsDeep(lee,o1);
let tom = new Person('tom');
console.log(tom.b);
- JSON.parse()会触发原型污染
function Person(name) {
this.name = name;
}
let lee = new Person('lee');
let o1 = JSON.parse('{"a": 1, "__proto__": {"b": 2}}');
_.defaultsDeep(lee,o1);
let tom = new Person('tom');
console.log(tom.b);
二、代码说明:
2.1 JSON.parse() 测试
let o1 = JSON.parse('{"a": 1, "__proto__": {"b": 2}}');
const hasKey = o1.hasOwnProperty('__proto__');
const val = o1.__proto__;
const isEqual = Object.getPrototypeOf(o1,'__proto__') === o1.__proto__;
console.log(`1. o1 有自身的属性 __proto__ 吗?${hasKey }`);
console.log(`2. 打印 o1 的自身属性 __proto__: `);
console.log(val);
console.log(`3. 比较 o1 的原型对象和自身的属性 __proto__: ${isEqual }`);
let keyArr = [];
for(let key in o1) {
keyArr.push(key);
}
console.log(`4. 打印 o1 的键值:${keyArr.join(',')}`);
2.2 对象字面量测试
let o1 = {"a": 1, "__proto__": {"b": 2}};
const hasKey = o1.hasOwnProperty('__proto__');
const val = o1.__proto__;
const isEqual = Object.getPrototypeOf(o1,'__proto__') === o1.__proto__;
console.log(`1. o1 有自身的属性 __proto__ 吗?${hasKey }`);
console.log(`2. 打印 o1 的自身属性 __proto__: `);
console.log(val);
console.log(`3. 比较 o1 的原型对象和自身的属性 __proto__: ${isEqual }`);
let keyArr = [];
for(let key in o1) {
keyArr.push(key);
}
console.log(`4. 打印 o1 的键值:${keyArr.join(',')}`);
通过上述两个测试,可以发现一些不同之处:
- JSON.parse() 将
__proto__
变成了对象的自身属性,而且并未改动对象的原型对象。 - 对象字面量并没有
__proto__
这个自身属性,__proto__
指代的就是对象的原型对象。
我们知道 for...in
只能够遍历到对象的可枚举的属性(包括对象自身的属性,原型链上的属性),所以通过对象字面量创建的对象中,无法遍历到 __proto__
。
三、V8 ignores keys named proto in JSON.parse
具体的讨论可移步至 proto-and-json
个人觉得 V8 ignores keys named proto in JSON.parse
的说明是不完整的,这句话的翻译是:v8 忽略了在 JSON.parse() 参数中特殊的键名 __proto__
,没有将 __proto__
的值直接替换对象本来的原型对象,而是又定义了一个对象的自有属性 __proto__
。(注意对象此时有 2 个__proto__
属性,一个是枚举的,对象自身的属性;另一个是不可枚举的,指向原型对象)。
四、JSON.parse() 是如何实现在对象上新增一个键名为 __proto__
的自身属性的?
翻看 JSON.parse() 的源码可以发现:
j = eval("(" + text + ")");
内部是通过 eval
执行经过校验以及正则替换后的字符串。到此本来没法进行下一步分析了,因为也不知道 eval 内部的执行机制。
又发现一篇文章 proto in ECMAScript 6
里面提到两个概念:define
和 assign
。
4.1 defineProperty
下面的例子,可以发现和json.parse()
是相同的,在对象上新定义了一个自有属性__proto__
,而不是直接更改指向原型对象的那个__proto__
。
let o1 = {};
Object.defineProperty(o1, '__proto__',{ value: {b: 123}, enumerable: true });
const hasKey = o1.hasOwnProperty('__proto__');
const val = o1.__proto__;
const isEqual = Object.getPrototypeOf(o1,'__proto__') === o1.__proto__;
console.log(`1. o1 有自身的属性 __proto__ 吗?${hasKey }`);
console.log(`2. 打印 o1 的自身属性 __proto__: `);
console.log(val);
console.log(`3. 比较 o1 的原型对象和自身的属性 __proto__: ${isEqual }`);
let keyArr = [];
for(let key in o1) {
keyArr.push(key);
}
console.log(`4. 打印 o1 的键值:${keyArr.join(',')}`);
4.2 assign
其实 assign 对应的行为就是对象字面量。
对象本身就有一个__proto__
属性(注意不是自身的属性),指向对象的原型对象,即使字面量里面有一个键名为 __proto__
的属性,js 的内部运行机制也是把键名为 __proto__
的属性的值 assign 到原型对象中,直接替换了原有的值,并不会真正的为对象再创建一个自身的属性 __proto__
。
推荐阅读
proto in ECMAScript 6
深入理解 JavaScript Prototype 污染攻击
fix: prototype pollution in _.defaultsDeep