深入剖析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 相关文章推荐
js右键菜单效果代码
Jul 21 Javascript
初窥JQuery(二)事件机制(2)
Dec 06 Javascript
使用javascript过滤html的字符串(注释标记法)
Jul 08 Javascript
LABjs、RequireJS、SeaJS的区别
Mar 04 Javascript
我的Node.js学习之路(三)--node.js作用、回调、同步和异步代码 以及事件循环
Jul 06 Javascript
Js使用WScript.Shell对象执行.bat文件和cmd命令
Dec 18 Javascript
js改变embed标签src值的方法
Apr 10 Javascript
javascript封装简单实现方法
Aug 11 Javascript
jsp 自动编译机制详细介绍
Dec 01 Javascript
jquery实现图片跟随鼠标的实例
Oct 17 jQuery
js实现时间日期校验
May 26 Javascript
JavaScript如何实现图片处理与合成
May 29 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
PHP文件去掉PHP注释空格的函数分析(PHP代码压缩)
2013/07/02 PHP
验证坐标在某坐标区域内php代码
2016/10/08 PHP
详解Yii实现分页的两种方法
2017/01/14 PHP
js wmp操作代码小结(音乐连播功能)
2008/11/08 Javascript
JS的千分位算法实现思路
2013/07/31 Javascript
jquery实现点击页面计算点击次数
2015/01/23 Javascript
AngularJS教程之MVC体系结构详解
2016/08/16 Javascript
jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)
2016/12/22 Javascript
JavaScript学习总结(一) ECMAScript、BOM、DOM(核心、浏览器对象模型与文档对象模型)
2018/01/07 Javascript
vue拦截器实现统一token,并兼容IE9验证功能
2018/04/26 Javascript
vue插槽slot的理解和使用方法
2019/04/03 Javascript
微信小程序实现滚动加载更多的代码
2019/12/06 Javascript
原生JavaScript实现留言板
2021/01/10 Javascript
Python快速从注释生成文档的方法
2016/12/26 Python
Python2.7基于笛卡尔积算法实现N个数组的排列组合运算示例
2017/11/23 Python
python获取文件路径、文件名、后缀名的实例
2018/04/23 Python
python 列表,数组和矩阵sum的用法及区别介绍
2018/06/28 Python
Python提取转移文件夹内所有.jpg文件并查看每一帧的方法
2019/06/27 Python
Python产生一个数值范围内的不重复的随机数的实现方法
2019/08/21 Python
Python批量安装卸载1000个apk的方法
2020/04/10 Python
使用Python pip怎么升级pip
2020/08/11 Python
css3中的calc函数浅析
2018/07/10 HTML / CSS
CSS3制作漂亮的照片墙的实现代码
2016/06/08 HTML / CSS
HTML5 3D旋转相册的实现示例
2019/12/03 HTML / CSS
YesStyle美国/全球:购买亚洲时装、美容化妆品和生活百货
2017/01/16 全球购物
土木工程应届生求职信
2013/10/31 职场文书
门卫人员岗位职责
2013/12/24 职场文书
学习标兵获奖感言
2014/02/20 职场文书
《大作家的小老师》教学反思
2014/04/16 职场文书
环保建议书100字
2014/05/14 职场文书
党的群众路线对照检查材料
2014/08/27 职场文书
2015年社区流动人口工作总结
2015/05/12 职场文书
创业计划书之家教托管
2019/09/25 职场文书
Java Optional<Foo>转换成List<Bar>的实例方法
2021/06/20 Java/Android
《勇者辞职不干了》ED主题曲无字幕动画MV公开
2022/04/13 日漫
python数字图像处理之对比度与亮度调整示例
2022/06/28 Python