单例模式

之后将使用单例模式来书写JS代码,单例模式确保在变量中只有一个类,同时在闭包中执行防止对全局的变量污染。

举个例子,我们生命了连个相同的变量名,这样就会发生之间有一个不好使的情况,当然现在有了 let 和 const 来规避。

var sum = 10;

function sum(a,b){
    return a + b
}

另一个情况,使用单例模式将使我们的代码更有逻辑性,及更方便拆分很调用。

jQuery 加载后执行

在DOM加载完成之后执行,是 window.ready 事件的简写。

$(function(){
    console.log('all DOM is ready');
})

函数的声明和调用

// 函数声明
function fun1(){
    console.log('fun1')
}
fun1();

// 变量声明,把匿名函数赋予到变量中
let fun2 = function(){
    console.log('fun2')
}
fun2();

// 变量声明,把匿名函数赋予到对象的属性值中
let utils = {
    fun3:function(){
        console.log('fun3')
    }
}
utils.fun3();

简单的单例子模式讲解

$(function(){
    
    const pageIndex = {
        init:function(){
            this.bind();
        },
        bind:function(){
            $('.ele').on('click',this.doingSomething);
        },
        doingSomething:function(){
            console.log('doingSomething!')
        }
    }

    pageIndex.init();
})
  1. 在 jQuery 监听DOM加载完毕执行的毁掉函数中,声明了 pageIndex 对象。

  2. 把函数赋予到 pageIndex 对象的属性值里面。

  3. 调用 pageIndex 里面的 init 的方法

  4. pageIndex.init 里的 this 指向 pageIndex 本身,调用其 bind 的方法。

  5. pageIndex.bind 里执行元素的绑定事件,绑定 ele 元素在点击时候触发 doingSomething 事件

  6. 我们点击 ele 元素时候,就会触发 pageIndex.doingSomethin 函数,在控制台打印出 doingSomething