JS对象基础

JavaScript 对象

JavaScript 提供多个内建对象,比如 String、Date、Array 等等。

对象只是带有属性方法的特殊数据类型。

访问对象的属性

属性是与对象相关的值。

访问对象属性的语法是:

objectName.propertyName

这个例子使用了 String 对象的 length 属性来获得字符串的长度:

var message="Hello World!";
var x=message.length;

在以上代码执行后,x 的值将是:

12

访问对象的方法

方法是能够在对象上执行的动作。

您可以通过以下语法来调用方法:

objectName.methodName()

这个例子使用了 String 对象的 toUpperCase() 方法来将文本转换为大写:

var message="Hello world!";
var x=message.toUpperCase();

在以上代码执行后,x 的值将是:

HELLO WORLD!

创建 JavaScript 对象

通过 JavaScript,您能够定义并创建自己的对象。

创建新对象有两种不同的方法:

  1. 定义并创建对象的实例
  2. 使用函数来定义对象,然后创建新的对象实例

创建直接的实例

这个例子创建了对象的一个新实例,并向其添加了四个属性:

实例

person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";

亲自试一试

替代语法(使用对象 literals):

实例

person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};

亲自试一试

使用对象构造器

本例使用函数来构造对象:

实例

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

亲自试一试

创建 JavaScript 对象实例

一旦您有了对象构造器,就可以创建新的对象实例,就像这样:

var myFather=new person("Bill","Gates",56,"blue");
var myMother=new person("Steve","Jobs",48,"green");

把属性添加到 JavaScript 对象

您可以通过为对象赋值,向已有对象添加新属性:

假设 personObj 已存在 - 您可以为其添加这些新属性:firstname、lastname、age 以及 eyecolor:

person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";

x=person.firstname;

在以上代码执行后,x 的值将是:

Bill

把方法添加到 JavaScript 对象

方法只不过是附加在对象上的函数。

在构造器函数内部定义对象的方法:

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;

this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}

changeName() 函数 name 的值赋给 person 的 lastname 属性。

现在您可以试一下:

myMother.changeName("Ballmer");

亲自试一试

JavaScript 类

JavaScript 是面向对象的语言,但 JavaScript 不使用类。

在 JavaScript 中,不会创建类,也不会通过类来创建对象(就像在其他面向对象的语言中那样)。

JavaScript 基于 prototype,而不是基于类的。

JavaScript for...in 循环

JavaScript for...in 语句循环遍历对象的属性。

语法

for (对象中的变量)
  {
  要执行的代码
  }

注释:for...in 循环中的代码块将针对每个属性执行一次。

实例

循环遍历对象的属性:

var person={fname:"Bill",lname:"Gates",age:56};

for (x in person)
  {
  txt=txt + person[x];
  }
更多相关文章
  • Node.js系列基础学习----安装,实现HelloWorld,REPL
    Node.js基础学习 1:简介 简单的说 Node.js 就是运行在服务端的 JavaScript.Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台.Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Java ...
  • js对象深复制,创建对象和继承
    js 对象深复制,创建对象和继承.主要参考高级编程第三版,总结网上部分资料和自己的代码测试心得.每走一小步,就做一个小结. 1.对象/数组深复制 一般的=号传递的都是对象/数组的引用,如在控制台输入 var a=[1,2,3], b=a; b[0]=0; a[0] 此时显示的结果为0,也就是说a和b ...
  • css+js+html基础知识总结 一.CSS相关 1.css的盒子模型:IE盒子模型.标准W3C盒子模型: 2.CSS优先级机制: 选择器的优先权:!important>style(内联样式)>[id>class>tag](选择器) 样式的优先级:(外部样式)Externa ...
  • JS对象继承篇
    JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person(){ this.name = "Person"; } Person.prototy ...
  •   JavaScript is an Object Oriented Programming (OOP) language. JS是面向对象的编程语言(面向对象).An OOP language allows you to define your own objects and make your ...
  • 1.DOM 对象转成 jQuery 对象 var v = document.getElementById("v"); //DOM对象 var $v = $(v); //jQuery 对象 即:把js对象括号 然后前面加上$符号. 2.jQuery 对象转成 DOM 对象 var ...
  •      在JavaScript很多人复制一个对象的时候都是直接用"=",因为大家都觉得脚本语言是没有指针.引用.地址之类的,所以直接用"="就可以把一个对象复制给另外一个对象,如下代码: var i1 = 1; var i2 = i1; i2 = 2; al ...
  • 前台的js对象数组传到后台处理.在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>
一周排行
  • 问:一次使用第三方小工具,将我的E盘隐藏了,现在每次访问E盘都要在地址栏中输入"E:\"才能访问里面的内容,不知有没有方法将其再次显示出来? 答:单击"开始→运行"并输入&qu ...
  • curd就 是增删改查.本节课大纲:一.ThinkPHP 3 的CURD介绍  (了解)二.ThinkPHP 3 读取数据    (重点)    对数据的读取 Read    $m=new Model('User') ...
  • Ghost后 windows 2008 不能启动.今天使用Ghost还原windows 2008后,不能启动的问题,重启后出现 修复系统选项 采用下面帖子中的部分命令搞定之.操作步骤:1.使用系统盘启动2.选择&qu ...
  • LinuxZabbix+MPM+msmtp+mutt监控MySQL+邮件报警
    Zabbix部署参考博文 http://blog.sina.com.cn/s/blog_5 ...
  • 一.创建逻辑目录,该命令不会在操作系统创建真正的目录,最好以system等管理员创建.create directory dpdata1 as 'd:\test\dump';二.查看管理理员目录(同时查看操作系统是否存 ...
  • 配置Lync推送服务
    Lync 的移动服务功能配置好之后,如果你用的是Windows phone 或者Iphon ...
  • 要用ubuntu访问windows共享的文件,非常简单,系统安装好以后默认就支持.但是反过来想在xp里面访问ubuntu,这个就比较复杂,下午研究了半天总算试验成功.把方法写下来免得忘记了.我先在百度里面搜索到Lin ...
  •    细心的读者可能会发现我blog右边的又新增了一个广告,将我们公司架构师的博客(一个可以让你受益良多的博客)作为插件动态显示在广告条中(如下图),那么我是如何实现的呢. 源代码如下         <div ...
  • 漂流日记davenzeng篇
    一开始收到日志的时候还是在失业当中,正在努力的找工作.所以也一直没时间去看,没时间去写.后 ...
  • 人力资源管理系统EHR系统实施项目组织  为了让公司人力资源管理软件上线运行,特成立项目办公部,主要由专业的人力资源管理人员,信息技术员,直属领导组成.一.直属领导的职责和组成1.审批信息化建设的总体计划2.审批各分 ...