Javascript对象

Javascript对象

随着Javascript开源框架和HTML5的兴起，javascript对象越来越多的被使用。Javascript不再像以前一样，只是简单的面向过程的函数。

Javascript对象和其他所有面向对象的语言一样，有属性，有方法。可以创建对象，可以访问对象属性，可以操作对象方法等。

如何创建对象

1. 直接用键-值对创建对象

var obj1={};//创建一个空对象

var obj2={attr1:'1',attr2:'2'};//创建一个有两个属性的对象

var obj3={

        "attr1 space":'1',

        "attr2-minus":'2',

        "attr if":'3'

    }  ;//创建有空格、减号 保留字等特殊字符作为属性的对象

alert(obj2.attr1);//获取普通属性的对象

    alert(obj3["attr2-minus"]);//获取特殊属性的对象

²  普通的的javascript对象的属性可以直接用点（.）来获取属性。

²  但是如果有特殊字符的，定义的时候需要用双引号括起来，获取的时候需要用中括号[]的方式获取。

1. 通过new创建对象

var obj=new Object();

• obj.attr1='1';

    alert(obj.attr1);

1. 通过Object.create()创建

IE8不支持

获取对象属性的两种方式比较

获取对象属性有两种方式

²  点运算符：Object.attr

²  中括号运算符：object[attr];

第一种运算符比较直观，更符合面向对象的语言。

但很多时候，第一种方式却无法使用。

         例如：

                   如果属性有空格，等特殊字符。

                   另一种情况，属性是动态的。如下表代码。

  for(var i=0;i<len;i++){

        alert(obj["attr"+i])

    }

上表是取属性，同样动态的增加属性的时候，我们也不知道属性的名字是什么，这时候我们就只能用中括号运算符。

迭代对象属性

许多时候，我们并不知道对象有多少属性，更不知道具体的属性的值。但此时如果我们想要获取对象的某个属性或所有属性属性时，就需要迭代。用for in。

如下表，假设我们在迭代前，并不知道obj中有attr1和attr2这两个属性。

var obj=new Object();

    obj.attr1="1";

    obj.attr2="2";

    for(var attr in obj){

       alert("obj."+attr+":"+obj[attr]);

    }

 

继承

function extend(o) {

        if (o == null) {

            alert("空不可以继承");

            return;

        }

        Object.create(o);

        var t = typeof o;

        if (t != 'object' && t != 'function') {

            alert("传入的父类必须是对象");

            return;

        }

        function f() {

        }

 

        f.prototype = o;

        return new f();

    }

    var parent = {};

    parent.attr1 = 12;

    var child1 = extend(parent);

    child1.attr2 = 10;

    alert(child1.attr1 * child1.attr2);

Javascript在查找一个对象的属性时，如果该对象没有这个属性，则会查找这个对象的原型对象的该属性。如上表child1并没有attr1属性，但是他的原型对象parent有，则会直接使用原型对象的属性。如果原型对象的该属性还不存在，则继续向上查找原型对象的原型对象的属性，直到原型对象是null为止。

这也就是面向对象的属性继承。如果子类没有属性，则查看父类是否有，如果父类没有则再查找父父类……依次递归……

 

删除属性

delete obj.attr1;

delete obj[“attr1”];

 

注意：

²  delete 只是删除属性和宿主对象的联系，而不是真的把这个属性的内容删掉。

²  delete 只能删除自有属性，不能删除继承属性。

var parent = {};

    parent.attr1 = 12;

    var child1 = extend(parent);

    child1.attr2 = 10;

    alert(child1.attr1 * child1.attr2);

//    delete child1[attr1];

    delete child1["attr1"];

    alert(" child1.attr1 :"+ child1.attr1 );//继承属性不会被删除

    delete child1["attr2"];

        alert(" child1.attr2 :"+ child1.attr2 )//自有属性可以删除

²  删除一个不存在的属性或父类的属性，javascript不会报错，但是不做任何操作

²  删除全局变量定义的属性会报错

检测属性

in或者hasOwnProperty();

  var obj={x:1};

    alert("x" in obj);//true

    alert("toString" in obj);  //true

    alert(obj.hasOwnProperty("x")); //true

    alert(obj.hasOwnProperty("toString")); //继承的属性，false

hasOwnProperty只返回自有属性，不含继承属性

 

prototype

prototype主要用来在对象中添加属性或方法。继承等其他是他的高级的应用。但在实际的javascript应用过程中用得并不多。

function book(name,author){

        this.name=name;

        this.author=author;

    }

    book.prototype.show=function(){

        alert("《"+this.name+"》的作者是:"+this.author) ;

    }

    var oBook=new book("洗手间里的主权","陶杰");

    oBook.show();  //《洗手间里的主权》的作者是陶杰