|
|
|
|
移动端

3.3 访问对象的属性

《JavaScript开发实战》第3章对象:数据分组,本章将介绍 JavaScript语言中的对象。对象是一种简单、有效的收集变量的方法,在程序中可以把这些变量看作一个组,而不是各个单独的变量来进行信息传递。本节为大家介绍访问对象的属性。

作者:孙晓青/周伟 译来源:机械工业出版社|2018-05-05 10:54

【新品产上线啦】51CTO播客,随时随地,碎片化学习

3.3 访问对象的属性

对象的概念与急救包非常相似。我们可以把急救包从一个人传递给另一个人,从一个地方拿到另一个地方。只有当我们需要使用这个急救包内的物品时,才知道急救包里面有消毒剂、剪刀、绷带等物品。

对于 JavaScript对象,可以使用圆点运算符来访问对象的属性值,具体形式是使用圆点运算符将存放对象的变量名称和对象的属性名称(键)连接在一起。如果把急救包作为一个对象( kit是存放该对象的变量),可以使用 kit.antiseptic、kit.scissor或 kit.bandages来访问属性值。把书作为一个对象,如果要访问 book(存放该对象的变量)的 author属性值,可以写成 book.author,如图 3-4所示。

以下代码清单 3-8将 book对象的 title和 author属性显示在控制台上,如下所示:

  1. > The Hobbit  
  2. > J. R. R. Tolkien 

代码清单 3-8使用圆点运算访问对象的属性值 (http://jsbin.com/funiyu/edit?js,console)

  1. var book;  
  2. book = {  
  3. title : "The Hobbit", //使用键-值对为对象属性赋值  
  4. author : "J. R. R. Tolkien",  
  5. published : 1937  
  6. };  
  7. console.log(book.title); //使用圆点运算符访问属性值  
  8. console.log(book.author); 

在上述代码清单 3-8中,使对象的属性能够整齐排列的冒号可以增加程序的可读性。 JavaScript运行时会自动忽略那些多余的空格。整齐的代码块和排成一行的属性值可以使程序更容易阅读和理解,特别是当程序代码大规模增长的时候,这种整洁的形式使代码更加易于阅读、易于维护并易于更新。

显然,使用一个对象来替换一堆单个变量可以使程序更加简洁。这种做法使我们能够清晰地看到程序如何运行,而那些藏在内部的细节只有在需要时才去查看。在程序中,书籍被当作一个整体看待,只有在需要的时候,才会去访问书籍名称、书籍作者或出版日期。在本章中,用一个拥有 3个属性的变量来替换 3个单独变量,这似乎也算不上是很大的改进,但是当我们开始使用第 7章的函数对象和第 8章的数组对象时,就会看到使用对象所带来的简洁性和明晰度。

我们可以像使用变量一样来使用属性值。下列代码清单 3-9将输出书籍名称和书籍作者,二者之间由字符串" by"相连:

  1. > The Hobbit by J. R. R. Tolkien  
  2. > Northern Lights by Philip Pullman 

代码清单 3-9 连接多个字符串属性 http://jsbin.com/yoweti/edit?js,console

  1. var book1;  
  2. var book2;  
  3. book1 = {  
  4. title: "The Hobbit",  
  5. author: "J. R. R. Tolkien"  
  6. };  
  7. book2 = {  
  8. title: "Northern Lights",  
  9. author: "Philip Pullman"  
  10. };  
  11. console.log(book1.title + " by " + book1.author);  
  12. console.log(book2.title + " by " + book2.author); 

喜欢的朋友可以添加我们的微信账号:

51CTO读书频道二维码


51CTO读书频道活动讨论群:365934973

【责任编辑:book TEL:(010)68476606】

回书目   上一节   下一节
点赞 0
分享:
大家都在看
猜你喜欢

读 书 +更多

人月神话:32周年中文纪念版

在软件领域,很少能有像《人月神话》一样具有深远影响力并且畅销不衰的著作。Brooks博士为人们管理复杂项目提供了最具洞察力的见解。既有很...

订阅51CTO邮刊

点击这里查看样刊

订阅51CTO邮刊