js函數的那些事(一)

Bamboy 發布于2019-08-21 10:50 / 2854人閱讀

摘要：不一定有函數名，所以有匿名函數表達式和命名函數表達式。引用的是函數據以執行的環境對象。匿名函數引用函數作用域內的活動變量時，已經等于了，所以每個函數返回的都是。

文章融合了《JavaScript高級程序設計》的知識，和這幾天在segmentfault上的文章的知識點。屬于整合類文章吧。

函數簡介

函數聲明和函數表達式

this和argument

閉包

函數簡介

函數實際上是對象，所以函數名實際上是指向函數對象的指針，那么一個函數可能有多個名字。

function sum(num1,num2){
    retrun num1+num2;
}
alert(sum(10,10));  //20

var anotherSum=sum;  //將sum的值賦給了anotherSum，此時它們都指向同一個函數。
alert(anotherSum(10,10));  //20

sum=null;    //將sum設置為null，使它與函數“斷絕關系”
alert(anotherSum(10,10));  //20 ，仍然可以正常調用。

沒有重載
函數重載：函數重載是指在同一作用域內，可以有一組具有相同函數名，不同參數列表的函數，這組函數被稱為重載函數。js沒有重載的概念，所以如果聲明了兩個同名函數，則后面的函數會覆蓋前面的函數。

作為值得函數
函數名本身是變量，所以可以作為值來使用。不僅可以像傳遞參數一樣把一個函數傳遞給另一個函數，而且可以將一個函數作為另一個函數的結果返回。

    //把一個函數傳遞給另一個函數的例子
    function callFunction(someFunction,someArgument){
        return someFuction(someArgument);
    }
    function add10(num){
        return num+10;
    }
    var result=callFunction(add10,10);  //要訪問函數的指針而不執行函數的     
    話，要去掉函數名后的圓括號。
    alert(result);  //20

函數聲明和函數表達式

定義函數方法：

首先是函數聲明： function functionName(){}必須有函數名。
然后是函數表達式，比如：

 var sum = function(num1,num2){
        retrun num1+num2;
    };                      //函數末尾有分號，就像聲明其他變量時一樣。

不一定有函數名，所以有匿名函數表達式和命名函數表達式。不過，對函數命名后，一是在函數體內會表達得更清晰，二則是在調試的時候要方便很多。

區別：
函數聲明可以在定義前調用（函數聲明提升），函數表達式不可以（和其他表達式一樣，使用前必須要賦值）。
函數聲明只是讓瀏覽器知道有這樣一個函數了，不會運行。瀏覽器遇到函數表達式會運行。
如果不做函數聲明的話，一般就不希望被重復調用，即很大可能就當做立即執行函數使用。
如果函數體作為表達式的一部分，那它是函數表達式，否則為函數聲明。

this和arguments

在函數內部有兩個特殊的對象：arguments和this。
arguments是一個類數組對象，包含傳入函數的所有參數。主要作用就是保存函數參數。
arguments有一個callee屬性，該屬性是一個指針，指向擁有arguments對象的函數。
例子：

function factorial(num){
    if(num<=1){
      return 1;
    }else{
      return num*factorial(num-1);
    }
}

在函數factorial中調用了他本身，但是如果要是將函數賦值給別的變量，那就不能正常運行了。如果是下面的代碼：

 function factorial(num){
        if(num<=1){
          return 1;
        }else{
          return num*arguments.callee(num-1);
        }
    }

這樣，不管調用函數時使用什么名字，都可以保證正常完成遞歸調用。
this:
this引用的是函數據以執行的環境對象。

函數調用模式時，this指向window。

方法調用模式時，this指向方法所在對象。

wiondow.color="red";
var o={color:"blue"};
function sayColor(){
     alert(this.color);
}
sayColor();    //"red" 
o.sayColor=sayColor;
o.saColor();   //"blue"

構造函數模式時，this指向新生成的實例。

    function Aaa(name){
      this.name= name;
      this.getName=function(){
        console.log(this.name)
      }
    }
    var a = new Aaa("kitty");
    a.getName()        //  "kitty"
    var b = new Aaa("bobo");
    b.getName()        //  "bobo"

apply/call調用模式時，this指向apply/call方法中的第一個參數。

   var list1 = {name:"andy"}
   var list2 = {name:"peter"}
   
   function d(){
     console.log(this.name)
   }
   d.call(list1)     //  "andy" 
   d.call(list2)     //  "peter"

閉包

概念：是指有權訪問另一個函數作用域中變量的函數。
創建閉包方法：在一個函數內部創建另一個函數。

特征：

可以訪問外部函數的變量。

比較占內存。因為閉包會攜帶包含他的函數的作用域，在閉包被銷毀后外部函數的活動變量才會被銷毀。
（ps：關于活動變量知乎上這個問題的第二個答案寫的非常非常好！）

閉包只能取得外部函數中任何變量的最后一個值。所以要注意閉包和循環的使用：

   function foo(){
   var result=new Array();
   for (var i=0;i<10;i++){
       result[i]=function(){
           return i;
       };
   }
   return result;

}
返回了一個函數數組，每個函數都返回10。因為運行foo()函數的順序是這樣的：先運行foo()函數除了匿名函數之外的部分，完成后，再運行匿名函數。這時候for循環已經完成了，i變成了10。匿名函數引用foo()函數作用域內的活動變量i時，i已經等于10了，所以每個函數返回的都是10。

改進：

function foo(){
        var result=new Array();
        for (var i=0;i<10;i++){
            result[i]=function(num){
                return function(){
                  return num;
                };
            }(i);
        }
        return result;
    }

模仿塊級作用域的方法。在調用外部的匿名函數時，傳入參數i，變量i的值賦給num，在外部匿名函數內部的閉包，訪問的是numresult數組的每個函數都有自己num變量的一個副本，就可以返回各自不同的值

云服務器 GPU云服務器云服務器那些事讓js函數只執行一次 js 當前的函數 js date的函數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/86276.html

JS異步那些事一（基礎知識）

摘要：異步那些事一基礎知識異步那些事二分布式事件異步那些事三異步那些事四異步那些事五異步腳本加載事件概念異步回調首先了講講中兩個方法和定義和用法方法用于在指定的毫秒數后調用函數或計算表達式。功能在事件循環的下一次循環中調用回調函數。 JS異步那些事一（基礎知識）JS異步那些事二（分布式事件）JS異步那些事三（Promise）JS異步那些事四（HTML 5 Web Workers...

李濤 2019-08-21 13:49 評論0 收藏0
JS異步那些事三（Promise）

摘要：異常處理異常處理一直是回調的難題，而提供了非常方便的方法在一次調用中，任何的環節發生，都可以在最終的中捕獲到錯誤處理基本的小結具體的很多的用法可以參考阮一峰的入門教程，還有就是上面提到的電子書。 JS異步那些事一（基礎知識）JS異步那些事二（分布式事件）JS異步那些事三（Promise）JS異步那些事四（HTML 5 Web Workers）JS異步那些事五（異步腳本...

wenzi 2019-08-21 13:48 評論0 收藏0
JavaScript模塊化開發的那些事

摘要：模塊化開發在編程開發中是一個非常重要的概念，一個優秀的模塊化項目的后期維護成本可以大大降低。本文主要介紹模塊化開發的那些事，文中通過一個小故事比較直觀地闡述了模塊化開發的過程。每個模塊都由一個名為的函數創建。原文出處模塊化開發的那些事模塊化開發在編程開發中是一個非常重要的概念，一個優秀的模塊化項目的后期維護成本可以大大降低。本文主要介紹JavaScript模塊化開發的那些事，文中通過...

jzzlee 2019-08-21 10:27 評論0 收藏0
【JS基礎】原型對象的那些事（二）

摘要：只是構造函數上的一個屬性，它是一個指針，指向原型對象，并不表示就是原型對象。在上一個例子中，就是一個對象，這個對象可以說是原生構造函數的實例，所以也是一個對象，所以它也有屬性，不過它的指向也就是原型鏈的頂端，再往上就沒有了。上一篇講了①原型對象是什么；②__proto__、prototype、constructor的關系；③原型對象的作用；④原型對象帶來的一些需要注意的問題；沒理解...

yanbingyun1990 2019-08-21 16:23 評論0 收藏0
【JS基礎】原型對象的那些事（一）

摘要：通過同一個構造函數實例化的多個實例對象具有同一個原型對象。所以當給原型對象賦值一個新對象時，切記將原型對象的指回原構造函數以上就是本次分享的內容，關于原型對象的其他知識，下一篇基礎原型對象的那些事二會講到。談起js的基礎，繞不過去的坎就是：原型鏈、作用域鏈、this（em...好吧，還有閉包），今天總結一下關于原型對象的一些知識，供自己和大家復習。概念理解什么是原型對象呢？有以下...

edgardeng 2019-08-20 18:56 評論0 收藏0