JS干货--Function

函数的声明方式

  ------------------    1、采用new关键字  ------------------  var add = new Function('a, b','return a + b;');  好像没人会这么写，各种不爽。  -----------------    2、函数声明  -----------------  function add(a, b) {    return a + b;  }  -----------------    3、函数表达式  -----------------  var add = function(a, b) {    return a + b;  }  

函数声明提升(Function Hoisting)

  对于函数声明，函数名以及函数体会提前执行。  而对于函数表达式，感觉本质上还是当做变量处理，先把变量声明提前，执行代码所在的位置，才会把后面的函数赋值给这个变量。  console.log(add); //undefined  var add = function(a, b) {    return a + b;  }  console.log(add(1,2)); //3

回调函数(Callback)

  var name = 'global name'  var obj = {    name: 'obj name'  }  function action(obj, callback) {    //这里不要直接写callback(), 会导致后面的this指向window.    callback.call(obj);  }  function getName() {    console.log(this.name); // "obj name"  }  action(obj, getName);

函数可以作为返回值，闭包的产生(closure)，产生私有变量。

  //这个step就是个简单的闭包  function step() {    //count作为step的私有属性。    var count = 0;    return function() {      return count++;    }  }  var next = step();  console.log(next()); //1  console.log(next()); //2  console.log(next()); //3

动态定义函数

  利用动态定义函数的性质，我们可以定义一个只执行一次的函数。  function once() {    console.log('one');    once = function() {      console.log('two');    }  }  once(); // 'one'  once(); // 'two'  once(); // 'two'  看似这个函数满足我们的需求,但是它在原型链上有很大的问题，后面会应该会讲到这个问题。

立即执行函数(IIFE)

  这个应用的很广泛，很多第三库多是采用这种方式包裹自己的核心代码。可以去看看JQuery的源码。  立即执行函数的写法很多，我推荐还是用这种：(function(a){})(a);  常见的解决问题：(举一个栗子)  var i,      max;  for(i = 0,max = 5; i < max; i++) {    setTimeout(function() {      console.log(i);    },300);  }  这里会输出5个5，显然这不是我们的需求：  var i,      max;  for(i = 0,max = 5; i < max; i++) {    (function(i) {      setTimeout(function() {        console.log(i);      },300);    })(i);  }  这样才会输出0，1，2，3，4。

函数记忆功能

  var memery = function(a....) {    //得到唯一的标识    var hashkey = JSON.stringify(Array.prototype.slice.call(arguments));    //保存在hash表中。    if(!memery.cache[hashkey]) {      var result = 'cache function';      memery.cache[hashkey] = result;    }    return memery.cache[hashkey];  }  其实这里涉及到了函数式编程的相关知识，怎么才能使用上函数的记忆功能呢？  那么得要求开发者编写的函数为纯函数，这里的纯函数可能对函数式编程不了解的小伙伴一脸懵逼。  不要紧，大家自行百度或者Google。（^_^）.

柯里化(Currying)

  科里化也是函数式编程中的概念。（哎，学个前端什么多得了解了解，宝宝系里苦呀。）  很经典的一道面试题：sum(1)(2)(3)(4) 输出10  function sum(x) {    var result = x,        temp = function(y) {          result += y;          return temp;        };    //因为temp是个函数，我需要在计算和log的时候将它转化为数字或者字符串。    //toString和valueOf分别字符串输出和计算时会调用的方法。    temp.toString = temp.valueOf = function() {      return result;    }    return temp;  }  console.log(+sum(1)(2)(3)(4)); //10  是不是很神奇，推荐大家两个库学习学习，一个是Underscore.js，另一个是Ramda.js。  大家可以下载它们的源码看看，写的很精髓。  对于Currying，Underscore中是 _.partial  对于Ramda.js中，比较特殊，它是用一个curry的函数包裹其它的函数，有兴趣的小伙伴可以自己研究研究。