摘要:之前的函數(shù)聲明及表達式函數(shù)的聲明函數(shù)表達式也可以此時的只是這個匿名函數(shù)的名字,和變量沒有關(guān)系構(gòu)造函數(shù)這種方法會運行兩次代碼先實例后執(zhí)行函數(shù)體數(shù)的默認值如果沒有傳入?yún)?shù)就使用默認值,利用的短路特性傳入的參數(shù)為值會忽略判斷是否傳參,如果沒
ES5之前的函數(shù)聲明及表達式
1,函數(shù)的聲明
function fn(){ dosomething; };
2,函數(shù)表達式
var fn = function(){}
//也可以var fn = function newFn(){},此時的newFn只是這個匿名函數(shù)的名字,和變量沒有關(guān)系;
3,構(gòu)造函數(shù)
var fn = new Function("num1","num2","return num1 ,num2") //這種方法會運行兩次代碼 //先實例后執(zhí)行函數(shù)體
ES5數(shù)的默認值
function fn(arg1,arg2){ arg2 = arg2 || "the value"; //如果沒有傳入?yún)?shù)就使用默認值,利用||的短路特性 return arg1+arg2; }; fn("hello") ->hello the value; fn("hello","world") ->hello world; fn("obama","")->obama the value //傳入的參數(shù)為falsey值會忽略 typeof arg2 === "undefined" //判斷是否傳參,如果沒有實參的話,就是undefined; arg2=(typeof arg2 !=="undefined")?arg2:"the value";//判斷是否有傳入值 arguments.length ===1 //判斷傳遞的參數(shù)個數(shù)
ES6的參數(shù)默認賦值
function fn(arg1,arg2 = "value"){ let arg2 = 34; //此處的arg2 默認是已經(jīng)聲明,所以內(nèi)部使用let const會語法報錯! console.log(arg1,arg2) } //內(nèi)部的arguments對象也默認和嚴格模式一樣的行為,不在動態(tài)的反應(yīng)變化;默認值不計入arguments對象 //函數(shù)的參數(shù),也可以是其他值,默認參數(shù)只有在調(diào)用的時候才會求值,因此可以用第一個參數(shù)作為默認的值 function fn(a , b =a){}; //參數(shù)的作用域和ES6之前的一樣,和其他的參數(shù)都是同一作用域,如果參數(shù)的值是一個變量,那么這個參數(shù)的作用域先是局部(確認是否也是形參)后是全局; let a = 34; function fn(b = a){ //尤其注意,參數(shù)b賦值的是變量a,那么就默認變量a已經(jīng)聲明,此時的a,如果不是參數(shù),就是全局的變量,如果是參數(shù),就會報錯,重復(fù)賦值,使用let和const要注意語法錯誤 let a= 11; console.log(b); } fn() ->34 //當參數(shù)b賦值變量a的時候,a是全局注冊的,因此,fn()是34,如果沒有l(wèi)et a = 34;就會報錯, fn(22) ->22 //此時參數(shù)的作用域是局部 let a = 23; function (a,b=a){ //參數(shù)b的值是a,相當于再次給a賦值,由于參數(shù)是函數(shù)內(nèi)部變量,所以和 let a = 12沖突;會報錯 let a = 12; console.log(b); } function fn(arg1,arg2){ console.log(arg1 === arguments[0]); //true console.log(arg2 === arguments[1]); //true arg1 = newarg1; arg2 = newarg2; console.log(newarg1 === arguments[0]); //true console.log(new arg2 === arguments[1]); //true }
rest參數(shù)(...rest)不定參數(shù);只能放在形參的最后面,否則會報錯,這是一個數(shù)組對象
function fn(...value){ console.dir(value); value.slice() //可以使用數(shù)組的方法,區(qū)分arguments } fn(1,2,3,4,4)->[1,2,3,4,4]返回的是數(shù)組,可以使用數(shù)組的方法; //無論形參是否有不定參數(shù),arguments對象正常使用,反應(yīng)傳入的參數(shù)的數(shù)量
...擴展運算符 把運算符后面的數(shù)組,轉(zhuǎn)為用逗號分開的參數(shù)序列;可以用在所有使用數(shù)組的的方法中
console.log(1,2,3,4) //1 2 3 4; console.log(...[1,2,3,4])//同上 //利用call的屬性,轉(zhuǎn)化數(shù)組
判斷函數(shù)的調(diào)用,是直接調(diào)用還是new
function A(a){this.a = a;} var b = new A(3); //生成了對象 var c = A(4); //此時給全局屬性添加了a=4 function A(a){ if(this instanceof A){this.a =a} //判斷是否是new調(diào)用 else{return new A(a)} } var d = A.call(b,333) //通過call強制的指定this //正確的寫法 function B(b){ if(typeof new.target ! == "undefined"){this.b =b} //新的元屬性 else{return new B(b)}; } //es6可以在塊級代碼中,聲明和使用函數(shù),但是會作為全局函數(shù)
箭頭函數(shù) =>
//當函數(shù)沒有參數(shù)時; var f1 = function(){ };//默認函數(shù)返回一個undefined; var f1 = ( )=>{}; //空函數(shù) var f2= ()=>"the value you want"; var f3 = ()=>{ //如果需要在函數(shù)體內(nèi)執(zhí)行多條代碼,就必須用大括號包裹 doSomethings; doantherthings; return value; //必須用return 返回值;否則默認返回undefined; } //箭頭函數(shù)有一個函數(shù)的時候 var f1 = function(arg1){ }; var f1 = arg1 =>undefined; //箭頭函數(shù)有多個參數(shù)的時候; var f1 = function (arg1,arg2,arg3){ }; var f1 = (arg1,arg2,arg3)=> undefined; var f2 = (arg1,arg2,arg3)=>arg1-arg2-arg3; //注意如果箭頭函數(shù)只是多帶帶的返回一個對象要在大括號的外面加個小括號; var f1 = ()=>{ doSomething; return { //此時不是多帶帶返回所以不需要 name : "name", value : "value" } }; var f2 = ()=>({ //此時為了區(qū)分{}是否是函數(shù)體,所以要加上小括號; name : "name", value : "value" }) //箭頭函數(shù)的函數(shù)體內(nèi)正常和一般函數(shù)一樣,但是沒有arguments數(shù)組對象, //IIFE關(guān)于立即執(zhí)行的函數(shù) var f1 = (function(arg){ return { getArg :function(){return arg} } })(arg) //返回對象的方法 var f1 = (arg=>{ return { getArg :function(){return arg} } })("arg") //同上;
箭頭函數(shù)的this指向問題 (this僅僅是外一層非箭頭函數(shù)的函數(shù)this,否則就是undefined)
一般函數(shù)的this是根據(jù)調(diào)用的對象來指定的或者用new ,bind ,call 等操作符或者方法來綁定;
1,默認的this 指向
function fn(){console.dir(this)} //此時默認的指向是window
2,隱式的this 指向
var obj = { name : "obama", getName : function(){ return this.name //此時的指向是對象 } }
3,new操作符
function Name(name){ this.name = name; } var man = new Name("obama"); //此時指向的是new調(diào)用的對象
4,硬指定的this
var getName= function(){ console.log(this.name) } var name = "bush"; var predents = { name : "obama", } getName(); //bush getName.call(preddents) //obama;
ES6的箭頭函數(shù)this是和變量的作用域一樣的詞法指定(寫在哪里就是那里的引用),不能更改,也不可以用new操作符,本著用完即丟的思想
var a = ()=>this; //此時返回的是this對象是undefined; var obj = {age : 45}; obj.b = a; //把函數(shù)a當作obj的方法; obj.b() //正常不使用箭頭函數(shù)的話, this的指向應(yīng)該是調(diào)用的obj對象,但是這里顯示的 是原來定義的window對象 a.call(obj) //顯試的綁定,也不能改變this 的作用域; var newa = new a() //報錯,a不是一個構(gòu)造函數(shù); 如果要使用箭頭函數(shù)的綁定的話在ES7里雙冒號::左邊是對象,右邊的是方法,這樣就可以綁定, var foo = {age : 34}; var bar = ()=>this.age; foo::bar //以上僅作了解
尾調(diào)用優(yōu)化特指函數(shù)的最后一步(一般函數(shù)最后一步默認是return undefined)這一步不能有其他任何的操作,比如賦值,算術(shù)運算 屬于引擎的優(yōu)化
一般JS引擎 在執(zhí)行中,會進入執(zhí)行上下文,全局,函數(shù)和eval上下文,三者中的一個,
保存這個上下文的地方就是在調(diào)用棧,棧的頂端就是一個變量對象,保存當前函數(shù)的使用的變量;
函數(shù)調(diào)用會在內(nèi)存形成一個調(diào)用記錄稱之為調(diào)用幀,保存位置和內(nèi)部變量,所有的調(diào)用幀就形成了一個調(diào)用棧;
尾調(diào)用因為是函數(shù)的一步,所以返回這個函數(shù)后,原函數(shù)就不必記住自己的變量,尾調(diào)用的函數(shù)會保存這個信息,所以內(nèi)層的函數(shù)取代外部的函數(shù),這樣就行成優(yōu)化
function fn(){ let a = 1; let b = 2; return f2(a + b); } fn(); f2(3) //在函數(shù)fn里f2是尾調(diào)用,fn執(zhí)行后,就不必記住自身可調(diào)用的變量,因為f2會記住執(zhí)行;最終取代原函數(shù); function fn(num){ ///一般遞歸函數(shù) if(num ===1){return 1}; return num+fn(num-1) }
注意只有使用use strict 尾調(diào)用優(yōu)化才會生效,而且argument 和caller 不能使用
function fn(n,total=1){ //尾調(diào)用優(yōu)化 if(n ===1) return total; return fn(n-1,n+total) } //柯里化,將多參數(shù)的函數(shù)層層的使用單參數(shù)的函數(shù)調(diào)用 function add(n){ return curry(n,1) }; function curry(n,total){ if(n ===1) return total; return curry(n-1,n+total) }
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/89125.html
摘要:之小白初入江湖超文本標記語言簡稱是一種用于創(chuàng)建網(wǎng)頁的標準標記語言。描述了一個網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn),使之成為一種標記語言而非編程語言。是塊級元素,是行內(nèi)元素。層疊樣式表簡稱是一種用來為結(jié)構(gòu)化文檔如添加樣式的工具。 HTML & CSS之小白初入江湖 1. HTML 超文本標記語言(HyperText Markup Language, 簡稱HTML)是一種用于創(chuàng)建網(wǎng)頁的標準標記語言...
摘要:之小白初入江湖超文本標記語言簡稱是一種用于創(chuàng)建網(wǎng)頁的標準標記語言。描述了一個網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn),使之成為一種標記語言而非編程語言。是塊級元素,是行內(nèi)元素。層疊樣式表簡稱是一種用來為結(jié)構(gòu)化文檔如添加樣式的工具。 HTML & CSS之小白初入江湖 1. HTML 超文本標記語言(HyperText Markup Language, 簡稱HTML)是一種用于創(chuàng)建網(wǎng)頁的標準標記語言...
摘要:剛開始做項目,正好碰上了一個批量下載的功能就是下面圖片中的一個導(dǎo)出的功能后臺返回的數(shù)據(jù)格式是這樣的,如下做批量下載后臺需要前端給一個必需字段,在我這里也就是上代碼這樣我們的就是一個由組成的數(shù)組,搞定 剛開始做vue項目,正好碰上了一個批量下載的功能 就是下面圖片中的一個導(dǎo)出的功能showImg(https://segmentfault.com/img/bVbsuIr); 后臺返回的數(shù)據(jù)...
摘要:本人前端萌新大概花了一周多一點,完成了一個前后端分離解耦的簡易個人博客項目。項目前后端分離,路由完全交給處理,后端只負責(zé)操作數(shù)據(jù)庫,暴露。目前項目提供做學(xué)習(xí)用途,希望能給大家一些幫助,對全棧項目有一個初步的了解,謝謝。 本人前端萌新大概花了一周多一點,完成了一個前后端分離解耦的簡易個人博客項目。項目前后端分離,路由完全交給vue-router處理,后端只負責(zé)操作數(shù)據(jù)庫,暴露api。 技...
閱讀 1007·2023-04-26 02:21
閱讀 2825·2021-09-24 09:47
閱讀 1617·2019-08-30 15:55
閱讀 2172·2019-08-30 14:01
閱讀 2330·2019-08-29 14:01
閱讀 2055·2019-08-29 12:46
閱讀 822·2019-08-26 13:27
閱讀 1945·2019-08-26 12:23