JavaScript并不是面向对象的程序设计语言,但它是基于对象的。JavaScript中的每个函数都可用于创建对象,返回的对象既是该对象的实例,也是object的实例 。

一.对象与关联数组

JavaScript中的对象本质上是一个关联数组,就像Java里的Map数据结构,有一组key-value对组成,不同的是JavaScript对象的value不仅可以是值,也可以是函数,该函数就是该对象的方法。

当value是基本类型的值或者复合类型的值的时候,此时value就是该对象的属性值。

因此访问某个JavaScript对象时,不仅可以使用obj.propName的形式,也可以采用obj[propName]的形式,有时候必须使用这种形式。

<script type="text/javascript">
function Person(name,age)
{
this.name = name;
this.age = age;
this.info = function(){
alert("info方法");
}
} var p = new Person('Sherman',30);
for(propName in p)
{
document.writeln("p对象的"+propName+"属性的属性值是"+p[propName]+'<br/>')
}
</script>

二.继承和prototype

JavaScript没有提供显示的继承语法,每个对象都是object的子类,因而各对象之间平等,各对象之间不存在直接的父子关系。

JavaScript提供了一些内建类,,通过这些内建类可以方便的创建各自对象。

JavaScript是一种动态语言,允许自由地为对象增加属性和方法,当程序为对象不存在的属性赋值时,即可认为为该对象增加属性,例如

var p = {}
p.age=30;
p.info = function(){
alert('info方法');
}

JavaScript的所有类都有一个protoType属性,如果为JavaScript类的protoType的属性增加属性,方法,则可视为对原有类的拓展。我们可以理解为:增加了protoType属性的类继承了原有的类,

这是JavaScript的伪继承机制。看下面代码:

<script type="text/javascript">
function Person(name,age)
{
this.name = name;
this.age = age;
this.info = function(){
document.writeln('姓名:'+this.name+'<br/>');
document.writeln('年龄:'+this.age+'<br/>');
}
}
var p1 = new Person('Sherman',23);
p1.info(); Person.prototype.walk = function()
{
document.writeln(this.name+'慢慢的溜达...<br/>')
}
document.writeln('<hr/>');
var p2 = new Person('Leegang',30);
p2.walk();
p1.walk();
</script>

注意的是,伪继承的本质是修改了原有的类,并不是产生新的子类

通过使用protoType属性可以为JavaScript内建类进行拓展

<script type="text/javascript">
Array.prototype.indexof = function(obj)
{
var result = -1;
for(var i = 1;i < this.length;i++)
{
if(this[i] == obj){
result = 1;
break;
}
}
return result;
} var arr = [4,5,7,-2];
alert(arr.indexof(-2));
</script>

此外,protoType代表了该类的原型对象,在默认情况下,JavaScript类的protoType属性值是一个对象,将JavaScript类的protoType设为父类实例,可实现JavaScript的继承,例如:

<script type="text/javascript">
function Person(name,age)
{
this.name = name;
this.age = age;
}
Person.prototype.sayHello = function()
{
console.log(this.name+'向您打招呼');
} var per = new Person('牛魔王',30000);
per.sayHello(); function Student(grade)
{
this.grade = grade;
} Student.prototype = new Person('未命名',0);
Student.prototype.intro = function()
{
console.log("%s是个学生,读%d年级",this.name,this.grade); } var stu = new Student(5);
stu.name = '孙悟空'; console.log(stu instanceof Student);//输出true
console.log(stu instanceof Person);//输出true
stu.sayHello();
stu.intro();
</script>

三.构造器实现伪继承

实现代码如下:

<script type="text/javascript">
function Person(name,age)
{
this.name = name;
this.age = age;
this.sayHello = function()
{
console.log(this.name+'向您打招呼!');
}
} var per = new Person('牛魔王',30000);
per.sayHello(); function Student(name,age,grade)
{
this.a = Person;
this.a(name,age);
this.grade = grade;
} Student.prototype.intro = function()
{
console.log("%s是个学生,读%d年级",this.name,this.grade);
} var stu = new Student('孙悟空',34,5);
console.log(stu instanceof Student);//输出true
console.log(stu instanceof Person);//输出true
stu.sayHello();
stu.intro();
</script>

 四.使用apply或call实现伪继承

实现代码如下:

<script type="text/javascript">
function Person(name,age)
{
this.name = name;
this.age = age;
this.sayHello = function()
{
console.log(this.name+'向您打招呼!');
}
} var per = new Person('牛魔王',30000);
per.sayHello(); function Student(name,age,grade)
{
//this.a = Person;
// this.a(name,age);
Person.call(this,name,age);
Person.apply(this,[name,age]);
this.grade = grade;
} Student.prototype.intro = function()
{
console.log("%s是个学生,读%d年级",this.name,this.grade);
} var stu = new Student('孙悟空',34,5);
console.log(stu instanceof Student);//输出true
console.log(stu instanceof Person);//输出true
stu.sayHello();
stu.intro();
</script>

输出结果同上

五.创建对象

JavaScript创建对象大致有3种方式:

1.使用new关键字调用构造器创建对象

2.使用object类创建对象

//创建一个默认的对象
var obj = new Object();

这是空对象,没有任何属性和方法,但是JavaScript是动态语言,可以动态的为对象增加属性和方法

如下代码:

<script type="text/javascript">
var myobj = new Object();
myobj.name = 'Sherman';
myobj.age = 34;
document.writeln(myobj.name+myobj.age);//输出Sherman34
</script>

3.使用Json语法创建对象

使用Json语法创建JavaScript对象时,属性值不仅可以是普通字符串,也可以是任何基本数据类型,还可以是数组,函数,甚至是另外一个JSON语法创建的对象。

Person =
{
name:'Sherman',
gender:'male',
son:{
name:'guoguo',
grade:1
},
info:function()
{
document.writeln('姓名:'+this.name+'性别:'+this.gender);
}
}
</script>

也可以使用JSON语法创建数组

arr = [vlue1,value2,value3,...]

如下代码,创建了一个复杂的JSON对象

 Person =
{
name:'Sherman',
age:29,
schools:['小学','中学','大学'],
parents:[{
name:'father',
age:49,
address:'广州'
},{
name:'mother',
age:51,
address:'深圳'
}]
}

JavaScript三(对象思想)的更多相关文章

  1. JavaScript RegExp 对象的三种方法

    JavaScript RegExp 对象有 3 个方法:test().exec() 和 compile().(1) test() 方法用来检测一个字符串是否匹配某个正则表达式,如果匹配成功,返回 tr ...

  2. 从零构建JavaScript的对象系统

    一.正统的类与继承 类是对象的定义,而对象是类的实例(Instance).类不可直接使用,要想使用就必须在内存上生成该类的副本,这个副本就是对象. 以Java为例: public class Grou ...

  3. 关于JavaScript中对象的继承实现的学习总结

    一.原型链 JavaScript 中原型链是实现继承的主要方法.其主要的思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.实现原型链有一种基本模式,其代码如下. function Super ...

  4. javascript学习-对象与原型

    javascript学习-对象与原型 Javascript语言是符合面向对象思想的.一般来说,面向对象思想需要满足以下三个基本要求: 封装,Javascript的对象可以自由的扩充成员变量和方法,自然 ...

  5. 浅谈javascript的面向对象思想

    面向对象的三大基本特性 封装(把相关的信息(无论数据或方法)存储在对象中的能力) 继承(由另一个类(或多个类)得来类的属性和方法的能力) 多态(一个对象在不同情况下的多种形态) 定义类或对象 第一种: ...

  6. 聚焦JavaScript面向对象的思想

    面向对象是一种软件开发方法,是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物.随着时代的发展,计算机被用于解决越来越复杂的问题.一切事物皆对象,通过面向对象的方式,将现实世界的 ...

  7. 关于javascript自定义对象(来自网络)(最近几天不会的)

    javascript定义对象的几种简单方法 1.构造函数方式,全部属性及对象的方法都放在构造方法里面定义 优点:动态的传递参数 缺点:每创建一个对象就会创建相同的方法函数对象,占用大量内存 funct ...

  8. JavaScript 三个组成部分

    1.核心(ECMAScript) ECMAScript 仅仅是一个描述,定义了脚本语言的所有属性.方法和对象.其他语言可以实现 ECMAScript 来作为功能的基准,JavaScript 就是这样: ...

  9. javascript中对象的深度克隆

    记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...

  10. JavaScript日期对象使用总结

    javascript Date日期对象的创建 创建一个日期对象: var objDate=new Date([arguments list]); 我总结了参数形式主要有以下3种: new Date(& ...

随机推荐

  1. 3D MAX 人物骨骼建设

      3DMax方面所涉及的专业知识:                       (1)一下的关于3DMax中对于人物的设计和操作均需要在对3DMax基础知识熟练掌握的情况下进行的. (2)骨骼架设: ...

  2. 【转】OPenGL MFC绘图

    一.简介 GDI是通过设备句柄(Device Context以下简称"DC")来绘图,而OpenGL则需要绘制环境(Rendering Context,以下简称"RC&q ...

  3. 【AngularJS】AngularJS整合Springmvc、Mybatis环境搭建

    近期想学习AngularJS的使用,网上搜了一圈后,折腾了半天解决bug后,成功使用AngularJS整合Springmvc.Spring.Mybatis搭建了一个开发环境.(这里Spring使用的版 ...

  4. 【Java面试题】59 Math.round(11.5)等於多少? Math.round(-11.5)等於多少?

    Math类中提供了三个与取整有关的方法:ceil.floor.round,这些方法的作用与它们的英文名称的含义相对应,例如,ceil的英文意义是天花板,该方法就表示向上取整,Math.ceil(11. ...

  5. iftop、ifstat详解

    ifstat 介绍 ifstat工具是个网络接口监测工具,比较简单看网络流量 实例 默认使用 #ifstat eth0 eth1 KB/s in KB/s out KB/s in KB/s out 0 ...

  6. Linux下安装subversion1.6.5和apache2

    以下安装是在RHEL5.5默认安装的情况下,以root身份进行安装!这个实验我安装了n次,最后总是不成功,因为涉及到略多的软件和配置.下面是安装步骤和配置,自己记下来.希望给下次配置的时候不要像以前那 ...

  7. Adobe Acrobat 不能打开在线pdf。Adobe Acrobat 应用程序正在被终止,因为内存错误

    Adobe Acrobat 应用程序正在被终止,因为内存错误. Adobe Acrobat 不能打开在线pdf. 当出现上面两种错误时. 原因可能是Acrobat的更新有问题. 解决方法:打开C:\D ...

  8. IIS 使用多个https和通配证书解决方案

    环境:OS :WINDOWS 2008 IIS: IIS7 域名:三个二级域名 问题:由于一个网站只支持一个443,但可以通过更改配置得到绑定不同域名.但由于公用证书,所以问题出来.只能为一个二级域名 ...

  9. ubuntu 16.04 appstreamcli 问题

    http://blog.csdn.net/zhbpd/article/details/77508675

  10. NHibernate初学五之关联一对多关系

    1:创建两张表T_Country.T_Person:其中T_Person表中有一个CountryID对应T_Country的ID,一个Country可以对应多个Person CREATE TABLE ...