开发中比较容易理解的代码套路

Posted 2020-11-27 1994july

前言

今天给大家纯手工整理一下本人在开发中认为比较有用的代码思想套路，欢迎大家可以与我一同讨论

链式编程

所谓链式编程即是函数调用后返回对象本身

var calculator = {
    total:0,
    add (n) {
        // 模拟执行功能
		this.total += n;
        // 为了能在调用完add()后继续.substruct() 因此我们返回对象本身
        return this;
    },
    subtract(n) {
        this.total -= n;
        return this;
    }
}
// 调用
calculator.add(5).add(5).subtract(2).total; // 8

高阶函数应用-(添加数据并提供删除方法)

举个栗子：我们有一些业务需要添加元素到数组中，但同时也可能过会又要将其移除。更好的方式是我们把他们封装成函数，并利用高阶函数闭包的特性来标记删除，这样就减少了去查找这个元素的问题了

var students = [];
function addStudent (stu) {
    // 加入  通过形参标记该学员
    students.push(stu);
    return function () { 
        // 利用闭包获取stu
        var index = students.indexOf(stu);
        // 删除该学生
        students.splice(index);
    }
}
var stu = { name:‘小明‘ };
// 试用一下
var stu1 = addStudent(stu);
var stu2 = addStudent({name:‘小红‘});
// 一年想到需要删除了，我们不需要查找他们了
stu1(); // 删除小明
stu2(); // 删除小红

利用Promise链切入（延迟执行）

Promise不仅可以帮助做异步流程控制，同时啥步流程控制也能做，当然更重要是延迟执行和异步中保证顺序，比如步骤A到步骤B，中间我们要等等，也步确定啥时候完成，因此可以先定义好两个步骤，把A步骤的resolve保存起来等待需要调用的时候调用即可（不要试图和回调函数去比较，因为Promise本身就是为了解决回调函数不优雅的问题）

// 任务A
function task1() {
    setTimeout(function(){
		// 第一件事
    },2000);
}
function task2() {
    setTimeout(function(){
		// 第二件事
    },1000);
}
// 我先让第一件事执行，并保存其实例和resolve
var token = (function(){
    var next;
    var p = new Promise(function(resolve){
        // 获取放行的钥匙
        next = resolve;
		task1();
    });
	return {
        promise:p,
        next:next
    }
})();
// 定义第二件事
token.promise.then(task2);
// 想让第二件事执行的话，看我心情咯，来个定时器吧
setTimeout(function () {
    // 就现在吧，做第二件事吧（延迟执行）
    token.next();
},Math.random() * 1000 );

通过中间层来解决问题（装饰者模式）

不是有句话是JS中任何问题都可以通过中间层来解决，比如我们写了一个吃饭的功能，突然想起来饭前要洗手，那么怎么做呢？用你想想的中间层来对比我写的中间层，想想看有什么不同？！

var obj = {
    eat:function () {
		console.log(‘我愉快的吃饭..‘);
    }
}
obj.wash = function () {
    console.log(‘洗手‘);
}
// 装饰者模式
obj.plus = function (fn1,fn2) {
    fn1();
    return fn2(); 
}
// 突然学习到《《《饭前要洗手》》》，怎么办？
obj.plus(obj.wash,obj.eat);

单例模式

有时我们需要全局中有一个唯一的实例，而不是new一次就一个的时候，就用下面代码吧，不过细节要注意以下

var Leader = (function() {
    var instance; // 闭包不让外部访问
    return function (name) {// 构造函数
         if (instance) return instance;
         instance = this;
         this.name = name;
    }
})();

new Leader(‘凃老师‘); // { name:‘凃老师‘}
new Leader(‘启道学院‘); // { name:‘凃老师‘}
来源：站长平台