JavaScript入门小知识点

1、console.log()

这个函数相比alert和断点不会打断函数的执行，是一个类似printf的操作

2、继承(prototype法)

var person={
    name:"yida",
    age:12,
    eat:function(){
        alert("haha");
    }
}

//使用函数构造器生成对象
function person(){
    
}
person.prototype={
    name:"yida",
    age:12;
    eat:function(){
        alert("eat");
    }
}

var p=new person();

3、作用域和闭包

```
//Uncaught ReferenceError: j is not defined
//
//JS是函数界别作用于，在内部变量可以访问外部，
//外部不能访问内部的
test();
//test()执行的时候 j还是undefined
var j=1000;

function test(){
    if(false){
        var i=10;
    }
    else{
        var t=100;
    }
    console.log(j);
}
```

//闭包 就是拿到原本自己不能拿到的东西
```

var j=100;

function test(){
    var j;
    j=10;
    var k=100;
    return function() {
        return k;
    }
}

var t=test()();
alert(t)
```

4、句柄

//此所谓添加句柄
document.getElementById("btn").addEventListener("click",function(){
        alert("haha");
    })

var x=document.getElementById("btn");
x.addEventListener("click",hello);//添加句柄

x.removeEventListener("click",hello);//删除句柄
function hello(){
}

5、单例模式

单例就是保证一个类只有一个实例，实现的方法是判断是否存在，如果不存在就创建了再返回，保证一个类只有一个。

 

单例模式作用：

1,模块之间通信

2，系统中某个类的对象只能存在一个

3，保护自己的属性和方法

 

注意：

1.注意this的使用

2.闭包容易造成内存泄露

var xiaowang=(function(argument){
    var xiaowangjia= function (message) {
        this.menling=message;
    }
    var door;

    var info={
        sendMessage:function(message){
            if(!door){
                door=new xiaowangjia(message);
            }
            return door;
        }
    }

    return info;
})();

//这种方法是静态的
var xiaoli={
    call:function(msg){
        var _xw=xiaowang.sendMessage(msg);
        alert(_xw.menling);
        _xw=null;//等待垃圾回收
    }
};

xiaoli.call("haha");

//平时开发的时候单例怎么用呢

var top ={
    init:function(){
        this.render();
        this.bind();
    },
    a:4,
    render:function(){
        var me=this;
        me.btna=$("#a");
    },
    bind:function(){
        var me=this;
        me.btna.click(function(){
            //业务逻辑取出去
            me.test();
        })
    },
    test:function(){
        a=5;
    }
}

var banner={
    init:function(){
        this.render();
        this.bind();
    },
    a:4,
    render:function(){
        var me=this;
        me.btna=$("#d");
    },
    bind:function(){
        var me=this;
        me.btna.click(function(){
            //业务逻辑取出去
            me.test();
        })
    },
    test:function(){
        //a=6;
        top.a=6;
    }
}

top.init();
banner.init();

6、策略模式

策略模式定义了算法家族，分别封装起来，让他们之间可以相互替换，此模式让算法变化不会影响到使用算法的客户

 

模式作用：

1.所有的这些算法都是做相同的事情，只是实现不同

2.以相同的方法调用所有的方法，减少了各种算法类与使用算法类之间的耦合

3.单独定义算法类，方便了单元测试

 

注意事项：

不仅可以封装算法，也可以用来封装几乎任何类型的规则，在要在分析过程中需要在不同时间应用不同的业务规则，就可以考虑用策略模式来封装。

//-_-|| $开头的变量 用于区分 全局变量
var $input = $("#input").val();
var val={
    isEmpty: function () {
        return false;
    },
    isTel:function(){

        return true;
    }
}

var ise=val.isEmpty($input.val());
var isTel=val.isTel($input.val());

if(!ise && isTel){
    alert("通过审核")
}

//$.fn.val
$.input.val({
    isEmpty:false,
    isTel:true
});

$("#div").animate({width:100px},100);