在一个项目中大量使用js,工程项目与网站开发有一些不一样,在我接触的工程项目中普遍使用js 不够多,大部分客户端可做事,交给了服务端,而且在使用js时不够规范,很容易造成代码难以阅读、内存泄漏问题,不注意js 输写方式。而在网站开发中(尤其一些大网站,js输出的非常漂亮、完美无论使用jquery,还是prototype 框架,还是不用框架,都有自己良好一套东东可用)
js输写最好还是可以面向对象方式 用类方向进行包装 js输写两种方式 闭包 原型
闭包:(借用的一个例子)
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1
//
定义构造函数
2 function Person(name)
3 {
4 this .name = name; // 在构造函数中定义成员
5 };
6
7 // 方法定义到构造函数的prototype上
8 Person.prototype.SayHello = function ()
9 {
10 alert( " Hello, I'm " + this .name);
11 };
12
13 // 子类构造函数
14 function Employee(name, salary)
15 {
16 Person.call( this , name); // 调用上层构造函数
17 this .salary = salary; // 扩展的成员
18 };
19
20 // 子类构造函数首先需要用上层构造函数来建立prototype对象,实现继承的概念
21 Employee.prototype = new Person() // 只需要其prototype的方法,此对象的成员没有任何意义!
22
23 // 子类方法也定义到构造函数之上
24 Employee.prototype.ShowMeTheMoney = function ()
25 {
26 alert( this .name + " $ " + this .salary);
27 };
28
29 var BillGates = new Person( " Bill Gates " );
30 BillGates.SayHello();
31
32 var SteveJobs = new Employee( " Steve Jobs " , 1234 );
33 SteveJobs.SayHello();
34
2 function Person(name)
3 {
4 this .name = name; // 在构造函数中定义成员
5 };
6
7 // 方法定义到构造函数的prototype上
8 Person.prototype.SayHello = function ()
9 {
10 alert( " Hello, I'm " + this .name);
11 };
12
13 // 子类构造函数
14 function Employee(name, salary)
15 {
16 Person.call( this , name); // 调用上层构造函数
17 this .salary = salary; // 扩展的成员
18 };
19
20 // 子类构造函数首先需要用上层构造函数来建立prototype对象,实现继承的概念
21 Employee.prototype = new Person() // 只需要其prototype的方法,此对象的成员没有任何意义!
22
23 // 子类方法也定义到构造函数之上
24 Employee.prototype.ShowMeTheMoney = function ()
25 {
26 alert( this .name + " $ " + this .salary);
27 };
28
29 var BillGates = new Person( " Bill Gates " );
30 BillGates.SayHello();
31
32 var SteveJobs = new Employee( " Steve Jobs " , 1234 );
33 SteveJobs.SayHello();
34
原型:(借用的一个例子)
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1
function
Person(firstName, lastName, age)
2 {
3 // 私有变量:
4 var _firstName = firstName;
5 var _lastName = lastName;
6
7 // 公共变量:
8 this .age = age;
9
10 // 方法:
11 this .getName = function ()
12 {
13 return (firstName + " " + lastName);
14 };
15 this .SayHello = function ()
16 {
17 alert( " Hello, I'm " + firstName + " " + lastName);
18 };
19 };
20
21 var BillGates = new Person( " Bill " , " Gates " , 53 );
22
2 {
3 // 私有变量:
4 var _firstName = firstName;
5 var _lastName = lastName;
6
7 // 公共变量:
8 this .age = age;
9
10 // 方法:
11 this .getName = function ()
12 {
13 return (firstName + " " + lastName);
14 };
15 this .SayHello = function ()
16 {
17 alert( " Hello, I'm " + firstName + " " + lastName);
18 };
19 };
20
21 var BillGates = new Person( " Bill " , " Gates " , 53 );
22
这两种方法各有优缺点,第一种看起来更像一个类 每个对象设置一份方法有很大浪费,而且资源回收不利,第二种方法,看起来不是很漂亮,可性能很好(不过如果你使用prototype框架,就可以完美解决结构与性能问题了。)
实际在使用jquery 还是prototype问题上,我的一点点体会是 jquery使用闭包方式,而prototype当然原型,jquery更加适合对单个对象操作,而prototype更适合做一些客户端控件。实际我更喜欢在项目中使用jquery 而网站上更关注prototype