`

javascript面向对象技术基础(一)

阅读更多

对象和数组(Objects and Arrays)
什么是对象?把一些"名字-属性"的组合放在一个单元里面,就组成了一个对象.我们可以理解为javascript中
的对象就是一些"键-值"对的集合(An object is a collection of named values. These named values are usually referred
to as properties of the object.--Section3.5).
"名字"只能是string类型,不能是其他类型,而属性的类型则是
任意的(数字/字符串/其他对象..).可以用new Object()来创建一个空对象,也可以简单的用"{}"来创建一个
空对象,这两者的作用是等同的.

Js代码 复制代码
  1. var emptyObject1 = {};           //创建空对象   
  2. var emptyObject2 = new Object(); //创建空对象   
  3. var person = {"name":"sdcyst",   
  4.           "age":18,   
  5.           "sex":"male"};     //创建一个包含初始值的对象person   
  6. alert(person.name);              //sdcyst   
  7. alert(person["age"]);            //18  
var emptyObject1 = {};	         //创建空对象
var emptyObject2 = new Object(); //创建空对象
var person = {"name":"sdcyst",
	      "age":18,
	      "sex":"male"};     //创建一个包含初始值的对象person
alert(person.name);              //sdcyst
alert(person["age"]);            //18

 从上面的例子我们也可以看到,访问一个对象的属性,可以简单的用对象名加"."后加属性的名字,也
可以用"[]"操作符来获取,此时在[]里面的属性名字要加引号,这是因为对象中的索引都是字符串类型的.
javasript对象中属性的个数是可变的,在创建了一个对象之后可以随时对它赋予任何的属性.

Js代码 复制代码
  1. var person = {};   
  2. person.name = "sdcyst";   
  3. person["age"] = 18;   
  4. alert(person.name + "__" + person.age); //sdcyst__18   
  5.   
  6. var _person = {name:"balala","age":23}; //在构建一个对象时,属性的名字可以不用引号来标注(name),   
  7.                     //但是仍旧是一个字符串类型.在访问的时候[]内仍旧需要引号   
  8. alert(_person["name"] + "__" + person.age); //balala__23   
  9. alert(_person[name]);                   //undefinied  
var person = {};
person.name = "sdcyst";
person["age"] = 18;
alert(person.name + "__" + person.age); //sdcyst__18

var _person = {name:"balala","age":23}; //在构建一个对象时,属性的名字可以不用引号来标注(name),
					//但是仍旧是一个字符串类型.在访问的时候[]内仍旧需要引号
alert(_person["name"] + "__" + person.age); //balala__23
alert(_person[name]);                   //undefinied

 通过"."操作符获取对象的属性,必须得知道属性的名字.一般来说"[]"操作符获取对象属性的功能更强大一些,
可以在[]中放入一些表达式来取属性的值,
比如可以用在循环控制语句中,而"."操作符则没有这种灵活性。

Js代码 复制代码
  1. var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};   
  2. var namestring = "";   
  3. for(var props in name) {  //循环name对象中的属性名字   
  4.     namestring += name[props];   
  5. }   
  6. alert(namestring);  //NAME1NAME2NAME3NAME4   
  7.   
  8. namestring = "";   
  9. for(var i=0; i<4; i++) {   
  10.     namestring += name["name"+(i+1)];   
  11. }   
  12. alert(namestring);  //NAME1NAME2NAME3NAME4  
var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};
var namestring = "";
for(var props in name) {  //循环name对象中的属性名字
    namestring += name[props];
}
alert(namestring);  //NAME1NAME2NAME3NAME4

namestring = "";
for(var i=0; i<4; i++) {
    namestring += name["name"+(i+1)];
}
alert(namestring);  //NAME1NAME2NAME3NAME4

 delete操作符可以删除对象中的某个属性,判断某个属性是否存在可以使用"in"操作符.

Js代码 复制代码
  1. var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};   
  2. var namestring = "";   
  3. for(var props in name) {  //循环name对象中的属性名字   
  4.     namestring += name[props];   
  5. }   
  6. alert(namestring);  //NAME1NAME2NAME3NAME4   
  7.   
  8. delete name.name1;  //删除name1属性   
  9. delete name["name3"];  //删除name3属性   
  10. namestring = "";   
  11. for(var props in name) {  //循环name对象中的属性名字   
  12.     namestring += name[props];   
  13. }   
  14. alert(namestring);  //NAME2NAME4   
  15.   
  16. alert("name1" in name); //false   
  17. alert("name4" in name); //true  
var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};
var namestring = "";
for(var props in name) {  //循环name对象中的属性名字
    namestring += name[props];
}
alert(namestring);  //NAME1NAME2NAME3NAME4

delete name.name1;  //删除name1属性
delete name["name3"];  //删除name3属性
namestring = "";
for(var props in name) {  //循环name对象中的属性名字
    namestring += name[props];
}
alert(namestring);  //NAME2NAME4

alert("name1" in name); //false
alert("name4" in name); //true

 需要注意,对象中的属性是没有顺序的.

对象的constructor属性
每一个javascript对象都有一个constructor属性.这个属性对应了对象初始化时的构造函数(函数也是对象).

Js代码 复制代码
  1. var date = new Date();   
  2. alert(date.constructor);  //Date   
  3. alert(date.constructor == "Date");  //false   
  4. alert(date.constructor == Date);  //true  
分享到:
评论

相关推荐

    javascript面向对象技术基础

    javascript面向对象技术基础,javascript面向对象技术基础

    javascript面向对象技术基础 整理排版了一下

    javascript面向对象技术基础 整理排版了一下 外带了个闭包的文章,下了可以直接打印了

    js面向对象技术基础

    一个很好的学习javascript的资料,详细叙述了javascript面向对象的原理,并含有大量的程序例子说明。非常实用。

    javascript 面向对象技术基础教程第1/2页

    看了很多介绍javascript面向对象技术的文章,很晕.为什么?不是因为写得不好,而是因为太深奥.

    [推荐]javascript 面向对象技术基础教程

    看了很多介绍javascript面向对象技术的文章,很晕.为什么?不是因为写得不好,而是因为太深奥.javascript中的对象还没解释清楚怎么回事,一上来就直奔主题,类/继承/原型/私有变量....

    javascript面向对象教程

    本教程针对那些对javascript语言有一定的了解,从事过web开发,并且在实际中或多或少地使用过javascript的开发和技术人员 javascript语言基础的语法在此就直接略过,不做介绍 通过本教程的学习,学习者应该了解...

    第5章 JavaScript编程技术 课件

    5.1 JavaScript编程基础 5.1.1 JavaScript简介 5.1.2 Javascript的使用方法 5.1.3 语法规则 5.1.4 运算符和表达式 5.1.5 函数 5.1.6流程控制 5.1.7 事件处理 5.2 JavaScript对象编程 5.2.1 Object 类型 5.2.2 Array...

    JavaScript征途

    JavaScript对象,数组,字符串,使用正则表达式操纵字符串,客户端,控制文档结构的模型,JavaScript事件驱动模型,CSS,Cookie,XML和JSON,Ajax,深入JavaScript面向对象编程,深入JavaScript函数式编程,深入...

    写给大家看的面向对象编程书(第3版).[美]Matt Weisfeld(带详细书签).pdf

    本书是一部独具特色的面向对象技术著作。书中结合代码示例生动透彻地讲述了面向对象思想的精髓,让读者真正学会以对象方式进行思考。此外,本书还讨论了各种与面向对象概念密切相关的应用主题,包括XML、UML建模语言...

    《JavaScript征途》书稿实例

    数组,字符串,使用正则表达式操纵字符串,客户端,控制文档结构的模型,JavaScript事件驱动模型,CSS,Cookie,XML和JSON,Ajax,深入JavaScript面向对象编程,深入JavaScript函数式编程,深入JavaScript动态化编程...

    javascrip上百技术总集

    -(4) JavaScript面向对象的支持--(5) JavaScript面向对象的支持--(6) JavaScript精简学习1:基础知识 JavaScript精简学习2:浏览器输出 JavaScript精简学习3:图像 JavaScript精简学习4:表单 ...

    JavaScript核心概念及实践 高清PDF扫描版 (邱俊涛).pdf

    《JavaScript核心概念及实践》不仅帮助读者迅速掌握JavaScript基础知识和核心技术,而且通过实例讲解如何将这些知识和技术理解应用到实际工作中,提升编程能力,以简洁、优美的代码开发出功能强大且更易于维护和扩展...

    javascript DOM 编程艺术

    从颇具深度的JavaScript语言基础到作用域(链),从引用类型到面向对象编程,从极其灵活的匿名函数到闭包的内部机制,从浏览器对象模型(BOM)、文档对象模型(DOM)到基于事件的Web脚本设计,从XML(E4X)到Ajax及JSON,从...

    征服RIA:基于JavaScript的Web客户端开发卷二

    JavaScript高级篇:揭示JavaScript的运行机理和高级应用,如面向对象编程、函数式编程和元编程。Ajax篇:Ajax是上帝赐予JavaScript的礼物。凭借着Ajax,JavaScript拥有了异步调度服务端业务逻辑的能力。本篇除介绍...

    征服RIA:基于JavaScript的Web客户端开发卷三

    JavaScript高级篇:揭示JavaScript的运行机理和高级应用,如面向对象编程、函数式编程和元编程。Ajax篇:Ajax是上帝赐予JavaScript的礼物。凭借着Ajax,JavaScript拥有了异步调度服务端业务逻辑的能力。本篇除介绍...

    JavaScript终极指南:一篇掌握所有核心概念技术关键词:JavaScript、回调函数、Promise、async

    同时,文章还介绍了模块化编程、面向对象编程等现代编程理念,以及React、Angular、Vue.js等热门前端框架的使用。 适用人群: 这篇文章适合对JavaScript感兴趣的开发者,无论是初学者还是有一定经验的开发者。无论你...

Global site tag (gtag.js) - Google Analytics