深入剖析JavaScript编程中的对象概念


Posted in Javascript onOctober 21, 2015

JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...
此外,JavaScript 允许自定义对象。
所有事物都是对象
JavaScript 提供多个内建对象,比如 String、Date、Array 等等。 对象只是带有属性和方法的特殊数据类型。

  • 布尔型可以是一个对象
  • 数字型可以是一个对象
  • 字符串也可以是一个对象
  • 日期是一个对象
  • 数学和正则表达式也是对象
  • 数组是一个对象
  • 甚至函数也可以是对象

JavaScript 对象

对象只是一种特殊的数据。对象拥有属性和方法。
访问对象的属性
属性是与对象相关的值。
访问对象属性的语法是:

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="John";
person.lastname="Doe";
person.age=50;
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中,this通常指向的是我们正在执行的函数本身,或者是指向该函数所属的对象(运行时)
创建 JavaScript 对象实例
一旦您有了对象构造器,就可以创建新的对象实例,就像这样:

var myFather=new person("John","Doe",50,"blue");
var myMother=new person("Sally","Rally",48,"green");

把属性添加到 JavaScript 对象
您可以通过为对象赋值,向已有对象添加新属性:
假设 personObj 已存在 - 您可以为其添加这些新属性:firstname、lastname、age 以及 eyecolor:

person.firstname="John";
person.lastname="Doe";
person.age=30;
person.eyecolor="blue";

x=person.firstname;

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

John

把方法添加到 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("Doe");
Javascript 相关文章推荐
javascript之ESC(第二类混淆)
May 06 Javascript
xml分页+ajax请求数据源+dom取结果实例代码
Oct 31 Javascript
JS backgroundImage控制
May 19 Javascript
图片动画横条广告带上下滚动可自定义图片、链接等等
Oct 20 Javascript
编程语言JavaScript简介
Oct 16 Javascript
浅谈jQuery构造函数分析
May 11 Javascript
jquery对dom节点的操作【推荐】
Apr 15 Javascript
使用vue.js实现checkbox的全选和多个的删除功能
Feb 17 Javascript
基于rem的移动端响应式适配方案(详解)
Jul 07 Javascript
vue集成kindeditor富文本的实现示例代码
Jun 07 Javascript
vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决
Sep 28 Javascript
如何用JS实现简单的数据监听
May 06 Javascript
JavaScript中Boolean对象的属性解析
Oct 21 #Javascript
深入解析JavaScript中的数字对象与字符串对象
Oct 21 #Javascript
jQuery无刷新切换主题皮肤实例讲解
Oct 21 #Javascript
JavaScript操作HTML元素和样式的方法详解
Oct 21 #Javascript
13个PHP函数超实用
Oct 21 #Javascript
JavaScript对HTML DOM使用EventListener进行操作
Oct 21 #Javascript
JavaScript对象数组的排序处理方法
Oct 21 #Javascript
You might like
ThinkPHP 3.2 数据分页代码分享
2014/10/14 PHP
PHP下的浮点运算不准的解决方法
2016/10/27 PHP
PHP连接MySQL数据库的三种方式实例分析【mysql、mysqli、pdo】
2019/11/04 PHP
解析javascript 浏览器关闭事件
2013/07/08 Javascript
Jjcarousellite 实现图片列表滚动的简单实例
2013/11/29 Javascript
jQuery+ajax实现动态执行脚本的方法
2015/01/27 Javascript
JavaScript之Object类型介绍
2015/04/01 Javascript
javascript实现手机震动API代码
2015/08/05 Javascript
jQuery验证表单格式的使用方法
2017/01/10 Javascript
javascript基础知识讲解
2017/01/11 Javascript
详解axios在vue中的简单配置与使用
2017/05/10 Javascript
jQuery Dom元素操作技巧
2018/02/04 jQuery
Redux实现组合计数器的示例代码
2018/07/04 Javascript
vuex 中插件的编写案例解析
2019/06/10 Javascript
如何基于JS截获动态代码
2019/12/25 Javascript
多页vue应用的单页面打包方法(内含打包模式的应用)
2020/06/11 Javascript
[45:40]Ti4 冒泡赛第二天NEWBEE vs NaVi 1
2014/07/15 DOTA
跟老齐学Python之编写类之三子类
2014/10/11 Python
举例讲解Python的lambda语句声明匿名函数的用法
2016/07/01 Python
python plotly画柱状图代码实例
2019/12/13 Python
django 链接多个数据库 并使用原生sql实现
2020/03/28 Python
俄罗斯在线购买飞机票、火车票、巴士票网站:Tutu.ru
2020/03/16 全球购物
华硕新加坡官方网上商店:ASUS Singapore
2020/07/09 全球购物
Delphi软件工程师试题
2013/01/29 面试题
商务日语毕业生自荐信范文
2013/11/14 职场文书
教师辞职报告范文
2014/01/20 职场文书
函授毕业个人自我评价
2014/02/20 职场文书
小学生操行评语大全
2014/04/22 职场文书
求职简历自荐信怎么写
2015/03/26 职场文书
2015年学校保卫部工作总结
2015/05/11 职场文书
少先队工作总结2015
2015/05/13 职场文书
民事调解书范文
2015/05/20 职场文书
2015年惩防体系建设工作总结
2015/05/22 职场文书
个人收入证明范本
2015/06/12 职场文书
mysql timestamp比较查询遇到的坑及解决
2021/11/27 MySQL
SQL Server中搜索特定的对象
2022/05/25 SQL Server