JSPatch - 基本使用和学习

[JPEngine startEngine];

// 直接执行js
[JPEngine evaluateScript:@" var alertView = require(‘UIAlertView‘).alloc().init(); alertView.setTitle(‘Alert‘); alertView.setMessage(‘AlertView from js‘);  alertView.addButtonWithTitle(‘OK‘); alertView.show(); "];

// 从网络拉回js脚本执行(实现热修复的关键)
[NSURLConnection sendAsynchronousRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://cnbang.net/test.js"]] queue:[NSOperationQueue mainQueue] completionHandler:^(NSURLResponse *response, NSData *data, NSError *connectionError) {
    NSString *script = [[NSString alloc] initWithData:data encoding:NSUTF8StringEncoding];
    [JPEngine evaluateScript:script];
}];

// 执行本地js文件
NSString *sourcePath = [[NSBundle mainBundle] pathForResource:@"sample" ofType:@"js"];
NSString *script = [NSString stringWithContentsOfFile:sourcePath encoding:NSUTF8StringEncoding error:nil];
[JPEngine evaluateScript:script];

// 调用require引入要使用的OC类
require(‘UIView, UIColor, UISlider, NSIndexPath‘)

// 调用类方法
var redColor = UIColor.redColor();

// 调用实例方法
var view = UIView.alloc().init();
view.setNeedsLayout();

// set proerty
view.setBackgroundColor(redColor);

// get property 
var bgColor = view.backgroundColor();

// 多参数方法名用‘_‘隔开：
// OC：NSIndexPath *indexPath = [NSIndexPath indexPathForRow:0 inSection:1];
var indexPath = NSIndexPath.indexPathForRow_inSection(0, 1);

// 方法名包含下划线‘_‘，js用双下划线表示
// OC: [JPObject _privateMethod];
JPObject.__privateMethod()

// 如果要把 `NSArray` / `NSString` / `NSDictionary` 转为对应的 JS 类型，使用 `.toJS()` 接口.
var arr = require(‘NSMutableArray‘).alloc().init()
arr.addObject("JS")
jsArr = arr.toJS()
console.log(jsArr.push("Patch").join(‘‘))  //output: JSPatch

// 在JS用字典的方式表示 CGRect / CGSize / CGPoint / NSRange
var view = UIView.alloc().initWithFrame({x:20, y:20, width:100, height:100});
var x = view.bounds().x;

// block 从 JavaScript 传入 Objective-C 时，需要写上每个参数的类型。
// OC Method: + (void)request:(void(^)(NSString *content, BOOL success))callback
require(‘JPObject‘).request(block("NSString *, BOOL", function(ctn, succ) {
  if (succ) log(ctn)
}));

// GCD
dispatch_after(function(1.0, function(){
  // do something
}))
dispatch_async_main(function(){
  // do something
})

//  AppDelegate.m

#import "AppDelegate.h"
#import "HBJSPatchMainViewController.h"
#import "JPEngine.h"
@interface AppDelegate ()

@end

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    [JPEngine startEngine];  //启动引擎
    NSString *sourcePath = [[NSBundle mainBundle] pathForResource:@"demo" ofType:@"js"];
    NSString *script = [NSString stringWithContentsOfFile:sourcePath encoding:NSUTF8StringEncoding error:nil];   //从本地读取JS
    [JPEngine evaluateScript:script];   //执行JS语句
    
    self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
    self.window.rootViewController = [[UINavigationController alloc]initWithRootViewController:[[HBJSPatchMainViewController alloc ]init]];
    [self.window makeKeyAndVisible];
    
    return YES;
}
@end

//  ViewController.m

#import "HBJSPatchMainViewController.h"

@interface HBJSPatchMainViewController ()

@end

@implementation HBJSPatchMainViewController

- (void)viewDidLoad {
    [super viewDidLoad];
![Uploading JSPatch_353937.gif . . .]

    UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
    button.frame = CGRectMake(0, 0, 200, 50);
    button.center = self.view.center;
    button.backgroundColor = [UIColor orangeColor];
    [button setTitle:@"进入JS生成的UI界面" forState:UIControlStateNormal];
    [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    [button addTarget:self action:@selector(buttonTouch:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:button];
    self.view.backgroundColor = [UIColor blueColor];
    
}

- (void)buttonTouch:(UIButton *)button {

    //    触发的方法在demo.JS中
}
@end


//  HBJSPatchTsetViewController.m

#import "HBJSPatchTsetViewController.h"

@interface HBJSPatchTsetViewController ()

@end

@implementation HBJSPatchTsetViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    UILabel *lable = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 100, 30)];
    lable.center = self.view.center;
    lable.textAlignment = NSTextAlignmentCenter;
    lable.text = @"JS到原生UI";
    [self.view addSubview:lable];
    self.view.backgroundColor = [UIColor whiteColor];
    
}

@end
//demo.js文件

//按钮事件
defineClass(‘HBJSPatchMainViewController‘, {//寻址到哪个类中的
            buttonTouch: function(button) {//改写类中的方法
            //跳转到tableView
            var tableViewCtrl = HBTableViewController.alloc().init()
            self.navigationController().pushViewController_animated(tableViewCtrl, YES)
            }
})

defineClass(‘HBTableViewController : UITableViewController‘, {  //创建类并实现类中的方法
            dataSource: function() {
            //JSPatch可以通过 -getProp:， -setProp:forKey: 这两个方法给对象动态添加成员变量。
            var data = self.getProp(‘data‘)
            if (data) return data;
            var data = [];
            for (var i = 0; i < 20; i ++) {
            data.push("通过JS创建的Cell" + i);
            }
            self.setProp_forKey(data, ‘data‘)
            return data;
            },
            numberOfSectionsInTableView: function(tableView) {
            return 1;
            },
            tableView_numberOfRowsInSection: function(tableView, section) {
            return self.dataSource().count();
            },
            tableView_cellForRowAtIndexPath: function(tableView, indexPath) {
            var cell = tableView.dequeueReusableCellWithIdentifier("cell")
            if (!cell) {
            cell = require(‘UITableViewCell‘).alloc().initWithStyle_reuseIdentifier(0, "cell")
            }
            cell.textLabel().setText(self.dataSource().objectAtIndex(indexPath.row()))
            return cell
            },
            tableView_heightForRowAtIndexPath: function(tableView, indexPath) {
            return 60
            },
            tableView_didSelectRowAtIndexPath: function(tableView, indexPath) {
            
            //跳转到原生UI
            var testViewController = require(‘HBJSPatchTsetViewController‘).alloc().init()
            self.navigationController().pushViewController_animated(testViewController, YES)
            },
})