【javascript】随手记代码

//js实现的当前界面的刷新、前进、后退

<input type="button" value="刷新" onclick="window.location.reload()">

<input type="button" value="前进" onclick="window.history.go(1)">

<input type="button" value="后退" onclick="window.history.go(-1)">

<input type="button" value="前进" onclick="window.history.forward()">

<input type="button" value="后退" onclick="window.history.back()">

 

 

console.log Firefox最先提出的，后来被各个浏览器采用；即在控制台输出日志，不会像alert一样打断程序进程，适合用于与Firebug或者是其他的开发者工具配合进行调试

 

//全局变量

function sum1(x,y){
   result = x+ y;
   return result;  
}
/*上面这个函数中,result没有用var进行声明，实际上result变成了隐式的全局变量，result在其他函数中也可以访问；若写成var result其生存期就仅在函数内部，所以因为在一个项目中引用的js文件过多、很多地方使用到简单易用的全局变量，所以为了使自己引用的变量不被挂掉，尽量减少使用全局变量*/

 function temp(){
　　var a= b =0;
　　var c,d;
}
/*同样进行链式声明的时候也应该注意全局变量，
　上面这句中a是本地变量，b就是全局变量;c,d均为局部变量(前提是这个函数被调用一次后，要不变量压根不被声明出来)*/

/*全局变量可以通过delete来删除*/
var a=0;
delete(a);
/*删除成功的话会返回true,不成功返回false
  继续测试一下，是否删除    
*/
console.log ( typeof(a) );
/*如果删除成功的话，可以知道这个是输出undefined,没删出成功会输出正常的值number
 用var声明的显示全局变量没办法delete，但是隐式的局部变量都可以delete    
*/

 

js置顶解析：

所有函数内部新定义 var 的变量都会置顶解析，也算是一种预解析

 所以全局变量可能在函数内部受影响，尽量避免函数内部使用全局变量的变量名称

myname = "global"; // 全局变量
function func() {
    alert(myname); 
    var myname = "local";
    alert(myname); // 
}
func();

//最后结果是：第一个alert的是undefined,第二个alert的是myname

 

 

----------

window.onload()  和 $(document).ready(){}的区别：

1.window.onload是在等待界面内元素加载完毕前执行的函数，可以用于制作等待加载的遮罩效果

   $(document).ready()并不是针对于界面内所有元素，而是针对于Dom对象，就是当浏览器经过渲染之后生成DomTree之前会执行。而图片、声音等不包括在内。所以适合做一些动画特效或者是css控制。

2. window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个 
   $(document).ready()可以同时编写多个，并且都可以得到执行。

 

3.$(document).ready()可以简写成$(function(){});

　在zepto中$被定义成了function,function直接调用了Init方法，Init方法中对$("参数")中的参数进行判断，其中一条就是若参数类型也为function的话，直接令其在文档加载后执行，

也就是类似的$(function(){我是函数})中，直接就把里面的function置于文档加载后即$(document).ready执行。　　

 

4.jquery中live方法能够为未来的元素绑定事件，即可以绑定所有后dom写入的元素

而bind只对当前文档内已有元素进行绑定，

.one方法是绑定后只能执行一次，若执行过后则自动取消绑定。

 

5.js获取某元素的属性值：

　　1.document.getElementbyId("input1").getAttributes("name")　　　　//type,classname,alt,title,id   没有该属性直接返回""，不报错

　　2.document.getElementbyId("input1").name                                   //.type,.classname,.alt,.titlke  用什么点什么。

6.js插件形式

(function($){
    $.fn.temp = function(){
        //添加ele元素事件        this指向当前元素
    }
})(jQuery);
(function($){
    $.fn.temp = function(options){
        //插件设置参数，可直接使用默认参数  
        var defaults = {    
            bgcolor:"red",
            height:300,
            width:400    
          };    
        var opts = $.extend(defaults, options); 

})(jQuery);
//面向元素标签的插件调用方法： $("#ele").temp();

7.同一页面下多jQuery库共存（不推荐这么做，应该就插件本身做更新，而不应该将就着加载两个库）

　　$.noConflict函数，jQuery内部实现的共存机制函数，也可以用作多库共存函数。

　　使用方法：

<script type="text/javascript" src="jquery.1.7.2.min.js"></script>
<script type="text/javascript">
    var jquery172 = $.noConflict(true);
</script>
<script type="text/javascript" src="jquery.1.9.0.min.js"></script>
<script type="text/javascript">
    var jquery190 = $.noConflict(true);
</script>
<script type="text/javascript">
    <!--具体使用方式-->
    (function($){
        //……函数代码……
    })(jquery172);
</script>

　　noConflict函数实现原理：jQuery在种子模块中保存了全局对象中$和jQuery的状态，noConflict函数中可以将已经赋值的$和jQuery再还原，并返回当前库所对应的jQuery对象。

　　

8. call&apply&bind

var obj = {
    name:"Lee",
    job:"f2e",
    sayHello:function(){
        console.log("Hello,I'm "+this.name+",my job is "+this.job);
    }
}
var t = {name:"T",job:"XXX"};

obj.sayHello();
obj.sayHello.call(t);
obj.sayHello.apply(t,{});
var anotherSayHello = obj.sayHello.bind(t);
//bind函数不会自动执行sayHello函数，而是返回新的经过包装的函数
anotherSayHello();

 

9.看Node.js总结的一些异步方式

（1）CPS后继传递风格

CPS是指通过在函数内部调用回调函数的方式来实现异步，也称为标准回调模式。

readFile等IO函数都是此风格的回调模式；

CPS属于程序的控制权转让，JS单线程通过转让线程控制权来实现异步回调

function A(data,cb){
　　// deal with data
　　cb(newdata);
}
function B(nd){
　　//cout B
　　console.log(nd);
}

//调用  先执行A函数，直至A执行完再执行其回调函数B 
A(10,B);

 

（2）事件发射器模式

Node.js里面称为事件发射器模式，前端库里面称为PUB-SUB模式，设计模式中称为观察者模式；

通过事件发射器发射事件，注册响应事件来处理该事件、执行响应函数；

Node.js中不是所有对象都可以发射事件，发射事件的对象必须集成events中的EventEmitter接口；继承方法直接调用inherits函数即可：

var util = require('util');
var EventEmitter = require('events').EventEmitter;

var Ani = function(){
     //  class init
}

util.inherits(Ani,EventEmitter);

注册事件之间不会覆盖，即如果先后声明过两次em.on('data',function1)和em.on('data',function2)，f1和f2都会执行

var em = new (require('event').EventEmitter)();

em.emit('change',123456);    //无任何输出

//注册事件响应函数
em.on('change',function(data){
   console.log('change to '+data); 
})

em.emit('change',654321);    //因已经注册了事件响应函数，显示输出

回调模式适合处理单次的异步，比如文件读取、数据库写入等；

事件发射器模式适合多次重复的事件响应，比如HTTP获取数据等。