javascript对象属性命名“”增添的特殊情况

2023-10-19 02:08

本文主要是介绍javascript对象属性命名“”增添的特殊情况,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

通常情况下在JavaScript中,对象属性命加引号与不加引号都是一样用,都是有效的。
1、
如:
[javascript]

    var obj = {  name    : '二次猿',  'age'   : 18,  };  document.write( 'name : ' + obj['name'] + '<br />' );  document.write( 'age : ' + obj.age + '<br />' );  

执行:
name : 二次猿
age : 18

2、
哪在什么时候有区别呢?在你使用一些非合法命名规则的时候,就显的有必要了
比如:
[javascript]

    var obj = {  888name : '二次猿'  };    document.write( '888name : ' + obj.888name + '<br />' );  

这时候会报错误,但你给加上引号,就没事了

3、
如果加上引号,使用 “.属性名”: 方式读取属性时仍然会出错:
[javascript]

 var obj = {  '888name' : '二次猿'  };   document.write( '888name : ' + obj.888name + '<br />' );  

执行,发现报错:

如果加上引号,使用 “[‘属性名’]”: 方式读取属性时不会出错:
[javascript] view plain copy

    var obj = {  '888name': '二次猿'  };  document.write('888name : ' + obj['888name'] +'<br />' );  

执行:
888name : 二次猿

4、
甚至还可以更特殊一点,如:
[javascript]

    var obj = {  '': '这个属性名是空的',  ' ': '这个属性名是一个空格'  };  document.write(  obj[''] +'<br />' );  document.write(  obj[' '] +'<br />' );  

执行:
这个属性名是空的
这个属性名是一个空格

我们引用对象成员的时候,由于属性名不是合法命名规则,因此也需要使用中括号的方式来访问,也建议大家以后采取中括号的方式读取对象属性值,以免有意外错误

虽然实际我们写程序一般都遵守程序公约,不会去制造一些另类,但特殊性情况下,这些能力也可以弥补一些变态需求。

转自‘琼台博客’;

这篇关于javascript对象属性命名“”增添的特殊情况的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/236582

相关文章

Java中的工具类命名方法

《Java中的工具类命名方法》:本文主要介绍Java中的工具类究竟如何命名,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录Java中的工具类究竟如何命名?先来几个例子几种命名方式的比较到底如何命名 ?总结Java中的工具类究竟如何命名?先来几个例子JD

Java对象转换的实现方式汇总

《Java对象转换的实现方式汇总》:本文主要介绍Java对象转换的多种实现方式,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录Java对象转换的多种实现方式1. 手动映射(Manual Mapping)2. Builder模式3. 工具类辅助映

HTML5中的Microdata与历史记录管理详解

《HTML5中的Microdata与历史记录管理详解》Microdata作为HTML5新增的一个特性,它允许开发者在HTML文档中添加更多的语义信息,以便于搜索引擎和浏览器更好地理解页面内容,本文将探... 目录html5中的Mijscrodata与历史记录管理背景简介html5中的Microdata使用M

html5的响应式布局的方法示例详解

《html5的响应式布局的方法示例详解》:本文主要介绍了HTML5中使用媒体查询和Flexbox进行响应式布局的方法,简要介绍了CSSGrid布局的基础知识和如何实现自动换行的网格布局,详细内容请阅读本文,希望能对你有所帮助... 一 使用媒体查询响应式布局        使用的参数@media这是常用的

HTML5表格语法格式详解

《HTML5表格语法格式详解》在HTML语法中,表格主要通过table、tr和td3个标签构成,本文通过实例代码讲解HTML5表格语法格式,感兴趣的朋友一起看看吧... 目录一、表格1.表格语法格式2.表格属性 3.例子二、不规则表格1.跨行2.跨列3.例子一、表格在html语法中,表格主要通过< tab

Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案

《Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案》:本文主要介绍Vue3组件中getCurrentInstance()获取App实例,但是返回nu... 目录vue3组件中getCurrentInstajavascriptnce()获取App实例,但是返回n

Python中判断对象是否为空的方法

《Python中判断对象是否为空的方法》在Python开发中,判断对象是否为“空”是高频操作,但看似简单的需求却暗藏玄机,从None到空容器,从零值到自定义对象的“假值”状态,不同场景下的“空”需要精... 目录一、python中的“空”值体系二、精准判定方法对比三、常见误区解析四、进阶处理技巧五、性能优化

JS+HTML实现在线图片水印添加工具

《JS+HTML实现在线图片水印添加工具》在社交媒体和内容创作日益频繁的今天,如何保护原创内容、展示品牌身份成了一个不得不面对的问题,本文将实现一个完全基于HTML+CSS构建的现代化图片水印在线工具... 目录概述功能亮点使用方法技术解析延伸思考运行效果项目源码下载总结概述在社交媒体和内容创作日益频繁的

前端CSS Grid 布局示例详解

《前端CSSGrid布局示例详解》CSSGrid是一种二维布局系统,可以同时控制行和列,相比Flex(一维布局),更适合用在整体页面布局或复杂模块结构中,:本文主要介绍前端CSSGri... 目录css Grid 布局详解(通俗易懂版)一、概述二、基础概念三、创建 Grid 容器四、定义网格行和列五、设置行

前端下载文件时如何后端返回的文件流一些常见方法

《前端下载文件时如何后端返回的文件流一些常见方法》:本文主要介绍前端下载文件时如何后端返回的文件流一些常见方法,包括使用Blob和URL.createObjectURL创建下载链接,以及处理带有C... 目录1. 使用 Blob 和 URL.createObjectURL 创建下载链接例子:使用 Blob