摘要:比如,以對象的方法的形式調用函數并傳入兩個參數可以傳入的參數可以是數組和類數組的。方法的該方法主要作用是將函數綁定至某個對象,方法返回一個新的函數,調用這個新的函數會把綁定的函數在對象中當做方法來調用。
參數
形參(parameter):函數中定義的變量
實參(argument):運行時的函數調用時傳入的參數
上下文(context):通過對象來調用函數時,這個對象就是this就是上下文;
閉包(closure):函數嵌套在函數當中
1 函數調用的方式有4種方法來調用JavaScript函數:
作為函數
作為方法
作為構造函數
通過call方法和apply方法間接調用
ES3 和非嚴格模式下的ES5中,調用上下文(this的值)是全局對象。在嚴格模式下,調用上下文則是undefined
1.1 函數調用語法:
functionName()
window.name = "hello"; (function () { console.log(this); //window })() "use strict"; window.name = "hello"; (function () { console.log(this); //undefined })()1.2 方法調用
語法:
obj.functionName()
方法和this關鍵字是面向對象編程規范的核心
方法鏈
方法鏈:當方法的返回值是一個對象,這個對象還可以再調用它的方法。這個方法調用序列就是方法鏈;
1.3 構造函數調用沒有形參的構造函數調用都可以省略小括號
1.4 間接調用call方法:使用它自有的實參列表作為函數的實參;
apply方法:要求以數組的形式傳入參數;
2 函數的實參和形參 2.1 可選形參當調用函數的時候傳入的實參比函數聲明時指定的形參個數要少,剩下的形參都將是undefined;所以在定義函數的時候應當給省略的參數賦一個默認值:
function pushArray(o, /* optional */ a) { if (a === undefined) a = []; // a = a || []; for (var property in o) a.push(property); return a; } var o = { name: "Oliver", age: 18 }; var a = ["friends"]; console.log(pushArray(o, a).toString()); //friends,name,age2.2 實參對象
省略的實參都是undefined;多出的參數自動忽略
另外,可以通過arguments來獲取多余的參數,arguments.length獲得參數個數
不定實參函數(varargs function):接收任意個數的實參
不定實參函數的實參個數不能為零;
ES5之前,arguments[0]和x指代同一個值;
function pushArray(a) { console.log(a); //Array arguments[0] = 10; console.log(a); //Array console.log(arguments[0]); //10 } var a = ["friends"]; pushArray(a);2.3 將對象屬性用作實參
最好通過名值對的形式傳入參數(傳入的實參都寫入一個多帶帶的對象之中,在調用的時候傳入一個對象)
function outputString(obj) { var fname = obj.firstName, lname = obj.lastName, age = obj.age; console.log(`your fisrtName: ${fname}; lastName: ${lname}; age: ${age}`); } outputString({firstName: "Oliver", lastName: "Young", age: 18}); //your fisrtName: Oliver; lastName: Young;3 作為值的函數
函數也是值,可以將函數賦值給變量,存儲在對象的屬性和數組的元素中,作為參數傳入另外一個函數等
函數是對象,可以定義自己的屬性
log.conter = 10; function log () { console.log(log.conter); } log(); //10
這樣函數就不需要再定義一個全局變量
4作為命名空間的函數將代碼放入一個函數內,然后調用這個函數:
不同的寫法:
function log (i) { console.log("hello" +i); } log(100); (function log (i) { console.log("hello" + i); }(100)) (function log (i) { console.log("hello" + i); })(100)
小括號括起來避免JavaScript解釋器解析為函數聲明語句
5 閉包詞法作用域(lexical scoping):函數的執行依賴于變量作用域,這個作用域是在函數定義時決定的,而不是函數調用時決定的。
閉包:函數對象可以通過作用域相互關聯起來,函數體內部的變量都可以保存在函數作用域內。
上面的log.conter屬性就可以使用包括在閉包中:
var pro = (function() { var conter = 10; function log(argument) { console.log(conter++); } return log; })(); pro(); //10 pro(); //11 pro(); //12
使用多個嵌套函數:
function counter () { var num = 0; return { count: function () { return num ++; }, reset: function () { num = 0; } }; } var newCounter = counter(); //這里是新的計數器,再賦值一個變量可以得到另外一個計數器,兩者不受影響 console.log(newCounter.count()); //0 console.log(newCounter.count()); //1 console.log(newCounter.count()); //2 newCounter.reset(); console.log(newCounter.count()); //0 console.log(newCounter.count()); //1 console.log(newCounter.count()); //26 函數屬性、方法和構造函數 6.1 length屬性
函數的length返回的是形參的數量;函數內部arguments.length返回的是實參的數量
function add(x, y) { return arguments.length; } console.log(add.length); //2 console.log(add(1)); //16.2 prototype屬性 6.3 call()和apply()方法
通過調用方法的形式來間接調用函數,call和apply的第一個實參是要調用函數的母對象,它是調用上下文。
比如,以對象o的方法的形式調用函數f()并傳入兩個參數:f.call(o, 1, 2)
apply可以傳入的參數可以是數組和類數組的。
6.4 bind()方法ES5的該方法主要作用是將函數綁定至某個對象,方法返回一個新的函數,調用這個新的函數會把綁定的函數在對象中當做方法來調用。
function add(y) { return this.x + y; } var o = { x: 100 }; var g = add.bind(o); console.log(g(100)); //200
柯里化(currying):除了第一個實參外,傳入bind的實參也會綁定至this;
function add(x, y) { return x + y; } var o = { }; var g = add.bind(o, 100); //x是100 console.log(g(100)); //200 y是100 //上面的o對象可以去掉: function add(x, y, z) { return x + y + z; } var g = add.bind(null, 100, 100, 100); //x是100 y是100 z是100 console.log(g()); //300 //又如: function add(y, z) { return this.x + y + z; } var g = add.bind({x:100}, 100, 100); //{x是100} y是100 z是100 console.log(g()); //3006.5 toString()方法 6.6 Function()構造函數
Function()構造函數所創建的函數并不是使用此法作用域:
var scope = "global"; function constructFunction () { var scope = "local"; return new Function("return scope"); } console.log(constructFunction()()); //global var scope = "global"; function constructFunction () { var scope = "local"; return function () { return scope }; } console.log(constructFunction()()); //local6.7 可調用的對象 7 函數式編程 7.1 使用函數處理數組
如要計算元素的平均值:
var arr = [1,2,3,4,5]; var total = 0; for (var i = 0; i < arr.length; i++) { total += arr[i]; }; var result = total/arr.length; console.log(result); //3
函數式編程風格:
var arr = [1,2,3,4,5]; function sum (a, b) { return a + b; } var total = arr.reduce(sum); var result = total/arr.length; console.log(result); //37.2 高階函數
高階函數(higher-order function):就是操作函數的函數,它接收一個或多個函數作為參數,并返回一個新函數
function reverse(fun) { return function () { var result = fun.apply(this, arguments); return !result; } } var even = function (x) { return x % 2 === 0; }; var odd = reverse(even); console.log(odd(100)); //False console.log(even(100)); //True7.3 不完全函數 7.4 記憶
記憶(memorization):部分結果在函數式編程中被緩存起來,這種緩存技巧就是“記憶”
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/79135.html
摘要:試用過幾回,不滿的地方,是一個框架,必須最好按它的方式來編碼,與混編,使用文件。經過一翻網絡搜索,勉強明白了依賴更新的實現方式,便嘗試著自己去實現一個框架。如今有依賴更新這種技術的存在,我覺得找到了可能。 初接觸vue,驚為天人,它的更新方式極為取巧,但也是人們保持路人的原因:似乎沒有一個嚴格的數學證明保證按它的方式能精確更新到DOM。不過腦子里推演的似乎不會發生失敗,而且每次界面都能...
摘要:不過讓流行起來的原因應該是是目前所有主流瀏覽器上唯一支持的腳本語言。經過測試,數字字符串布爾日期可以直接賦值,修改不會產生影響。再考慮對象類型為或者的情況。對于結果聲明其類型。判斷對象的類型是還是,結果類型更改。 轉載自我的個人博客 歡迎大家批評指正 1. 第一個頁面交互 這里最需要學習的老師的代碼中,每一部分功能都由函數控制,沒有創建一個全部變量。且最后有一個函數來控制執行代碼...
摘要:舉個例子在上面的例子可以看到,我們聲明是一個數字,但是我們在之后將的值又改成了字符串和布爾值后面會講這些類型。基本類型字符串表示一個字符串,如。因此,我們可以寫一個函數,用來精確檢測類型。 showImg(https://segmentfault.com/img/remote/1460000017309509?w=850&h=572); 定義 1. 什么是數據類型? 數據類型,就是將...
摘要:簡介原文鏈接簡稱是一種輕量級,解釋型的編程語言,其函數是一等公民。標準的目標是讓任何一種程序設計語言能操控使用任何一種標記語言編寫出的任何一份文檔。核心規定了如何映射基于的文檔結構,以便簡化對文檔的任意部分的訪問和操作。 JavaScript 簡介 原文鏈接 JavaScript ( 簡稱:JS ) 是一種 輕量級,解釋型 的編程語言,其函數是一等公民。眾所周知,它是用于網頁開發的腳...
摘要:更形象的我們還可以將面向對象理解為一種宗教信仰。這就導致面向對象教的程序員們在寫時就很難受。所以為了滿足信仰面向對象教的需求通過構造函數的形式模擬了偽類。這個套路的核心就是類那么里沒有類所以其實是通過構造函數來模擬的偽類。 JS面向對象之一 【概述】 在學習JS的面向對象之前,我們應該先自問這樣幾個問題: 面向對象是什么意思? 學習面向對象的核心是什么? 為什么要學習面向對象?(它的...
閱讀 3364·2021-11-11 16:54
閱讀 3523·2021-10-11 10:58
閱讀 1262·2021-08-30 09:41
閱讀 1808·2019-08-30 15:54
閱讀 2032·2019-08-30 14:00
閱讀 2706·2019-08-29 17:13
閱讀 1672·2019-08-29 15:19
閱讀 613·2019-08-29 15:14