IOS JavaScriptCore介紹

本文主要轉自：https://www.jianshu.com/p/cdaf9bc3d65d

                     http://blog.csdn.net/u011993697/article/details/51577295

oc與JS的交互實現方式有不少，在ios7以前用的比較多的是WebViewJavaScriptBridge，在ios7以後蘋果將JavaScriptCore框架開放，這樣就增長一種選擇。

一、準備工做

首先要導入JavaScriptCore的頭文件

#import <JavaScriptCore/JavaScriptCore.h>

二、用webview加載HTML文件，這裏用的是本地html

- (void)viewDidLoad
{
[super viewDidLoad];

NSString *path = [[[NSBundle mainBundle] bundlePath]  stringByAppendingPathComponent:@"JSCallOC.html"];
NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]];
[self.webView loadRequest:request];
}

三、在進行JS交互以前，須要經過JSContent建立一個使用JS的環境

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    // Undocumented access to UIWebView's JSContext
    self.context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
    
    // 打印異常
    self.context.exceptionHandler =
    ^(JSContext *context, JSValue *exceptionValue)
    {
        context.exception = exceptionValue;
        NSLog(@"%@", exceptionValue);
    };
    
   
    
}

四、JS調用OC代碼

4.一、經過block調用

<input type="button" value="測試log" onclick="log('測試');" />

self.context[@"log"] = ^(NSString *str)
{
NSLog(@"%@", str);
};

4.二、實現JSExport協議

定義須要暴露給JS的內容

<input type="button" value="計算階乘" onclick="native.calculateForJS(input.value);" />

@protocol TestJSExport <JSExport>

JSExportAs
(calculateForJS ,
 - (void)handleFactorialCalculateWithNumber:(NSNumber *)number
 );

@end

 // 以 JSExport 協議關聯 native 的方法
self.content[@"native"] = self;

五、OC調用JS代碼

在OC中，全部表示JS中對象，都用JSValue來建立，經過objectForKeyedSubscript方法或者直接使用下標的方法獲取JS對象，而後使用callWithArguments方法來執行函數。

// 方法一.  
 JSValue *function = [self.context objectForKeyedSubscript:@"factorial"];
// 方法二.
JSValue * function = self.context[@"factorial"];

JSValue *result = [function callWithArguments:@[inputNumber]];
self.showLable.text = [NSString stringWithFormat:@"%@", [result toNumber]];

一個demon鏈接：https://github.com/shaojiankui/JavaScriptCore-Demo

六、封裝

將javascriptcore進行封裝，更方便ios 和 前端進行數據的交互和方法的調用，使用方式和webviewjavascriptbridge同樣，先在plist文件配置，對外暴露的oc接口須要實現指定的協議。 
demo:https://github.com/HZQuan/WebViewJavaScriptCoreBridge