JS设计原则 —— 开闭原则
扩展性是衡量代码质量最重要的标准之一，代码的扩展性好了，出bug的几率就小很多。在经典的设计模式中，大部分设计模式都是为了解决代码的扩展性而存在的，主要遵从的原则就是开闭原则，所以理解开闭原则并能灵活应用很重要。
如何理解开闭原则
英文全称：Open Closed Principle（OCP）。开闭原则是对什么开放又是对什么关闭呢？是对扩展开放，对修改关闭。详细描述一下就是：添加一个新的功能时，应该在已有代码的基础上扩展代码（新增模块、类、方法等），而非修改已有代码（修改模块、类、方法等）。
这条原则的意义是什么呢？对扩展开放是为了应对需求变化，对修改关闭是为了保证原有代码的稳定性。在识别出代码可变部分和不可变部分之后，要将可变部分封装起来，隔离变化，提供抽象化的不可变接口，给上层使用。
我们来看一个栗子，理解一下这个原则。
我们在登陆一个系统的时候，都会输入用户名和密码然后点击登陆。在正式登陆之前，都会对输入的用户名和密码做校验，看是否符合规则，比如：
function checkLogin() {
const username = document.querySelector('#username').value;
if (!username) {
// ...
} else {
// ...
}
const pwd = document.querySelector('#pwd').value;
if (!pwd){
// ...
} else {
// ...
}
}
我们只提取了主要的业务逻辑check函数，里面对两个字段做了规则校验。
现在我们需要增加一个在登陆前输入验证码的功能。该如何改动代码呢？在这里就是在checkLogin函数中再增加一段对验证码做校验的代码。
function checkLogin() {
const username = document.querySelector('#username').value;
if (!username) {
// ...
} else {
// ...
}
const pwd = document.querySelector('#pwd').value;
if (!pwd){
// ...
} else {
// ...
}
const captcha = document.querySelector('#captcha').value;
if (!captcha) {
// ...
} else {
// ...
}
}
这样实现的问题是什么呢？一方面，如果验证规则很多，那这段代码就会很长很复杂，降低了可读性和可维护性。再者，如果有对应的单元测试，那每次修改单元测试也要修改。
上面的代码是基于“修改”的方式来实现新功能的，因为新功能的实现是在原有的方法中进行了修改，而非新增模块、类、方法等。那如何通过扩展的方式实现上面的功能呢？
class Verification {
private verifiedHandlers: VerifiedHandler[] = [];
public addVerifiedHandler(handler: VerifiedHandler) {
this.verifiedHandlers.push(handler)
}
public checkAll() {
for (let i = 0; i < this.verifiedHandlers.length; i++) {
this.verifiedHandlers[i].check();
}
}
}
interface VerifiedHandler {
check(): void;
}
class UsernameVerifiedHandler implements VerifiedHandler {
public check() {
console.log('username');
}
}
class PwdVerifiedHandler implements VerifiedHandler {
public check() {
console.log('pwd');
}
}
class CaptchaVerifiedHandler implements VerifiedHandler {
public check() {
console.log('captcha');
}
}
在上面的实现中，定义接口VerifiedHandler，里面包含一个check方法，将对各个字段的校验移到每个handler中，并实现接口VerifiedHandler。
定义Verification类，暴露出addVerifiedHandler方法，以便添加不同的handler，并定义checkAll方法，调用所有handler的check方法。
各个handler已经定义好了，具体该如何使用呢？
class ApplyVerification {
private verification: Verification = new Verification();
private static instance: ApplyVerification;
private constructor() {
this.init();
}
public init() {
this.verification.addVerifiedHandler(new UsernameVerifiedHandler());
this.verification.addVerifiedHandler(new PwdVerifiedHandler());
this.verification.addVerifiedHandler(new CaptchaVerifiedHandler());
}
public getVerification() {
return this.verification;
}
public static getInstance() {
if (!ApplyVerification.instance) {
ApplyVerification.instance = new ApplyVerification();
}
return ApplyVerification.instance;
}
}
function checkLogin() {
ApplyVerification.getInstance().getVerification().checkAll();
}
ApplyVerification是一个单例类，创建Verification并添加不同的handler。
现在的代码再想添加新的校验逻辑只需要创建新的handler即可，最容易变化的部分是基于扩展的方式添加新功能而非修改原有代码。
如果觉得上述实现方式太过复杂，把不同的校验逻辑封装到不同的方法中也是可以的。
有时候，代码的可扩展性跟可读性不能两者兼顾，要做一些权衡和取舍。在if判断不是很多的时候，写在一起也没有太大问题，当if判断很多很复杂的时候，自然要选用可扩展性更好的方式。
如何做到“对扩展开放、对修改关闭”
最常用来提高代码扩展性的方法有：多态、基于接口而非实现编程、依赖注入，以及大部分设计模式（比如：装饰、策略、模板、职责链、状态等）。
最重要的是要时刻具备扩展意识、抽象意识、封装意识。写代码的时候多向前思考，可能会有哪些需求变更。不过也经常会有考虑不全的情况，只能通过不断重构来保持代码的可扩展性。
发表评论 (审核通过后显示评论)：