02.JavaScript 面向对象精要--函数


在JavaScript中,函数其实也是对象。是函数不同于其他对象的特点是:
函数存在一个被称为[[Call]]的内部属性。[[Call]]属性是函数独有的,
表明该对象可以被执行。ECMAScript 定义了typeof操作符对具有[[Call]]
属性的对象返回 "function"。理解函数的行为是理解JavaScript的核心。

一.函数声明式和表达式
 1.1 函数声明
  以function开头后面跟着函数的名字

  function add(num1,num2){
       return num1 + num2;
  }


  JavaScript中能对函数声明进行提升,这是因为引擎提前知道了函数的
  名字。而函数表达式仅能通过变量引用,因此无法提升。

 1.2 函数表达式
  function开头后面不需要加上函数名,这种函数称为匿名函数,而是被
  一个变量引用。
  

var add = function(num1, num2){
       return num1 + num2;
  };


 1.3 函数声明和表达区别
 

 add(5,5);//返回10
  add2(10,10)//错误:add2 is not a function
  function add(num1,num2){
       return num1 + num2;
  }
  var add2 = function(num1,num2){
       return num1 + num2;
  };
  add2(5,5)//返回10;

 

 二.函数就是值
  函数是JavaScript的一大重点,你可以像对象一样使用函数。
  也可以将它们赋给变量,在对象中添加它们,将它们当成参数传递给
  别的函数,或从别的函数中返回。基本上只要时可以使用其它引用值
  的地方,就可以使用函数。
  

 1 function sayHi(){
 2    console.log("Hi!");
 3   }
 4   sayHi();//输出 "Hi!"
 5   var sayHi2 = sayHi;
 6   sayHi2();//输出 "Hi!"
 7   //使用构造函数实现:
 8   var sayHi = new Function("console.log(\"Hi!\");");
 9   sayHi();// "Hi!"
10   var sayHi2 = sayHi;
11   sayHi2();// "Hi!"
12   //把函数当成参数传递
13   var numbers = [1,5,8,4,7,10,2,6];
14   numbers.sort(function(first,second){
15        return first - second;
16   })
17   console.log(numbers); //"[1,2,4,5,6,7,8,10]"
18   numbers.sort();
19   console.log(numbers);// "[1,10,2,3,4,5,7,8]"

 

 三.函数参数
  JavaScript函数的另一个独特之处在于你可以给函数传递
  任意数量的参数却不造成错误。那是因为函数参数实际上被保存在
  一个 类数组arguments的对象中。arguments的length属性会告诉
  你目前有多少个值。Array.isArray(arguments)永远返回false。
  函数也是对象,所以也有属性,lenght属性返回函数 期望参数
  个数。

  3.1 arguments对象
  

 1  function reflect(val){
 2     return val;
 3    }
 4    console.log(reflect("Hi!")); // "Hi!"
 5    console.log(reflect("Hi!",25)); // "Hi!"
 6    console.log(reflect.length); // "1"
 7 
 8    reflect = function(){
 9     return arguments[0];
10    }
11    console.log(reflect("Hi!")); // "Hi!"
12    console.log(reflect("Hi!",25)); // "Hi!"
13    console.log(reflect.length); // "0"

 

  3.2 重载
   JavaScript没有重载,但可以模拟重载。
   利用传入的参数个数arguments.length来判断执行函数体。
   

function sayHi(msg){
    if(argrments.length === 0){
     msg = "default msg";
    }else{
     console.log(msg);
    }
}
   sayHi('hello');// 输出 "hello"

 

 四.对象方法
  如果一个对象的属性是函数,则该函数被称为方法。
  

var person = {
   name : 'Nicholas',
   sayNmae : function(){
    console.log(person.name);
   }
}

 

  4.1 this对熊
   JavaScript 所有函数作用域内都有一个this对象代表调用
   该函数的对象。在全局作用域中this代表全局对象(window).
   当一个函数作为对象的方法被调用时,默认this的值等于那个
   对象。
   

function say(){
    console.log(this.name);
}
   var person1 = {
    name : 'Nicholas',
    sayNmae : say
   }
   var person2 = {
    name : 'Greg',
    syaName : say
   }
   person1.sayName(); // "Nicholas"
   person2.sayName(); // "Greg"

 

  4.2 改变this (call(),apply(),bind())
   有3种函数方法允许你改变this的值。记住:函数也是对象
   所以函数也有方法。

   4.2.1 call(this的值,'参数1','参数2')方法 
    

    function say(label){
         console.log(label + ":"+this.name);
    }
    var person1 = {
     name : 'Nicholas'
    };
    var person2 = {
     name : 'Greg'
    };
    var name = 'Micheel';
    say.call(this,'global'); //输出 "global:Micheel"
    say.call(person1,'person1');//输出 "person1 : Micholas"
    say.call(person2,'person2');//输出 "person12 : Greg"

 

   4.2.2 apply(this的值,['参数1','参数2'])方法
    

    say.apply(this,['global']); //输出 "global:Micheel"
    say.apply(person1,['person1']);//输出 "person1 : Micholas"
    say.apply(person2,['person2']);//输出 "person12 : Greg"

 

   4.2.3 bind()方法
    

    var say1 = say.bind(person1);
    say1("person1"); //输出 "person1 : Micholas"
    var say2 = say.bind(person2,"person2");
    say2(); // 输出 "person12 : Greg"

 


    

 

posted @ 2016-09-10 16:26  ShareGoodCode  阅读(212)  评论(0编辑  收藏  举报