javascript面向对象技术基础

一、对象和数组(Objects and Arrays)

什么是对象?把一些"名字-属性"的组合放在一个单元里面,就组成了一个对象.我们可以理解为javascript中
的对象就是一些"键-值"对的集合。"名字"只能是string类型,不能是其他类型,而属性的类型则是
任意的(数字/字符串/其他对象..).可以用new Object()来创建一个空对象,也可以简单的用"{}"来创建一个空对象,这两者的作用是等同的.

var emptyObject1 = {};           //创建空对象   
var emptyObject2 = new Object(); //创建空对象   
var person = {"name":"sdcyst",   
          "age":18,   
          "sex":"male"};     //创建一个包含初始值的对象person   
alert(person.name);              //sdcyst   
alert(person["age"]);            //18 

 

 从上面的例子我们也可以看到，访问一个对象的属性，可以简单的用对象名加"."后加属性的名字，也
可以用"[]"操作符来获取,此时在[]里面的属性名字要加引号,这是因为对象中的索引都是字符串类型的.
javasript对象中属性的个数是可变的,在创建了一个对象之后可以随时对它赋予任何的属性.

 

var person = {};   
person.name = "sdcyst";   
person["age"] = 18;   
alert(person.name + "__" + person.age); //sdcyst__18   
  
var _person = {name:"balala","age":23}; //在构建一个对象时,属性的名字可以不用引号来标注(name),   
                    //但是仍旧是一个字符串类型.在访问的时候[]内仍旧需要引号   
alert(_person["name"] + "__" + person.age); //balala__23   
alert(_person[name]);                   //undefinied  

  通过"."操作符获取对象的属性,必须得知道属性的名字.一般来说"[]"操作符获取对象属性的功能更强大一些,
可以在[]中放入一些表达式来取属性的值，
比如可以用在循环控制语句中,而"."操作符则没有这种灵活性。

var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};   
var namestring = "";   
for(var props in name) {  //循环name对象中的属性名字   
    namestring += name[props];   
}   
alert(namestring);  //NAME1NAME2NAME3NAME4   
  
namestring = "";   
for(var i=0; i<4; i++) {   
    namestring += name["name"+(i+1)];   
}   
alert(namestring);  //NAME1NAME2NAME3NAME4  

 delete操作符可以删除对象中的某个属性,判断某个属性是否存在可以使用"in"操作符.

var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};   
var namestring = "";   
for(var props in name) {  //循环name对象中的属性名字   
    namestring += name[props];   
}   
alert(namestring);  //NAME1NAME2NAME3NAME4   
  
delete name.name1;  //删除name1属性   
delete name["name3"];  //删除name3属性   
namestring = "";   
for(var props in name) {  //循环name对象中的属性名字   
    namestring += name[props];   
}   
alert(namestring);  //NAME2NAME4   
  
alert("name1" in name); //false   
alert("name4" in name); //true 

 需要注意,对象中的属性是没有顺序的.

 

二、函数(Function)

创建函数:
function f(x) {........}
var f = function(x) {......}
上面这两种形式都可以创建名为f()的函数,不过后一种形式可以创建匿名函数
函数定义时可以设置参数,如果传给函数的参数个数不够,则从最左边起依次对应,其余的用undefined赋值,如果传给函数
的参数多于函数定义参数的个数,则多出的参数被忽略.

function myprint(s1,s2,s3) {   
    alert(s1+"_"+s2+"_"+s3);   
}   
myprint();      //undefined_undefined_undefined   
myprint("string1","string2"); //string1_string2_undefined   
myprint("string1","string2","string3","string4"); //string1_string2_string3 

 因此,对于定义好的函数,我们不能指望调用者将所有的参数全部传进来.对于那些必须用到的参数应该在函数体中
加以检测(用!操作符),或者设置默认值然后同参数进行或(||)操作来取得参数.

function myprint(s1,person) {   
    var defaultperson = {   //默认person对象   
        "name":"name1",   
    "age":18,   
    "sex":"female"  
    };   
    if(!s1) {    //s1不允许为空   
        alert("s1 must be input!");   
    return false;   
    }   
    person = person || defaultperson;  //接受person对象参数   
    alert(s1+"_"+person.name+":"+person.age+":"+person.sex);   
};   
  
myprint(); //s1 must be input!   
myprint("s1"); //s1_name1:18:female   
myprint("s1",{"name":"sdcyst","age":23,"sex":"male"});  //s1_sdcyst:23:male  

 函数的arguments属性
在每一个函数体的内部,都有一个arguments标识符,这个标识符代表了一个Arguments对象.Arguments对象非常类似
于Array(数组)对象,比如都有length属性,访问它的值用"[]"操作符利用索引来访问参数值,但是,二者是完全不同的
东西,仅仅是表面上有共同点而已(比如说修改Arguments对象的length属性并不会改变它的长度).

function myargs() {   
    alert(arguments.length);   
    alert(arguments[0]);   
}   
myargs();   //0  ---  undefined   
myargs("1",[1,2]);  //2 --- 1

 Arguments对象有一个callee属性,标示了当前Arguments对象所在的方法.可以使用它来实现匿名函数的内部递归调用.

function(x) {   
    if (x <= 1) return 1;   
    return x * arguments.callee(x-1);   
}  (section8.2) 

 Method--方法
方法就是函数.我们知道,每一个对象都包含0个或多个属性,属性可以是任意类型,当然也包括对象.函数本身就是一种
对象,因此我们完全可以把一个函数放到一个对象里面,此时,这个函数就成了对象的一个方法.此后如果要使用该方法,
则可以通过对象名利用"."操作符来实现.

var obj = {f0:function(){alert("f0");}}; //对象包含一个方法   
function f1() {alert("f1");}   
obj.f1 = f1;    //为对象添加方法   
  
obj.f0(); //f0  f0是obj的方法   
obj.f1(); //f1  f1是obj的方法   
f1();     //f1  f1同时又是一个函数,可以直接调用   
f0();     //f0仅仅是obj的方法,只能通过对象来调用 

 

方法的调用需要对象的支持,那么在方法中如何获取对象的属性呢?this!this关键字我们已经很熟悉了,在javascript的方
法中,我们可以用this来取得对方法调用者(对象)的引用,从而获取方法调用者的各种属性.

var obj = {"name":"NAME","sex":"female"};   
obj.print = function() {  //为对象添加方法   
    alert(this.name + "_" + this["sex"]);   
};   
obj.print();  //NAME_female   
obj.sex = "male";   
obj.print();  //NAME_male  

 三、类、构造函数、原型

构造函数:
new操作符用来生成一个新的对象.new后面必须要跟上一个函数,也就是我们常说的构造函数.构造函数的工作原理又是怎样的呢?
先看一个例子:

function Person(name,sex) {   
    this.name = name;   
    this.sex = sex;   
}   
var per = new Person("sdcyst","male");   
alert("name:"+per.name+"_sex:"+per.sex); //name:sdcyst_sex:male 

 四、类变量/类方法/实例变量/实例方法
在javascript中,所有的方法都有一个call方法和apply方法.这两个方法可以模拟对象调用方法.它的第一个参数是对象,后面的参数表示对象调用这个方法时的参数。

举个例子:

function Person(name,age) {  //定义方法   
    this.name = name;   
    this.age = age;   
}   
var o = new Object();   //空对象   
alert(o.name + "_" + o.age); //undefined_undefined   
  
Person.call(o,"sdcyst",18); //相当于调用:o.Person("sdcyst",18)   
alert(o.name + "_" + o.age); //sdcyst_18   
  
Person.apply(o,["name",89]);//apply方法作用同call,不同之处在于传递参数的形式是用数组来传递   
alert(o.name + "_" + o.age); //name_89