标签：获取 使用 理论 划线 使用字符串 expect bool 一个 error:
一般来说，‘.‘运算符和[]可以相互替代,比如
1 let obj = {
2 name : ‘sena‘
3 };
4
5 console.log(obj.name) // ‘sena‘
6 console.log(obj[name]) // ‘sena‘
在这之上,我们需要了解关于他们的一些限制
.运算符: 右侧必须是一个属性名称命名的简单标识符
[] : 右侧必须是一个计算结果为字符串的表达式
先复习一下JS中的标识符:
/*
标识符
- 在JS中所有的可以由我们自主命名的都可以称为是标识符
- 例如：变量名、函数名、属性名都属于标识符
- 命名一个标识符时需要遵守如下的规则：
1.标识符中可以含有字母 、数字 、下划线_ 、$符号
2.标识符不能以数字开头
3.标识符不能是ES中的关键字或保留字
4.标识符一般都采用驼峰命名法
- JS底层保存标识符时实际上是采用的Unicode编码，
所以理论上讲，所有的utf-8中含有的内容都可以作为标识符
*/
嗯,这里就可以看出.的缺陷了,如果对象中的属性刚好不符合标识符的规范,就不能用.来访问
比如说:
let obj = {"1" : 123}
console.log(obj.1); // Uncaught SyntaxError: Unexpected number
let obj1 = {"star gf" : ‘sion‘};
console.log(obj1.star gf); //Uncaught SyntaxError
所以这里只能用[]
let obj = {"1" : 123}
obj["1"] // 123
let obj1 = {"star gf" : ‘sion‘};
console.log(obj1[‘star gf‘]); // sion
然后我们再来看看[]
[]右边必须是一个计算结果为字符串的表达式,这给了[]非常强大的功能
let target = ‘name‘;
let obj3 = {
name : ‘sena‘
};
//使用变量
console.log(obj3[target]); //sena
//使用字符串拼接
console.log(‘na‘ + ‘me‘); //sena
如果[]里面不是一个表达式,而是一个原始值或者对象,事情就开始变得有意思起来了,总结了一下规律大概就是下面两个
1. 如果里面的是一个原始值,那么就直接把原始值变成相应的字符串(0 -> ‘0‘ , true -> ‘true‘ , null -> ‘null‘, undefined -> ‘undefined‘)(值得注意的是不是调用相应包装类原型上的toString(),而且undefined和null也没有包装类)
2.如果里面的不是一个原始值,那么就调用toString变成字符串
/*调用toString的情况*/
let obj1 = { ‘name‘ : ‘sena‘, ‘true‘ : ‘sion‘, }; let obj2 = { toString(){ return ‘name‘; } }; let arr5 = []; arr5.toString = function(){ return ‘name‘; }; function fun() { return ‘name‘; } fun.toString = function () { return ‘name‘; }; console.log(obj1[obj2]); //sena console.log(obj1[fun]); //sena console.log(obj1[arr5]); //sena
/*直接转化的情况*/
let obj3 = { "undefined" : 1, "null" : 2, "true" : 3, "1" : 4, ‘name‘ : ‘sena‘ }; /*重写了包装类的原型toString*/ Boolean.prototype.toString = function(){ return ‘name‘; }; console.log(obj3[1]); //4 console.log(obj3[true]); //3 这里可以证明没有调用包装类上的toString console.log(obj3[null]); //2 console.log(obj3[undefined]); //1
标签：获取 使用 理论 划线 使用字符串 expect bool 一个 error:
原文地址：https://www.cnblogs.com/Himeno-Sena/p/11374704.html
