2.1JavaScript自定义类与对象

  • Post author:
  • Post category:java



JavaScript对象的概述



对象

就是指现实世界中的某个具体事物或者一个独立的实体,如一个学生、一辆汽车、一个div标记都是一个对象。

面向对象的概念:就是把现实中的对象抽象为一组数据和若干操作方法(函数) ,可以把对象想象成一种新型变量:这种变量既能保存自己的若干数据成员(特征或属性),又包含对这些数据进行处理的方法 (函数或行为)。

  • 学生对象的属性:学号、姓名、性别、年龄、各门课成绩
  • 学生对象的方法:计算总分平均分、输出个人简介及成绩单
  • a标记对象的属性:id值、class样式类名、href超链接页面
  • a标记对象的方法:鼠标进入、离开、单击时的事件函数

一个对象的成员也可以是其他对象,如汽车对象包含发动机对象,div对象会包含a对象、a对象还包含属性对象。

面向对象三大特征:

对象封装或抽象(类)、继承与多态


Java语言和JavaScript语言的区别:Java是一种

基于类的面向对象

的语言,具有

面向对象

的全部特征;JavaScript

基于原型对象

的面向对象的语言,具有封装特征,同时具有部分继承特征,但是不支持多态,严格说它只是一种基于对象的语言而不是面向对象的语言。

JavaScript中没有类的概念,JavaScript有构造函数(原型对象)的概念


JavaScript用户自定义构造函数(原型对象)


使用

对象

,必须先根据对象的属性成员与操作方法抽象封装成构造函数,再用这个构造函数去创建具体的对象。在学习JavaScript时,我们可在某些不严格的情况下把构造函数(原型对象)理解为类。

例如:JavaScript设计构造函数,并创建“人”的对象的代码如下:

function Person(name, age)  {               //定义Person构造函数,可以没有参数
     this.name=name;                               //定义对象的属性成员
     this.age=age;
     this.setName=function(name) {        //构造函数内直接定义对象方法(函数)
           this.name=name; 
     }
      this.setAge=setAge;                                 //间接定义对象方法,函数内声明在函数外定义
}
function setAge(age) {                           //构造函数外单独定义对象的方法
     this.age=age }
var per01=new Person("张三",23);


JavaScript创建与使用对象



对象属性的使用



对象引用自己的属性、调用自己的方法必须使用“.”运算符,通过对象名调用。

  1. 直接使用对象的某个属性值:对象名.属性名; 或:对象名[“属性名”];
  2. 直接为对象的属性变量赋值:对象名.属性名=属性值; //新值冲掉原值
  3. 获取对象的某个属性值保持在变量中: var 变量名=对象名.属性名;
  4. 通过getAttribute( )通用方法获取属性值:对象名.getAttribute(“属性名”); 或:var 变量名=对象名.getAttribute(“属性名”);

如果属性成员又是一个对象,则必须用“.”逐级引用对象成员的某个属性值。例如Car类的汽车对象myCar,其中power属性为Engine类的发动机对象,而发动机对象还包含曲轴crankcase和活塞piston,如果引用myCar汽车对象中power发动机对象的活塞属性piston,必须书写为:myCar.power.piston 。


对象方法的使用:


对象名. 方法名([参数]);

或者对象名[’方法名‘] ([参数]);


用prototype给类添加新的属性或方法


自定义类、包括几乎所有JavaScript内置的系统类都可以使用

prototype

关键字给类添加任意的属性或方法

语法格式:类名. Prototype . 新的属性名或方法名;

如果是添加新方法,还必须单独定义这个函数,可以同时为方法设置参数:

可在添加方法时直接定义代码: 类名.prototype. 方法名= function([参数]) { //函数代码; }


事实上除了可以通过prototype关键字给对象添加新的属性和方法,还可以直接给某一个特定对象添加属于自己的属性和方法,或者通过setAttribute()通用方法为特定对象添加属于它自己的新属性或方法

  1. 直接为某个特定对象添加属于它自己的属性或方法

    直接为对象添加新属性: 对象名.属性名=属性值; //属性若存在,则为赋值操作

    直接为对象添加新方法: 对象名.方法名=function([参数]) { //函数代码; }

    对象名.方法名=函数名; //必须单独定义新添加的函数

    function 函数名([参数]) { //函数代码; }



  2. setAttribute

    ()通用方法为特定对象添加属于它自己的新属性或方法

    语法格式:对象名.setAttribute(“属性名或方法名”, “属性值或方法代码”);

    若该对象已存在指定属性则直接赋值,把现有属性原值冲掉保存新值。

    例如: input.setAttribute(“type”, “text”); 等价:input.type=“text”;

    例如:input.setAttribute(“onclick”, “javascript:alert(‘This is a test!’);”);

    等价:input.οnclick=function() { alert(‘This is a test!’); }


创建Object自定义空对象或无类型空对象


JavaScript提供了一个内置的Object类,该类没有定义属性和方法,可供用户直接创建自定义的空对象或者无类型的空对象,再为该对象添加属于它自己的任意属性或方法。

  • 用户直接创建自定义的空对象
 var myObj = new Object( );            //空对象默认值为:[object Object]
  • JavaScript还允许创建自定义无类型空对象,可以为该对象添加任意的属性或方法。
var 无类型对象 = { };    //无类型对象默认值为:[object Object]


创建匿名类的对象


语法格式: var 匿名类对象={


//类代码:定义若干属性、方法;

}

语法说明:

1)匿名类只能定义1个对象;

2)类中定义的属性须用冒号赋值,即属性名:属性值,使用时可任意为属性重新赋值;

3)类中定义的方法也必须用冒号定义,方法名: function([参数]) { //方法代码; };

4)类中定义的所有属性、方法之间不论换行与否都必须用逗号隔开,直到类定义结束。

var obj={};                     //创建一个无类型空对象,可添加属性方法
     obj.name="晓晓"; obj.age=18;
     document.write("无类型对象obj="+obj.name+obj.age +"岁<hr />")
     var baby=                           //创建一个匿名类,只能有1个baby对象
      { name:"哈宝", height:176,       //匿名类属性方法必须冒号赋值
        nickname:"宝儿", age:"1岁", sex:"女孩",  //必须用逗号隔开
        say:function()                //定义方法say()
          { document.write("我是"+this.name+", 小名\""+this.nickname
                                   +",身高="+this.height +"\"。\n我是个小"+this.sex
                                   +",今年"+this.age+"了!<br />"); 
       }  }      
     baby.say();                       //baby匿名类对象调用方法
     baby.name="虎虎";       //baby对象重新赋值
     baby.age="5岁"; baby.sex="男孩";   
     baby.say();



版权声明:本文为SuperBetterMan原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。