js回調函數原理與用法案例分析
本文實例講述了js回調函數原理與用法。分享給大家供大家參考,具體如下:
回調函數就是一個通過函數指針調用的函數。如果你把函數的指針(地址)作為參數傳遞給另一個函數,當這個指針被用來調用其所指向的函數時,我們就說這是回調函數?;卣{函數不是由該函數的實現方直接調用,而是在特定的事件或條件發生時由另外的一方調用的,用于對該事件或條件進行響應。
函數指針是指向函數的指針變量。 因此“函數指針”本身首先應是指針變量,只不過該指針變量指向函數。
函數指針有兩個用途:調用函數和做函數的參數。
作用:
js代碼會至上而下一條線執行下去,但是有時候我們需要等到一個操作結束之后再進行下一個操作,這時候就需要用到回調函數。
基本案例:
<script language='javascript' type='text/javascript'>function doSomething(callback) { // 調用回調函數 callback(’我’, ’網名’, ’葉落森’);}function foo(a, b, c) { //這是回調函數 alert(a + ' ' + b + ' ' + c);}doSomething(foo);</script>
項目中的案例:
vue項目中假設store中this指向沒指向到vue,那么就可以用回調函數來實現它的iview的this.$Message效果。(當然這是很傻的。this指向沒指向到vue,我們可以把vue引進store后,再new Vue()就行。import Vue from ’vue’ var vuethis=new Vue())
a.js
import {mapActions, mapGetters} from ’vuex’;export default { name: ’role’, data () { return { }; }, computed: {}, methods: { ...mapActions([’getRoleData’, ’getPowerData’]), callbackFn(type,content){//這是回調函數if(type){ this.$Message.success(content)}else{ this.$Message.error({ content: content, duration: 5 })} }, initRoleId () { this.getRoleData({path:’http://www.baidu.com/’,callbackFn:this.callbackFn}); } }, mounted(){ this.initRoleId(); }};
store中的js
actions: { getRoleData ({commit}, {path,callbackFn}) { axios.get(path + ’roles’, {params: {pageSize: 500}}).then(res => {if(res.data.retCode=='200'){ commit(’ROLE_DATA’, {roleData: res.data.data.records});}else{ callbackFn(0,res.data.message)//調用回調函數} }); },}
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內容可查看本站專題:《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章: