对象化编程-------简单地去理解就是把javascript能涉及到的范围分成各种对象,对象下面再次划分对象。编程出发点多是对象,或者说基于对象。所说的对象既包含变量,网页,窗口等等
对象的含义
对象可以是文字,表单等等。对象包含一下
属性-------对象的某些特定的性质
方法-------对象能做的事情
事件-------能响应发生在对象上的事情
注意:对象只是一种特殊的数据
2.
基本对象
我们一般划分的角度还是从数据类型这方面
Number
String
Array
Math
Data
这边我只是简单地罗列出来部分,具体的可以参考http://www.w3school.com.cn/js/js_obj_intro.asp
不过我这边还是想讲一下比较流行的一道前端面试题,也是我当初来百度面试的时候问我的(题目的来源好像是方荣大侠的某个web前端研发工程师编程能力成长之路的文档里面的)
废话少说
出题:
“输出字符串--今天是星期几”
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50 |
var
_str = ""; var
_today = new
Date().getDay(); if(_today == 0){ _str = "今天是星期日"; }else
if(_today == 1){ _str = "今天是星期一"; }else
if(_today == 2){ _str = "今天是星期二"; }else
if(_today == 3){ _str = "今天是星期三"; }else
if(_today == 4){ _str = "今天是星期四"; }else
if(_today == 5){ _str = "今天是星期五"; }else
if(_today == 6){ _str = "今天是星期六"; } var
_str ="今天是星期"; var
_today=new
Date().getDay(); switch(_today){ case
0: _str += "日"; break; case
1: _str += "一"; break; case
2: _str += "二"; break; case
3: _str += "三"; break; case
4: _str += "四"; break; case
5: _str += "五"; break; case
6: _str += "六"; break; } var
_str = "今天是星期"+"日一二三四五六".charAt(new
Date().getDay()); |
3.
下面介绍创建类和对象的模式
简单方式
|
1
2
3
4
5
6
7
8
9 |
var
people ={}; Js代码 people.name = "steven"; people.age = 23; people.getName = function(){ return
"People‘s name is "+ this.name; }; console.log(people.getName()); //People‘s name is steven console.log(people.age); //23 |
不好的地方就是:在创建多个对象的场景下会产生 很多冗余的代码,耦合度不高
工厂模式下
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14 |
function
makePeople(name,age,job){ var
_obj = {}; _obj.name = name; _obj.age =age; _obj.job = job; _obj.getName = function(){ return
"People‘s name is "+ this.name; } return
_obj; } var
webdesigner = makePeople("steven",23,"wendesigner"); console.log(webdesigner.getName ); //People‘s name is steven console.log(webdesigner.job) //wendesigner |
Js代码
不好的地方就是:实例化比较频繁
原型模式(prototype)下
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 |
function
People(){}; People.prototype = { constructor :People, name:"steven", age:23, job:"webdesigner", getName:function(){ return
"People‘s name is "+this.name; } } var
webdesign = new
People(); var
carman = new
People(); console.log(webdesign.getName()); //People‘s name is steven console.log(carman.getName()); //People‘s name is steven |
Js代码
不好的地方就是:初始化参数不支持传递,还有就是原型的所有属性和方法会被所有的实例共享
混合模式(原型+构造函数)下
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18 |
function
People(name.age.job){ Js代码 this.name = name; Js代码 this.age = age; this.job = job; }; People.prototype = { constructor:People, getName: function(){ return
"People‘s name is "+this.name; } } var
webdesigner = new
People("steven",23,"webdesigner"); var
carman = new
People("zyc",24,"carman"); console.log(webdesigner.getName()) //People‘s name is steven console.log(carman.getName()) //People‘s name is zyc |
Js代码
不好的地方就是:对象的属性和方法也多是公用的
闭包下的私有变量模式
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22 |
(function(){ var
name =""; People = function(val){ name = val; }; People.prototype ={ constructor:People, getName:function(){ return
"People‘s name is "+ name ; } }; })(); var
webdesigner = new
People("steven"); console.log(webdesigner.name); //undefined console.log(webdesigner.getName()); //People‘s name is steven var
carman= new
People("zyc"); console.log(carman.name); //undefined console.log(carman.getName()); //People‘s name is zyc |
Js代码
不好的地方就是:初级程度代码不是很让人理解
转载自: 作者“zhangyaochun”
原文:http://www.cnblogs.com/yahue/p/3631994.html