首先简单介绍一下JSPatch:
对于iOS已经上线的应用，如果有什么bug，或者需要更新，开发者不得不重新上线一个新的版本，等待苹果审核通过之后，才能将项目更新。Objective-C是动态语言，具有运行时特性，该特性可通过类名称和方法名的字符串获取该类和该方法，并实例化和调用。JSPatch通过JavaScript文件，动态植入代码来替换旧代码。此文章是在swift3中使用JSPatch。
第一步
在项目中使用cocoapods pod 'JSPatch'导入JSPatch
在AppDelegate.swift中的didFinishLaunchingWithOptions方法中调用
//开启JSPatch
1. JPEngine.start()
2. let sourcePath = Bundle.main.path(forResource: "jsDemo", ofType: "js")
3. let script = try?String.init(contentsOfFile: sourcePath!, encoding: String.Encoding.utf8)
4. if script != nil{
5. JPEngine.evaluateScript(script)
6. }
第一行代码表示JPEngine类开始配置默认数据；第二行代码表示加载工程中名为jsDemo.js的文件，这个文件是我们使用JavaScript编写的代码，后面会介绍到；第五行代码是JSPatch开始读取并执行JavaScript文件中的内容。
以上是本地加载JS文件，网络加载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];
}];
第二步
在工程中创建一个jsDemo.js的文件，接下来我们要开始在js文件中，使用JavaScript语法创建OC代码了。JSPatch基础语法，JSPatch是开源项目，有兴趣的朋友，可以去GitHub上查看相关文件。
现在工程中的ViewController中只有一个UITableView，如下代码：
let myTableView = UITableView()
var dataSource = [String]()
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.white
for i in 0...10 {
dataSource.append("\(i+1)元素")
}
self.myTableView.delegate = self
self.myTableView.dataSource = self
self.myTableView.frame = self.view.bounds
self.view.addSubview(self.myTableView)
}
//MARK:UITableView代理方法
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.dataSource.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "idetifier") ?? UITableViewCell.init(style: .default, reuseIdentifier: "idetifier")
cell.textLabel?.text = self.dataSource[indexPath.row]
return cell
}
运行结果，如下图：
上面代码运行结果.png
一个很简单的UITableView，并添加了11个cell。现在我们要做的是修改UITableView的起始y坐标为20，并且数据长度变为5。
JS代码如下：
defineClass("ChartAndDate.ViewController",{
viewDidLoad:function(){
self.super().viewDidLoad();
var newArray = require('NSMutableArray').alloc().init();
for (var i=0;i<10;i++){
var str = "第" + (i + 1) + "个JS元素"
// console.log(typeof str) 打印str类型
newArray.addObject(str);
}
self.setDataSource(newArray);
self.myTableView().setDelegate(self);
self.myTableView().setDataSource(self);
var width = self.view().bounds().width;
var height = self.view().bounds().height - 20;
self.myTableView().setFrame({x:0, y:20, width:width, height:height});
self.view().addSubview(self.myTableView());
console.log("js脚本替换viewDidLoad方法");
},
//UITableView代理方法
tableView_numberOfRowsInSection:function(tableView,section){
console.log("js脚本替换numberOfRows方法");
return self.dataSource().count() - 5;
},
tableView_cellForRowAtIndexPath:function(tableView,indexPath){
var cell = tableView.dequeueReusableCellWithIdentifier("identifier");
if (!cell){
require('UITableViewCell')
cell = UITableViewCell.alloc().initWithStyle_reuseIdentifier(0,"identifier");
}
cell.textLabel().setText(self.dataSource().objectAtIndex(indexPath.row()));
console.log("js脚本替换cellForRowAtIndexPath方法");
return cell;
},
tableView_didSelectRowAtIndexPath:function(tableView,indexPath){
console.log("执行JS中的didSelect方法 ," + indexPath.row() + "个数");
}
})
上面的JS代码看上去是不是和swift很类似呢。我们来解释一下上面的JS代码用到了哪些JSPatch语法：
- defineClass(classDeclaration, ['propertiesA,propertiesB'] instanceMethods, classMethods)
@param classDeclaration: 字符串，类名/父类名和Protocol
@param properties: 新增property，字符串数组，可省略
@param instanceMethods: 要添加或覆盖的实例方法
@param classMethods: 要添加或覆盖的类方法
在swift中，如果要使用某个swift类，必须要用: 项目名.类名 这种方式。
- 在JS中使用OC或者swift中系统提供的类时，需要提前声明，声明方式为：
require('UIColor');
注意：如果是使用自定义类，并且该类是swift语法生成的，在初始化时一定要如下使用：
require('ChartAndDate.Person').alloc().init();
我们自定义的类如果采用以下方式初始化，则会报错；如果是系统提供的类，则可以采用此方式
require('ChartAndDate.Person');
Person.alloc().init(); //Person是自定义的swift类，此写法不行
require('NSMutableArray');
NSMutableArray.alloc().init();//NSMutableArray是系统提供的类，此写法OK
- 在JS文件中，如果要用到swift或者OC中类的属性，必须要加小括号( ) 。比如在ViewController类中设置view的背景颜色时，要这样写：
self.view().setBackgroundColor(UIColor.redColor());
- 使用swift中的数组时，对数组赋值和取值，都要使用OC中数组的方法，swift中的append方法不行。
newArray.addObject(str);//使用addObject方法，而不是append
self.dataSource().objectAtIndex(indexPath.row())
- 在JS中调用swift中的方法时，将以下swift方法在JS中调用：
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
//swift中的方法
}
tableView_didSelectRowAtIndexPath:function(tableView,indexPath){
//JS中使用：这里的方法一定要用OC中的方法全名，swift中的方法简写名不行
}
- 在swift3中很多方法都已经简写了，但是在JS文件中调用方法时，必须使用方法全名，这里提供一个方法，可以用来获取类的所有属性名和方法名，具体可以参考Swift Runtime分析：还像OC Runtime一样吗？
//调用：showClsRuntime(UITableViewCell.self)
func showClsRuntime(cls:AnyClass){
var methodNum:UInt32 = 0
let methodList = class_copyMethodList(cls, &methodNum)
for index in 0..<numericCast(methodNum) {
let method:Method = methodList![index]!
// print(String.init(cString: method_getTypeEncoding(method)))
print("类名" + String.init(describing: method_getName(method)))
}
var properyNum:UInt32 = 0
let properyList = class_copyPropertyList(cls, &properyNum)
for index in 0..<numericCast(properyNum) {
let property:objc_property_t = properyList![index]!
print("属性名" + String.init(cString: property_getName(property)))
// print(String.init(cString: property_getAttributes(property)))
}
}
我们来看看现在使用JS文件修改后的效果：
修改后的效果.png
UITableView的起始y轴高度从20开始，cell个数也变成了只有5个。当然细心的读者可能发现了，在原代码中并没有实现UITableView的didSelectRowAtIndexPath方法，而在JS文件中确使用了这个方法。是的，JS文件中动态的给UITableView添加了一个点击cell时触发的代理方法。这时，我们点击cell时，控制台输出：
控制台输出.png
现在来将难度加大一些：给ViewController类动态添加一个数据源数组，并且数据源中存储的是自定义类，在cell上显示这个类的信息，并在点击cell时，使用block回调。
创建两个自定义类，第一个类叫Person，第二个类叫Pet。创建一个classDemo.js的文件，现在的我们工程文件结构如下：
工程文件结构.png
将AppDelegate中调用的JS文件名更改为classDemo.js，现在来看看我们创建的两个类
Person类.png
Pet类.png
自定义的UITableViewCell方法如下：
PersonTableViewCell.png
JS文件内容如下
//添加一个source数组的成员变量，类型为[Person]()的数组，点击cell时，调用pet的方法
require('NSString,UIAlertController,UIAlertAction')
defineClass("ChartAndDate.ViewController",['source'],{
addNewMethod:function(){
//添加第一个Person
var person = require('ChartAndDate.Person').alloc().init();
person.setName("李铭")
var dog = require('ChartAndDate.Pet').alloc().init();
dog.setPetName("金毛")
person.setPet(dog);
//添加第二个Person
var person2 = require('ChartAndDate.Person').alloc().init();
person2.setName("张桦");
var dog2 = require('ChartAndDate.Pet').alloc().init();
dog2.setPetName("德牧");
person2.setPet(dog2);
//给数组赋值
self.setSource([person,person2]);
//注意：在js中创建的数组，长度用length ，count()无效
console.log("数组长度=",self.source().length);
return self;
},
viewDidLoad:function(){
self.super().viewDidLoad();
self.view().setBackgroundColor(require('UIColor').whiteColor());
self.myTableView().setDelegate(self);
self.myTableView().setDataSource(self);
self.myTableView().setFrame({x:0,y:20,width:self.view().bounds().width,height:self.view().bounds().height-20});
self.view().addSubview(self.myTableView());
self.addNewMethod();
},
tableView_numberOfRowsInSection:function(tableView,section){
return self.source().length;
},
tableView_cellForRowAtIndexPath:function(tableView,indexPath){
var cell = tableView.dequeueReusableCellWithIdentifier("identifier");
if (!cell){
//注意：纯swift类，使用时，写法：require('ChartAndDate.PersonTableViewCell')
//强调：纯swift类，即使用 require('ChartAndDate.PersonTableViewCell')声明后，再用类名初始化也不行，必须像下面这样声明初始化👇
cell = require('ChartAndDate.PersonTableViewCell').alloc().initWithStyle_reuseIdentifier(3,"identifier");
}
//注意：js数组取值 ：数组名()[下标] ，数组名().objectAtIndex(下标)是OC数组取值
//这里特别注意：cell在调用ValuesForLabel方法时，一直报unrecognized selector setValuesForLabel这个错误，当时一再确定方法名没有写错，后来用showClsRuntime方法打印方法名才发现，swift中自动将类名转为了valuesForLabelWithPerson，所以大家使用swift方法时，注意一下
cell.setValuesForLabelWithPerson(self.source()[indexPath.row()]);
cell.setSelectionStyle(0);
var weakSelf = __weak(self) //__strong(self)
//注意：这里的参数类型，如果是类，则要加*号，否则person表示地址，*person才表示取值
//块为属性时，也需要用set方法
cell.setTalk(block("ChartAndDate.Person *",function(person){
var talkContetn = NSString.stringWithFormat("%@对%@说：你好！",person.name(),person.pet().petName());
//弹框提示
var alert = UIAlertController.alertControllerWithTitle_message_preferredStyle("提示",talkContetn,1);
var action = UIAlertAction.actionWithTitle_style_handler("好",2,null);
alert.addAction(action);
weakSelf.presentViewController_animated_completion(alert,true,null);
}))
return cell;
}
})
要注意的地方，已经在JS文件中注释出来了，来看下运行结果吧
运行结果.png
此时点击"宠物说话"的按钮效果：
block回调.png
最后，附上demo的github地址，如果有什么疑问的地方，留言给我，我会及时回复。如有错误，虚心请教。
