Javascript学习笔记之 对象篇(一) : 对象的使用和属性

 更新时间:2014年06月24日 08:51:34   投稿:hebedich  
Javascript 中的一切都可以视为对象,除了两个特例:null 和 undefined。
false.toString(); // 'false'
[1, 2, 3].toString(); // '1,2,3'

function Foo(){}
Foo.bar = 1;
Foo.bar; // 1

一个经常容易被误解的就是数字常量不能视为对象,实际上数字常量仍然可以视为对象。这是因为 Javascript 解析器在解析点操作符时而将其视为浮点数特征而犯下的错误。

2.toString(); // raises SyntaxError

实际上,我们有很多方法可以使得数字常量表现为一个对象。

2..toString(); // the second point is correctly recognized
2 .toString(); // note the space left to the dot
(2).toString(); // 2 is evaluated first

对象作为数据类型

Javascript 中的对象可以当做哈希表使用,它们主要包含键与值的对应关系。
使用 {} 符号来创建一个简单的对象,这个新建的对象将从 Object.prototype 继承而来,并且不包含自己定义的属性。

var foo = {}; // a new empty object
// a new object with a 'test' property with value 12
var bar = {test: 12}; 

访问对象的属性

我们可以使用两种方式来访问 Javascript 的对象,分别是点操作符 . 和中括号操作符 [] 。

var foo = {name: 'kitten'}
foo.name; // kitten
foo['name']; // kitten

var get = 'name';
foo[get]; // kitten

foo.1234; // SyntaxError
foo['1234']; // works

两种操作符的效果几乎一样,唯一的不同是中括号操作符允许动态设置属性而且属性名可以有语法错误。(上例中的第三个情形已说明)

删除对象的属性

删除属性的唯一方法是使用 delete,将属性值设置为 undefined 或 null 只是移除了与属性相关的值,并没有真正删除属性本身。

var obj = {
 bar: 1,
 foo: 2,
 baz: 3
};
obj.bar = undefined;
obj.foo = null;
delete obj.baz;

for(var i in obj) {
 if (obj.hasOwnProperty(i)) {
 console.log(i, '' + obj[i]);
 }
}

上面的输出 bar undefined 和 foo null,只有 baz 真正被删除。
这里要说明一点,delete 只能删除属性,并不能删除变量。所以我们在定义变量时一定要养成写 var 的好习惯,任何时候,变量一定要使用 var 关键字才能声明。因为如果不写 var,变量会被误认给全局对象创建了一个新属性。

这个例子相当清楚给出了答案,a 为变量,而 b 只是一个全局对象的属性而已。

命名对象的属性

var test = {
 'case': 'I am a keyword, so I must be notated as a string',
 delete: 'I am a keyword, so me too' // raises SyntaxError
};

对象的属性可以用普通字符或字符串来命名。同样也是由于 Javascript 解析器的一个错误设计,上例中的第二种表示方法在 ECMAScript 5 中将会抛出一个错误。
错误的原因是因为 delete 是一个关键词,所以必须使用一个字符串常量来命名来适应老版的 Javascript 解析器。

相关文章

  • JS多线程API webworker应用场景有哪些

    JS多线程API webworker应用场景有哪些

    这篇文章主要介绍了JS多线程API webworker应用场景有哪些,加密数据,预取数据,预渲染,复杂数据处理场景,预加载图片需要的朋友可以参考下
    2023-02-02
  • 了解重排与重绘

    了解重排与重绘

    重绘和重排操作都是代价昂贵的操作,它们会导致web应用程序的UI反应迟钝,所以应该尽可能减少这类过程的发生。下面我们来简单了解一下
    2019-05-05
  • fetch()函数说明与使用方法详解

    fetch()函数说明与使用方法详解

    fetch()是XMLHttpRequest的升级版,用于在JavaScript脚本里面发出 HTTP请求,本文章向大家介绍fetch()的用法,主要包括fetch()的用法使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
    2022-11-11
  • JavaScript代码优雅,简洁的编写技巧总结

    JavaScript代码优雅,简洁的编写技巧总结

    专业开发人员将为未来的自己和“其他人”编写代码,而不仅仅只编写当前能工作就行的代码。在此基础上,简洁代码可以定义为自解释的、易于人理解的、易于更改或扩展的代码。以下列表一些好编写方式,仅供参考
    2022-10-10
  • javascript 函数介绍

    javascript 函数介绍

    在JavaScript中,定义函数最常用的方法就是调用function语句。该语句是由function关键字构成的,也是很重要的函数复用。
    2009-09-09
  • JavaScript之引用类型介绍

    JavaScript之引用类型介绍

    引用类型通常叫作类(class),也就是说,遇到引用值时,所处理的就是对象。
    2012-08-08
  • Javascript入门学习资料收集整理篇

    Javascript入门学习资料收集整理篇

    为大家更好的接触和学习js资料,所以我转了这篇文章,我大约的看了下,文章写的非常不错,希望大家不要急,慢慢看,第一次看不懂不要紧,多练习就可以了
    2008-07-07
  • 盘点30个经典常用的JavaScript知识点

    盘点30个经典常用的JavaScript知识点

    这篇文章主要介绍了盘点30个经典常用的JavaScript知识点,为大家总结一篇日常经常使用可能还不知道的点,需要的朋友可以参考下
    2023-04-04
  • JavaScript中的getMilliseconds()方法使用详解

    JavaScript中的getMilliseconds()方法使用详解

    这篇文章主要介绍了JavaScript中的getMilliseconds()方法使用详解,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-06-06
  • html超链接打开窗口大小的方法

    html超链接打开窗口大小的方法

    html超链接打开窗口大小的方法,需要的朋友可以参考一下
    2013-03-03

最新评论