這一章，我們來動手實踐VC呼叫JS函式。

我們動手寫一個HTML，其中包含這樣一段JS程式碼:

<script type="text/javascript">
    function Add(value1, value2) {
        return value1 + value2;
    }
</script>

然後我們用WebBrowser載入這個HTML後，在VC中這樣來呼叫這個函式名為Add的JS函式:

//別忘了#include <MsHTML.h>
//m_WebBrowser是一個WebBrowser的Activex控制元件物件。
CComQIPtr<IHTMLDocument2> spDoc = m_WebBrowser.get_Document();
CComDispatchDriver spScript;
spDoc->get_Script(&spScript);

CComVariant var1 = 10, var2 = 20, varRet;
spScript.Invoke2(L"Add", &var1, &var2, &varRet);
 

spScript.Invoke2的作用是呼叫JS函式中名為Add的函式，傳入兩個引數，用varRet接收返回值。

可以看到，Invoke2呼叫成功後，varRet得到了返回值30。

但這樣的話一次只能接受一個返回值。

如果要一次接受多個返回值的話，怎麼辦呢？

我們可以讓JS返回一個JS中的Array陣列或Object物件。

當JS函式return一個Array或一個Object物件時，VC這邊的varRet將接受到一個代表該物件的IDispatch介面。我們仍然用CComDispatchDriver來管理這個IDispatch。用上一篇文章介紹的CComDispatchDriver的四個方法：

GetProperty

GetPropertyByName

PutProperty

PutPropertyByName

來從這個Array或Object物件中取出我們要的資料。

實踐是檢驗真理的唯一標準，讓我們再來寫一個JS函式:

<script type="text/javascript">
    function Add(value1, value2) {
        var array = new Array();
        array[0] = value1;
        array[1] = value2;
        array[2] = value1 + value2;
        return array;
    }
</script>
 

然後在VC中這樣寫：

CComQIPtr<IHTMLDocument2> spDoc = m_WebBrowser.get_Document();
CComDispatchDriver spScript;
spDoc->get_Script(&spScript);

CComVariant var1 = 10, var2 = 20, varRet;
spScript.Invoke2(L"Add", &var1, &var2, &varRet);
	
CComDispatchDriver spArray = varRet.pdispVal;
//獲取陣列中元素個數，這個length在JS中是Array物件的屬性，相信大家很熟悉
CComVariant varArrayLen;
spArray.GetPropertyByName(L"length", &varArrayLen);
//獲取陣列中第0,1,2個元素的值：
CComVariant varValue[3];
spArray.GetPropertyByName(L"0", &varValue[0]);
spArray.GetPropertyByName(L"1", &varValue[1]);
spArray.GetPropertyByName(L"2", &varValue[2]);

可以看到，10,20,30，這三個JS函式返回的值已經躺在我們的varValue[3]裡了。

當然，如果不知道JS返回的Array物件裡面有幾個元素，我們可以在VC這邊獲取它的length屬性，然後在一個迴圈中取出陣列中的每個值。

如果我們的JS函式返回一個包含有多個屬性值的Object物件，VC這邊該如何接收呢？

讓我們再來寫一個JS函式:

<script type="text/javascript">
    function Add(value1, value2) {
        var data = new Object();
        data.result = value1 + value2;
        data.str = "Hello,我是小明!";
        return data;
    }
</script>

然後在VC中我們這樣接收：

CComQIPtr<IHTMLDocument2> spDoc = m_WebBrowser.get_Document();
	CComDispatchDriver spScript;
	spDoc->get_Script(&spScript);

	CComVariant var1 = 10, var2 = 20, varRet;
	spScript.Invoke2(L"Add", &var1, &var2, &varRet);
	
	CComDispatchDriver spData = varRet.pdispVal;
	CComVariant varValue1, varValue2;
	spData.GetPropertyByName(L"result", &varValue1);
	spData.GetPropertyByName(L"str", &varValue2);

我們從JS返回的Object物件裡取出了它的兩個屬性，result和str，分別是一個整形資料和一個字串。

這裡JS程式碼是我們自己寫的，在VC這邊當然事先知道這個JS函式返回的物件有result和str這兩個屬性。

如果JS程式碼不是我們寫的，或者它的屬性是事先不能確定的，該怎麼辦呢？答案是使用IDispatchEx介面來列舉這個物件的相關資訊(方法名、屬性名)。這個現在暫時不講，在後續的文章中會講。

當然，JS不只可以返回Object物件，返回什麼物件都可以，當返回一個物件而非基本資料型別（整形、浮點、字串）時，VC這邊收到的返回值是一個IDispatch，然後我們需要呼叫GetPropertyByName方法從這個IDispatch代表的物件中取出它的屬性來。

JS中生成的物件和陣列，傳遞給VC後，可以用CComDispatchDriver方便的讀取，但如果要在VC這邊生成一個物件或陣列傳遞給JS該怎麼辦呢？ 很多時候我們用VC呼叫JS函式的時候，需要傳遞很多引數給它，引數少還好辦，給JS函式多寫幾個形參就行了，可是引數很多，多達數十個數百個怎麼辦？傳遞物件或陣列才是好辦法。JS中的物件和陣列傳到VC這邊後就變成了一個IDispatch*，那麼同理我們構造一個IDispatch*傳給JS不就行了嗎？說起來容易做起來麻煩，具體實現可以看下一章《VC與JavaScript互動(三) ———— JS呼叫C++》，但實在是太麻煩了。 用JSON就行了！VC想傳遞什麼給JS，只需把要傳遞的資料放到JSON裡，然後把JSON字串扔給JS，接下來JS用JSON.stringify()就把這個JSON字串變成JS中的陣列或物件了。 如此一來，VC與JS互動只需傳遞字串就行了，VC這邊生成JSON的話手工拼接一下字串也很簡單，也可用一些庫來實現，如RapidJSON、jsoncpp、Boost.PropertyTree等等。

這樣一來，VC呼叫JS函式，傳遞引數給JS和JS返回返回值給VC，大致就都會了。

對於CComVariant包裝的VARIANT這種智慧型變數，不瞭解的可以到網上看下相關資料。《深入解析ATL》之類的書上均有介紹。

值得注意的是ATL提供的這些CCom開頭的智慧包裝類，並不依賴於ATL的動態庫。因為我在VC專案中並沒有選擇連結ATL，程式除錯執行時程序載入的模組中也有沒有ATL100.dll之類的模組載入。大家可以放心使用而不用擔心依賴上ATL。

VC呼叫JS函式沒問題了。那麼JS函式如何呼叫VC呢？我們將在下一篇文章中慢慢道來。