前言

JS对象是一种复合类型,它允许你通过变量名存储和访问,换一种思路,对象是一个无序的属性集合,集合中的每一项都由名称和值组成(听起来是不是很像我们常听说的HASH表、字典、健/值对?),而其中的值类型可能是内置类型(如number,string),也可能是对象。这种方式不能用new方式创建,所以不可重用。

字面量方式-最简单方式

这种创建对象的方式通过{}来组织对象属性和方法。

1
2
3
4
5
6
7
8
9
10
11
12
13
var emptyObj = {
'id': 1//注意是逗号
'name': 'zhagnsan',
'fn1': function(){
//使有 this 调用方法
this.fn2()
//"此处是js对象的方法,可以写不限个,注意冒号,逗号"
alert(this.id); //同样可以用this方法。
},
'fn2': function(){
alert(this['id']);//以集合的方式访问。
}
};

对象的方法调用

1
2
emptyObj.fn1();
emptyObj.fn2();

绑定:
如果使用这种方式进行绑定,则需要进行一次方法调用,才会生效,不像之前任意放在 script 代码块中就可以生效的
对象要用自己的方法,使用 this 进行调用。

构造函数方式

可重用,先像Java一样创建一个对象的模板,然后new一个出来。this在里面的用法一样的。
第二种创建对象的方式。
这种方式就像Java一样,先创建一个对象的模板:

定义一个js类

1
2
3
4
5
6
7
8
function myClass(){
this.id = 5;
this.name = 'myClass';
this.getName = function(){
alert(this.name);
return this.name
}
}

创建对象:

1
2
3
var my = new myClass();
my.getName();
alert(my.id);

工厂方式

返回一个对象给函数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 定义一个工厂函数
function myClass() {
var obj = {
'id':2,
'name':'myclass'
};
return obj;
}

function _myClass() {
var obj = new Object();
obj.id = 1;
obj.name = '_myclass';
return obj;
}

打印一下:

1
2
3
4
5
6
var my = new myClass();
var _my = new _myClass();
alert(my.id);
alert(my.name);
alert(_my.id);
alert(_my.name);

带参方式

在使用百度地图API时,碰到一种调用方式,没有见过有一时搞不明白是怎么回事。研实了一下才明白。
js中使用this时可以直接指向方法名,不需要加()。
new 出来的对象调用方法属性时,要看构造函数中的this是指向谁的,注意。

构造函数的this的用引指向,直接影响到new 的时候的指针引用。

1
2
3
4
5
6
7
8
9
10
11
function fun(e) {
alert(e);
}

function test(value, fun) {
this.value = value;
this.fun = fun; //指向形参
}
var funTest = new fun("aaaa");
var obj = new test(11, funTest);
obj.fun();

匿名函数方式,匿名函数指向当前匿名函数。

1
2
3
4
5
6
7
8
9
10
11
12
13
function fun(e) {
alert(e+"2");
}

function test(value, fun) {
this.value = value;
this.fun = fun; //指向形参
}

var obj = new test(22, function(e){
alert(e+"1");
});
obj.fun("aaaaaaaaaaa")

结果打印:aaaaaaaaaaa1

改变构造函数中的this指向,new的对象指向名部方法。

1
2
3
4
5
6
7
8
9
10
11
12
13
function fun(e) {        //指向这里
alert(e+"2");
}

function test(value, ttt) {
this.value = value;
this.fun = fun;
//!!!!注意,指向的是fun方法,ttt参数没有起做用,在局部没有找到变量,则直接找表达式右边的方法名。
}
var obj = new test(22, function(e){
alert(e+"1");
});
obj.fun("aaaaaaaaaaa");

结果打印:aaaaaaaaaa2

总结:实际应用中不要出现this引用不清楚的清况。