上節(jié)我們分析了stream.js的源碼豺裆,這節(jié)我們繼續(xù)閱讀sender類(lèi)。sender類(lèi)提供了一個(gè)在原生調(diào)用js上提供了一個(gè)橋。
拿昨天的例子來(lái)說(shuō):
require("@weex-module/stream").fetch({url:"http://www.baidu.com"},function(data){
console.log(data);
});
我們知道stream.fetch()方法是有weex框架執(zhí)行的,當(dāng)執(zhí)行完畢時(shí),怎么調(diào)用我寫(xiě)的<code>console.log(data);</code>大州?我想這便是sender要解決的吧。
- 原型方法
下面我們看一下sender類(lèi)通過(guò)原型提供給外界調(diào)用的方法垂谢。
Sender.prototype = {
// perform a callback to jsframework.
performCallback: function (callbackId, data, keepAlive) {
var args = [callbackId]
data && args.push(data)
keepAlive && args.push(keepAlive)
_send(this.instanceId, {
method: 'callback',
args: args
})
},
fireEvent: function (ref, type, event) {
if (event._alreadyFired) {
// stop bubbling up in virtual dom tree.
return
}
// do not prevent default, otherwise the touchstart
// event will no longer trigger a click event
event._alreadyFired = true
var evt = utils.extend({}, event)
// The event.target must be the standard event's currentTarget.
evt.target = evt.currentTarget
evt.value = event.target.value
evt.timestamp = Date.now()
_send(this.instanceId, {
method: 'fireEvent',
args: [ref, type, evt]
})
}
}
原型方法有兩種分別是performCallback和fireEvent厦画。通過(guò)看代碼我們可以知道fireEvent是用于事件觸發(fā)時(shí)調(diào)用js代碼時(shí)使用。
- _send方法
我們看到上面兩個(gè)原型方法都調(diào)用了_send方法滥朱。
_send(this.instanceId, {
method: 'callback',
args: args
})
/****/
_send(this.instanceId, {
method: 'fireEvent',
args: [ref, type, evt]
})
但是呢根暑,_send方法定義卻非常簡(jiǎn)單。
function _send(instanceId, msg) {
callJS(instanceId, [msg])
}
這里面的callJS是global的一個(gè)方法徙邻。主要用于把msg注入到我們寫(xiě)的代碼中并調(diào)用它
function(data){ console.log(data); }
這里先簡(jiǎn)單說(shuō)一下排嫌,調(diào)用的步驟:
. 找到需要執(zhí)行函數(shù)的實(shí)例
. 找到這一個(gè)方法
. 注入調(diào)用參數(shù)
. 啟動(dòng)調(diào)用
.調(diào)用結(jié)果的記錄