JavaScript模式 读书笔记三

第四章函数

函数的提升

//反模式
//仅用于掩饰

//全局函数
function foo(){
  alert("global foo");
}
function bar(){
  alert("global bar");
}

function hoisMe(){
  console.log(typeof foo); //输出function
  console.log(typeof bar); //输出undefined
  foo();  //输出local foo
  bar();  //输出　TypeError: bar is not a function

  //函数声明
  //变量　foo以其实现者被提升
  function foo(){
    alert("local foo");
  }

  //函数表达式
  //仅变量 bar被提升
  //函数实现并未被提升
  var bar=function(){
     alert("local bar");
  }


}

hoisMe();

回调示例

//重构findNodes()以接受一个回调函数
var findNodes=function(callback){
  var i=100000,
  nodes=[],
  found;

  if(typeof callback!=="function"){
    callback=false;
  }

  while(i){
    i-=1;
    // 这里是复杂的逻辑...

    //现在进行回调函数
    if(callback){
      callback(found);
    }

    nodes.push(found);

  }
  return nodes;
}

//回调函数
var hide=function(node){
  node.style.display="none";

}
//找到制定节点，并在后续执行中将其隐藏起来
findNodes(hide);

//传递一个匿名回调函数
findNodes(function(node){
  node.style.display="block";
});

回调与作用域

//重构findNodes()以接受一个回调函数
var findNodes=function(callback,callback_obj){
  var i=100000,
  nodes=[],
  found;



  while(i){
    i-=1;
    // 这里是复杂的逻辑...

    //现在进行回调函数
    if(typeof callback==="string"){
      callback=callback_obj[callback];
    }
    if(typeof callback==="function"){
       callback.call(callback_obj,found);
    }

    nodes.push(found);

  }
  return nodes;
}

//回调函数
var myapp={};
myapp.color="green";
myapp.paint=function(node){
  node.style.color=this.color;
};
//找到制定节点，并在后续执行中将其隐藏起来
findNodes(myapp.paint,myapp);

返回函数

var setup=function(){
  alert(1);
  return function(){
    alert(2);
  }
}

//使用setup函数
var my=setup(); //alert1
my(); //alert 2

var setup=function(){
  var count=0;
  return function(){
     return (count+=1);
  }
}

//用法
var next=setup();
next(); //返回1
next(); //返回2
next(); //返回3

自定义函数

惰性函数定义 lazy function definition

var scareMe=function(){
  alert("Boo!");
  scareMe=function(){
    alert("Double boo!");
  }
};

//使用自定义函数
scareMe(); //输出Boo！
scareMe(); //输出Double boo!

var scareMe=function(){
  alert("Boo!");
  scareMe=function(){
    alert("Double boo!");
  }
};

//1 .添加一个新的属性
scareMe.property="properly";

//2. 复制给另一个不同名称的变量
var prank=scareMe;

//3. 作为一个方法使用
var spooky={
  boo:scareMe
};

//calling with a new name
prank(); //输出 Boo!
prank(); //输出 Boo!
 console.log(prank.property); //输出properly

 //作为一个方法来调用
 spooky.boo(); //输出Boo!
 spooky.boo(); //输出Boo!
 console.log(spooky.boo.property); // 输出　 properly

 //使用自定义函数
 scareMe(); //输出 Double boo!
 scareMe(); //输出 Double boo!
console.log(scareMe.property); //undefined