js对象属性 通过点(.) 和 方括号([]) 的不同之处
// js对象属性 通过点(.) 和 方括号([]) 的不同之处
// 1、点操作符: 静态的。右侧必须是一个以属性名称命名的简单标识符。属性名用一个标识符来表示。标识符必须直接出现再js程序中,
//它们不是数据类型,因此程序无法修改它们。
// 2、中括号操作符: 动态的。方括号里必须是一个计算结果为字符串的表达式,属性名通过字符串表示。字符串是js的数据类型,
//再程序运行时可以修改和创建它们。
// 主要有以下区别:
//1、[]--可以用变量作为属性名或访问,而点方法不可以;
var
obj = {};
obj.name =
'张三'
;
var
myName =
'name'
;
console.log(obj.myName);
//undefined,访问不到对应的属性
console.log(obj[myName]);
//张三
var
person = {
name:
'gogo'
};
console.log(person[
"name"
]);
//gogo
console.log(person.name);
//gogo
// 优点:1,可以通过变量来访问属性
var
propertyName =
'name'
;
console.log(person[propertyName]);
//gogo
var
propertyName2 =
'name2'
;
console.log(person[propertyName2]);
//undefined
//2、[]中括号法--可以用数字作为属性名,而点语法不可以;
var
obj1={};
// obj1.1=1;//Unexpected number
obj1[2]=2;
// console.log(obj1.1)
console.log(obj1[2]);
//2
// console.log(obj1.2)
console.log(obj1)
//{2: 2}
// 3, [] 可以动态访问的属性名,可以在程序运行时创建和修改属性,点操作符就不行!
// ( 即 []--可以动态设置和获取)
var
customer={};
var
addr=[
'北京'
,
'上海'
,
'广州'
,
'深圳'
];
for
(i=0;i<4;i++){
customer[
"address"
+i]=addr[i];
}
console.log(addr);
console.log(customer);
var
str =
""
;
for
(i=0;i<4;i++){
str += customer[
"address"
+ i] +
"\t"
;
}
console.log(str);
//4,如果属性名中包含会导致语法错误的字符,或者属性名是关键字或者保留字,也可以使用方括号表示法。
//如:(属性名是关键字或者保留字--都可以点语法不严密,不报错,写法提示有错)
person[
'first name'
] =
'gogo2'
;
//first name包含一个空格
console.log(person[
'first name'
]);
// console.log(person.first name)//书写都通不过
person[
'for'
] =
'gogo_for'
;
//first name包含一个空格
person.
if
=
'gogo_if'
;
//first name包含一个空格
console.log(person[
'for'
]);
//gogo_for
console.log(person.
for
);
//gogo_for
console.log(person[
'if'
]);
//gogo_if
console.log(person.
if
);
//gogo_if
//简单利用:在数组原型链上增加一个去重得的方法,并能实现链式写法。
Array.prototype.myDistinct=
function
() {
var
obj={};
for
(
var
i=0;i<
this
.length;i++){
var
cur=
this
[i];
if
(obj[cur]==cur){
//对象的属性名不能重复,重复就是修改;让对象的属性名和属性值相同,借以保存不重复的数组元素
//--中括号法可以用数字作为属性名,而点语法不可以;
this
[i]=
this
[
this
.length-1];
this
.length--;
i--;
continue
;
}
obj[cur]=cur;
}
// console.log(obj);//{2: 2, 3: 3, 4: 4, 5: 5}
obj=
null
;
return
this
;
};
var
arr=[5,3,3,4,5,4,2];
arr.myDistinct().sort().pop();
console.log(arr);
//[2, 3, 4]
var
arr1=[3,
'a'
,4,5,4,
'b'
,
'a'
];
console.log(arr1.myDistinct());
//[3, "a", 4, 5, "b"]
</script>
js对象属性 通过点(.) 和 方括号([]) 的不同之处的更多相关文章
- JS对象属性命名规则
JS标识符的命名规则,即变量的命名规则: 标识符只能由字母.数字.下划线和'$'组成 数字不可以作为标识符的首字符 对象属性的命名规则 通过[]操作符为对象添加属性时,属性名称可以是任何字符串(包括只 ...
- js对象属性方法大总结(收集)
数组(Array):系列元素的有序集合: 详细演示请看:[js入门系列演示·数组 ] http://www.cnblogs.com/thcjp/archive/2006/08/04/467761.ht ...
- js对象属性名以数字开头如何获取、js属性名以数字开头、missing ) after argument list
js对象中属性名以数字开头引发的报错 :missing ) after argument list var ChineseDistricts = { : { : '北京市', : '天津市', : ' ...
- js对象属性方法大总结
数组(Array):系列元素的有序集合: 详细演示请看:[js入门系列演示·数组 ] http://www.cnblogs.com/thcjp/archive/2006/08/04/467761.ht ...
- js对象转换为json格式时,js对象属性中有值为null和undefined注意事项
当属性值为null时: 当属性值为undefined时: 只有当属性值为未定义时, js对象转换成json格式时会忽略该属性.
- js 对象属性遍历
function 对象属性遍历(){ var obj = {x:1,y:2,c:3};for (var name in obj){ alert ( obj[name] )} } function 数组 ...
- js对象属性—枚举、检查、删除
前言 我们经常需要操作对象的属性.这里记录ES5中操作对象属性的API和它们之间的差异. 枚举属性 for/in遍历对象中的所有可枚举属性(包括自有属性和继承属性) var obj = {name:& ...
- JS 对象属性名排序
问题,对象属性名排序,如: var data = { A:[], D:[], B:{} } 调整为=> var data = { A:[], B:[], D:{} } 方法一: for,in,把 ...
- js对象属性的查询(点运算符和方括号运算符的区别)
js中可以通过点(.)和方括号([ ])运算符来获取属性的值.运算符的左侧应该是一个表达式,它返回一个对象.对于点(.)来说,右侧必须是一个以属性名称命名的简单标识符.对于方括号 ([ ])来说方括号 ...
随机推荐
- tornado架构分析1 从helloworld分析tornado架构
最近公司需要我写一个高性能RESTful服务组件.我之前很少涉及这种高性能服务器架构,帮公司和平时没事玩都是写脚本级别的东西.虽然好多基础组件(sphinx.logging.configparse等) ...
- vue-Swiper-awsome
<swiper :options="swiperOption"> <swiper-slide><img src="static/images ...
- AE10.0及AE10.0以上的版本调用ESRI.ArcGIS.esriSystem出现的问题
如果本地安装的是AE10.0以上,那么添加ESRI.ArcGIS.esriSystem引用时,会出现esriLicenseProductCode并不包含esriLicenseProductCodeAr ...
- undefined symbol: PyFPE_jbuf
参考: https://blog.csdn.net/ture_dream/article/details/52733326 报错确实是Python的版本不一致. 但是我又不想删除anaconda. 怎 ...
- activiti-6.0工作流应用模板
acriviti6.0官方操作指南:https://www.activiti.org/userguide/#demo.setup.one.minute.version 下载 acriviti6.0压 ...
- vue-cli使用vux时报错处理,“You may need an appropriate loader to handle this file type”
先说解决方案: 在项目中找到build,找到webpack.base.conf.js 将vux给出的解决方案代码拷贝出来 const vuxLoader = require('vux-loader') ...
- Lock和Static使用说明和区别
private static object lockInsertObj = new object(); lock (lockInsertObj){--写代码} 1.静态方法与非静态方法 a.静态方法的 ...
- JS的基本(原始)数据类型
1.boolean true & false 2.null 空值类型 3.undefined 未定义类型 4.number 数值类型 5.string 字符串类型 6.sy ...
- Mysql 存储过程批量建表
CREATE DEFINER=`root`@`%` PROCEDURE `createTables`() begin declare i int; declare suffix varchar(20) ...
- C语言博客作业01--分支、顺序结构
1.本章学习总结 1.1思维导图 1.2本章学习体会及代码量学习体会 1.2.1学习体会 通过本章的学习,学会了三种基本结构以及一些基本的运算知识,学会编写简单的程序,跟着老师的步子学习基本的东西都能 ...