Object题

in js with 0 comment views: 226 times

问题???

var a = {};
var b = {key: 'b'};
var c = {key: 'c'};
var d = [3,5,6];
a[b] = 123;
a[c] = 345;
a[d] = 333;
console.log('a[b]=',a[b]);
console.log('a[c]=',a[c]);
console.log('a[d]=',a[d]);

答案

QQ20180402-111400.png

解析

a[b]=a['[object Object]']=123
a[c]=a['[object Object]']=345
a[d]=a['3,5,6']=333
// 所以
a[b]=a['[object Object]']=345
a[c]=a['[object Object]']=345
a[d]=a['3,5,6']=333

我们可以打印出来看到a的值是什么?

QQ20180402-111607.png

对象的key值是一个字符串,
Object内置toString 和 valueOf 方法;
这种情况a[b] = 123 会默认调用对象的toString().
b与c都是一个对象,将他们作为a的key值会先转化为字符串,
对象转化为字符串后是[object Object],
所以a[b]=123就是a['[object Object]']=123,
执行a[c] = 345;的时候会把a['[object Object]']重新赋值为345,
所以打印a[c]与a[d]就是对a['[object Object]']的取值,结果都是345
而数组的toStirng()使用的是join()方法;
所以a是 {'[object Object]':345,'3,5,6':333};

可以看下js的隐式转换,如数字与字符串相加时,会调用数字的toString方法,把数字先转化为字符串。
js中的对象与数组转化为字符串时,会先调用valueOf方法,但是对象与数组本身没有valueOf方法,
就会去原型链上找,最终都找到了Object.prototype.valueOf这个方法,
这个方法会把对象与数组本身返回出去,也就是转换失败,
会继续调用tostring方法,对象与数组本身也没有tostring方法的话,
还是会去原型链上找,不同的是对象找到了Object.prototype.toString,返回了"[object Object]",
而数组找到了Array.prototype.toString,返回了join(',')拼接的格式。

Object.prototype.toString.apply({});
//"[object Object]"
Array.prototype.toString.apply([1,2]);
//"1,2"

再底层的(这个函数里面写了啥)我就不知到了,没看过,但是

Array.prototype.toString.apply(12)
//"[object Number]"
Array.prototype.toString.apply("s")
//"[object String]"

参考链接:

参考1:https://segmentfault.com/q/1010000013887286/a-1020000013892535
参考2:https://www.cnblogs.com/imwtr/p/4392041.html

Responses