js函数

1. 函数创建

• 函数声明
• 函数表达式
  • 命名函数表达式

  var func = function nfe(){};
  alert(func === nfe);
  //递归调用
  var func = function nfe(){nfe();}
  

• Function构造器

var func = new Function('a','b','console.log(a+b);');
func(1,2);//3

var func = Function('a','b','console.log(a+b));');
func(1,2); //3

2. this

• 全局this(浏览器)

console.log(this.document === document); //true
console.log(this === window); //true
this.a = 37;
console.log(window.a);//37

• 一般函数的this(浏览器)

function f1(){
    return this;
}
f1() === window; //true,global object

function f2(){
    "use strict"; //see strict mode
    return this;
}
f2() === undefined; //truw

• 作为对象方法的函数的this

var o = {
    prop:37,
    f:function(){
        return this.prop;
    }
};
console.log(o.f()); //logs 37

var o = {prop:37};
function independent(){
    return this.prop;
}
o.f = independent;
console.log(o.f()); //logs 37

• 对象原型链上的this

var o = {f:function(){return this.a+this.b;}};
var p = Object.create(o);
p.a = 1;
p.b = 4;
console.log(p.f()); //5

• get/set方法与this

function modules(){
    return Math.sqrt(this.re * this.re + this.im * this.im);
}
var o = {
    re:1,
    im:-1,
    get phase(){
        return Math.atan(this.im,this.re);
    }
};
Object.defineProperty(o,'modulus',{
    get:modulus,enumerable:true,configurable:true});
 
console.log(o.phase,o.modulus); //logs-0.78 1.4142

• 构造器中的this 有return 就返回return，否则返回this

function MyClass(){
    this.a = 37;
}
var o = new MyClass();
console.log(o.a); //37

function C2(){
    this.a = 37;
    return {a:38};
}
o = new C2();
console.log(o.a);

• call/apply方法与this

function add(c,d){
    return this.a + this.b + c +d;
}
var o = {a:1,b:3};
add.call(o,5,7); //1+3+5+7=16
add.apply(o,[10,20]); //1+3+10+20=34

function bar(){
    console.log(Object.prototype.toString.call(this));
}
bar.call(7); //"[object Number]"

• bind方法与this --ie9+才有

function f(){
    return this.a;
}
var a = f.bind({a:"test"});
console.log(g()); //test

var o = {a:37,f:f,g:g};
console.log(o.f(),o.g()); //37,test

3. 函数属性&arguments

function foo(x,y,z){
    arguments.length; //2
    arguments[0]; //1
    arguments[0] = 10; //10    严格模式下不改变
    x; //change to 10
    
    arguments[2] = 100;
    z; //still undefined!
    arguments.callee === foo; //true
}

foo{1,2};
foo.length; //3       形参个数
foo.name; //"foo"       函数名
arguments.length; //    实参个数

4. apply/call方法(浏览器)

function foo(x,y){
    console.log(x,y,this);
}
foo.call(100,1,2); //1,2,Number(100)
foo.apply(true,[3,4]); //3,4,Boolean(true)
foo.apply(null); //undefined,undefined,window
foo.apply(undfined); //undefined,undefined,window

5. bind方法 --ie9及以上

this.x = 9;
var module = {
    x:81,
    getX:function(){return this.x;}
};

module.getX(); //81

var getX = module.getX;
getX(); //9

var boundGetX = getX.bind(module);
boundGetX(); //81

6. bind与currying 函数科里化

function add(a,b,c){
    return a+b+c;
}
var func = add.bind(undefined,100);
func(1,2); //3
var func2 = func.bind(undefined,200);
func2(10); //310

function getConfig(colors,size,otherOptions){
    console.log(colors,size,otherOptions);
}
var defaultConfig = getConfig.bind(null,"#CC0000","1024*768");

defaultConfig("123"); //#CC0000 1024*768 123
defaultConfig("456"); //#CC0000 1024*768 456

7. bind与new

function foo(){
    this.b = 100;
    return this.a;
}

var func = foo.bind({a:1});

func(); //1
new func(); //{b:100}

8. 闭包

functon outer(){
    var localVal = 30;
    return localVal;
}
outer(); //30

function outer(){
    var localVal = 30;
    return function (){
        return localVal;
    }
}

var func = outer();
func(); //30

注：循环闭包

闭包： 闭包优缺点:

9. 作用域（全局 函数 eval ） 无块级作用域

var a = 10;
(function(){
    var b = 20;
})();
console.log(a); //10
console.log(b); //error,b in not defined

for(var item in {a:1,b:2}){
    console.log(item);
}
console.log(item);   //item still in scope

eval("var a = 1;"); eval

--作用域链--

function outer2(){
    var local2 = 1;
    function outer1(){
        var local1 = 1; //visit local1,local2 or global3 
    }
    outer1();
}

var global3 = 1;
outer2();

function outer(){
    var i = 1; 
    var func = new Function("console.log(typeof i);");
    func(); //undefined
   outer();
}

--利用函数作用域封装--

(function(){
    //do sth here
    var a,b;
})();

!function(){
    //dosth here
    var a,b;
}();