關于JS函數部分的筆記

remcarpediem 發布于2019-08-26 11:52 / 2554人閱讀

摘要：構造器調用模式一個函數，如果創建的目的就是希望結合前綴來調用，那就被稱為構造函數如果一個函數前面帶上來調用，那么就會創建一個連接到該函數的原型成員的新對象，同時函數中的會綁定到這個新對象中。

函數 函數對象

首先來理解一下什么事對象：ECMA-262是這樣定義的“無序屬性的集合，其屬性可以包含基本值、對象或者函數”，也就是說，對象是‘名/值’對的集合。

var person=new Object();
person.name="Jake";
person.age=18;
person.sayName=function(){
    alert(this.name);
}

上面的例子創建了一個名為person的對象，并為它添加了兩個屬性：name、age和一個方法sayName。其中sayName用于顯示this.name（將被解析為person.name）的值。

函數字面量

我們來看一段代碼：

var add=function(a,b){
    return a+b;
}

函數字面量包含4個部分，分別是：

保留字 function

函數名 add

參數 a、b

語句 return a+b;

函數字面量可以出現在任何允許出現的地方，也可以定義在其他函數中。一個內部函數除了可以訪問自己的參數和變量，同時它也能自由地訪問它的父函數的變量和參數。通過函數字面量創建的函數對象包含一個連接到外部上下文的鏈接。這被稱為閉包

閉包

閉包這個概念是js這門語言中一個非常重要而且是很難掌握的知識點！
這里只能淺顯地解釋一下什么是閉包
我們用一些代碼來解釋這個定義：

function foo(){
    var a=2;
    function bar(){
        console.log(a);
    }
    return bar;
}
var baz=foo();
baz();//2 <--這就是閉包的效果

函數bar()的詞法作用域能夠訪問foo()內部作用域，然后將bar()函數本身當作一個值類型進行傳遞。
在foo執行后，其返回值 bar（）賦值給變量baz并調用baz(),實際上只是通過不同的標識符引用調用了內部的函數bar()。
在foo執行后，foo內部作用域不會被銷毀，因為一直都是bar()本身在使用，所喲foo內部作用域依然存在且能夠一直存活，以供bar隨時進行引用。
bar依然對該作用域保持引用，而這個引用就叫作閉包。

函數作用域

作用域的作用：控制著變量與參數的可見性以及生命周期。
定義在函數內部的參數和變量在函數外部是不可見的，而在一個函數內部任何位置定義的變量，在函數內部任何位置都可見。

var f00=function(){
    var a=3,b=5;
    var bar=function(){
        var b=7,c=11;     //此時a=3,b=7,c=11;
        a+=b+c;           //此時a=21,b=7,c=11;
    };
                          //此a=3,b=5,c沒有定義；
    bar();                //此時a=21,b=5;
}

調用

調用一個函數會暫停當前函數的執行，傳遞控制權和參數給新函數。js提供了四種調用模式：方法調用模式、函數調用模式、構造器調用模式以及apply調用模式。

方法調用模式

當一個函數被保存為對象的一個屬性是，我們稱之為方法。當一個方法被調用時，this被綁定到該對象，當對象與方法用“.”來連接時，那么它就被當作一個方法來調用了。

var person={
    name："Jake",
    age:18,
    sayAge:function(age){
        this.age=age;
    }
};
person.sayAge(19);
docunment.writeln(person.age);//19

2.函數調用模式

當一個函數并不是一個對象的屬性時，那么它就是被當作一個函數來調用的

var myobject={
}
//添加一個新的方法
myObject.do=function(value){
   this.value=value;
   var that=this;
   var helper=function(){
       that.value=that.value+that.value;
   };
   helper();
}
myObject.do(3);
console.log(myObject.value)//6

這里面遇到一個問題，就是在helper函數內部的this指向的時這個函數本省，而不是全局對象。我們找到一個很好的解決方法，那就是將this賦值給一個全新的變量that,那么內部函數就可以訪問到this，這樣就避免了內部函數里面的this錯誤的綁定。

3 構造器調用模式

一個函數，如果創建的目的就是希望結合new前綴來調用，那就被稱為構造函數
如果一個函數前面帶上new來調用，那么就會創建一個連接到該函數的prototype（原型）成員的新對象，同時函數中的this會綁定到這個新對象中。

var Myobject=function(string){
    this.status=string;
}
Myobject.prototype.get_status=function(){
    return this.status;
}
//創建實例
var newObj=new Myobject("Hello !");
console.log(newObj.get_status());
//Hello !

這里要特別注意：按照慣例，構造函數始終都應該以一個大寫字母開頭，而非構造函數則應該以一個小寫字母開頭。

4.Apply調用模式

Apply方法讓我們構建一個參數組傳遞給調用函數。它允許我們選擇this的值。Apply方法接受兩個參數，第一個要綁定給this的值，第二個就是參數數組。

var array=[3,4];
var sum=add.apply(null,array);//sum值為 7

var statusObj={
    status:"Hello"
};
var status=Quo.prototype.get_status.apply(statusObj);
//status值為‘Hello’

function SpeciallArray(){
    var values=new Array();
    values.push.apply(values,arguments);
    values.toPipedString=function(){
        return this.join("|");
    }
    return values;
}
var color=new SpeciallArray("blue","yellow","red");
console.log(colo.toPipedString);
//"blue|yellow|red"

GPU云服務器云服務器關于js的介紹關于js讀取json里的數據 js 當前的函數 js date的函數

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

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

《高性能JavaScript》讀書筆記

摘要：除此以外，讓元素脫離文檔流也是一個很好的方法。因為元素一旦脫離文檔流，它對其他元素的影響幾乎為零，性能的損耗就能夠有效局限于一個較小的范圍。講完重排與重繪，往元素上綁定事件也是引起性能問題的元兇。高性能這本書非常精致，內容也非常豐富。 showImg(https://segmentfault.com/img/bVJgbt?w=600&h=784); 入手《高性能JavaScript》一...

W_BinaryTree 2019-08-21 15:12 評論0 收藏0
js筆記系列之--時間及時間戳

摘要：入門系列之時間及時間戳時間及時間戳時間及時間戳是里面很常見的一個概念，在我們寫前端頁面的時候，經常會遇到需要獲取當前時間的情況，所以，了解中的時間概念非常重要。 js入門系列之時間及時間戳時間及時間戳時間及時間戳是js里面很常見的一個概念，在我們寫前端頁面的時候，經常會遇到需要獲取當前時間的情況，所以，了解js中的時間概念非常重要。而時間戳是指格林威治時間1970年01月0...

wapeyang 2019-08-26 11:34 評論0 收藏0
js筆記系列之--時間及時間戳

摘要：入門系列之時間及時間戳時間及時間戳時間及時間戳是里面很常見的一個概念，在我們寫前端頁面的時候，經常會遇到需要獲取當前時間的情況，所以，了解中的時間概念非常重要。 js入門系列之時間及時間戳時間及時間戳時間及時間戳是js里面很常見的一個概念，在我們寫前端頁面的時候，經常會遇到需要獲取當前時間的情況，所以，了解js中的時間概念非常重要。而時間戳是指格林威治時間1970年01月0...

paulli3 2019-08-01 18:31 評論0 收藏0
three.js筆記——（1）入門

摘要：入門這部分內容的目標是簡單地介紹，我們首先講如何用來實現一個旋轉的立方體。具體的實例將會給出，以防你卡住或者需要幫助。透視投影照相機的構造函數是，其中是可視角度為，通常是容器的寬高比是近斷距離，是遠端距離。入門這部分內容的目標是簡單地介紹three.js，我們首先講如何用three.js來實現一個旋轉的立方體。具體的實例將會給出，以防你卡住或者需要幫助。在html文件中引入thr...

ephererid 2019-08-20 14:36 評論0 收藏0