function Person(employeeId, fname, lname, tel, fax, email, email2, dob) {
};
This class is very fragile. If you want to add a middle name parameter once you've released the code, you're going to have to do it at the very end of the list since order matters. That makes it awkward to work with. It also makes it difficult to work with if you don't have values for each parameter. For example:
复制代码 代码如下:
var ara = new Person(1234, "Ara", "Pehlivanian", "514-555-1234", null, null, null, "1976-05-17");
A cleaner, more flexible way of approaching parameter lists is to use this pattern:
复制代码 代码如下:
function Person(employeeId, data) {
};
The first parameter is there because it's required. The rest is lumped together in an object which can be very flexible to work with.
复制代码 代码如下:
var ara = new Person(1234, {
fname: "Ara",
lname: "Pehlivanian",
tel: "514-555-1234",
dob: "1976-05-17"
});
The beauty of this pattern is that it's both easy to read and highly flexible. Note how fax, email and email2 were completely left out. Also, since objects aren't order specific, adding a middle name parameter is as easy as throwing it in wherever it's convenient:
复制代码 代码如下:
var ara = new Person(1234, {
fname: "Ara",
mname: "Chris",
lname: "Pehlivanian",
tel: "514-555-1234",
dob: "1976-05-17"
});
The code inside the class doesn't care because the values get accessed by index like so:
复制代码 代码如下:
function Person(employeeId, data) {
this.fname = data['fname'];
};
If data['fname'] returns a value, it gets set. Otherwise, it doesn't, and nothing breaks.
Make It Pluggable
As time goes on, product requirements might demand additional behavior from your classes. Yet often times that behavior has absolutely nothing to do with your class's core functionality. It's also likely that it's a requirement for only one implementation of the class, like fading in the contents of one tab's panel while fetching external data for another. You may be tempted to put those abilities inside your class, but they don't belong there. A tab strip's responsibility is to manage tabs. Animation and data fetching are two completely separate things and should be kept outside the tab strip's code. The only way to future proof your tab strip and keep all that extra functionality external, is to allow people to plug behaviors into your code. In other words, allow people to hook into key moments in your code by creating events like onTabChange, afterTabChange, onShowPanel, afterShowPanel and so on. That way, they can easily hook into your onShowPanel event, write a handler that fades in the contents of that panel and everyone is happy. JavaScript libraries allow you to do this easily enough, but it's not too hard to work it out on your own. Here's a simple example using YUI 3.
复制代码 代码如下:
<script type="text/javascript" src="http://yui.yahooapis.com/combo?3.2.0/build/yui/yui-min.js"></script>
<script type="text/javascript">
YUI().use('event', function (Y) {
function TabStrip() {
this.showPanel = function () {
this.fire('onShowPanel');
// Code to show the panel
this.fire('afterShowPanel');
};
};
// Give TabStrip the ability to fire custom events
Y.augment(TabStrip, Y.EventTarget);
var ts = new TabStrip();
// Set up custom event handlers for this instance of TabStrip
ts.on('onShowPanel', function () {
//Do something before showing panel
});
ts.on('onShowPanel', function () {
//Do something else before showing panel
});
ts.on('afterShowPanel', function () {
//Do something after showing panel
});
ts.showPanel();
});
</script>
This example has a simple TabStrip class with a showPanel method. The method fires two events, onShowPanel and afterShowPanel. It's given the ability to do so by augmenting the class with Y.EventTarget. Once that's done, we instantiate a TabStrip object and assign a bunch of event handlers to it. This is our custom code for handling this instance's unique behavior without messing with the actual class.
Summary
If you plan on reusing code either on the same page, website or across multiple projects, consider packaging and organizing it in classes. Object-oriented JavaScript lends itself naturally to better code organization and reuse. What's more, with a little forethought, you can make sure that your code is flexible enough to stay in use long after you've written it. Writing reusable, future-proof JavaScript will save you, your team and your company time and money. That's sure to make you popular.
这本书比较适合有一定javascipt代码基础，但是需要提高代码规范性的开发人员看
个人的收获：
1.书写代码 的规范性
@书写要合理缩进
@行太长时，要记得换行，并注意下一行缩进
@空行，对每一个逻辑分支，以模块进行注释
@变量的命名以驼峰形式，统一 规范命名
@===与==的用法要注意，能用===时一定不要用==，异步的我们要与开发确认好数据的类型
@双括号要有适当空格，提高阅读性
@ switch case要用缩进一下，并用break结束
2.css与html，js分离
在html里最好不要内联，要使用外联形式，display内联是可以使用的
标签里不要内联事件，做好JS事件和标签分离
在脚本里面用css，最好用classname.不要直接写一些样式。做好css和js的分离
3.try catch
捕获错误，好处可以看到哪个地方出现了问题，能及时发现，减少调试的时间，要充分利用组件中的报错机制
4.配置文件config的新建和分离
配置一些常量及值，或者是一些message文本信息
您可能感兴趣的文章: