在Swift中使用JavaScript的方法和技巧

JavaScript函数调用

　　了解了从JavaScript环境中获取不同值以及调用函数的方法，那么反过来，如何在JavaScript环境中获取Objective-C或者Swift定义的自定义对象和方法呢？要从JSContext中获取本地客户端代码，主要有两种途径，分别为Blocks和JSExport协议。

• Blocks （块）

在JSContext中，如果Objective-C代码块赋值为一个标识符，JavaScriptCore就会自动将其封装在JavaScript函数中，因而在JavaScript上使用Foundation和Cocoa类就更方便些——这再次验证了JavaScriptCore强大的衔接作用。现在CFStringTransform也能在JavaScript上使用了，如下所示：

[cpp] view plaincopy

1. //Objective-C  
2. context[@"simplifyString"] = ^(NSString *input) {  
3.    NSMutableString *mutableString = [input mutableCopy];  
4.    CFStringTransform((__bridge CFMutableStringRef)mutableString, NULL, kCFStringTransformToLatin, NO);  
5.    CFStringTransform((__bridge CFMutableStringRef)mutableString, NULL, kCFStringTransformStripCombiningMarks, NO);  
6.    return mutableString;  
7. };  
8. NSLog(@"%@", [context evaluateScript:@"simplifyString('안녕하새요!')"]);  

[cpp] view plaincopy

1. //Swift  
2. let simplifyString: @objc_block String -> String = { input in  
3.     var mutableString = NSMutableString(string: input) as CFMutableStringRef  
4.     CFStringTransform(mutableString, nil, kCFStringTransformToLatin, Boolean(0))  
5.     CFStringTransform(mutableString, nil, kCFStringTransformStripCombiningMarks, Boolean(0))  
6.     return mutableString  
7. }  
8. context.setObject(unsafeBitCast(simplifyString, AnyObject.self), forKeyedSubscript: "simplifyString")  
9.   
10. println(context.evaluateScript("simplifyString('안녕하새요!')"))  
11. // annyeonghasaeyo!  

• 内存管理（Memory Management）

　　代码块可以捕获变量引用，而JSContext所有变量的强引用都保留在JSContext中，所以要注意避免循环强引用问题。另外，也不要在代码块中捕获JSContext或任何JSValues，建议使用[JSContext currentContext]来获取当前的Context对象，根据具体需求将值当做参数传入block中。

• JSExport协议

　　借助JSExport协议也可以在JavaScript上使用自定义对象。在JSExport协议中声明的实例方法、类方法，不论属性，都能自动与JavaScrip交互。文章稍后将介绍具体的实践过程。

JavaScriptCore实践

　　我们可以通过一些例子更好地了解上述技巧的使用方法。先定义一个遵循JSExport子协议PersonJSExport的Person model，再用JavaScript在JSON中创建和填入实例。有整个JVM，还要NSJSONSerialization干什么？

• PersonJSExports和Person

　　Person类执行的PersonJSExports协议具体规定了可用的JavaScript属性。，在创建时，类方法必不可少，因为JavaScriptCore并不适用于初始化转换，我们不能像对待原生的JavaScript类型那样使用var person = new Person()。

[cpp] view plaincopy

1. //Objective-C  
2. // in Person.h -----------------  
3. @class Person;  
4. @protocol PersonJSExports <JSExport>  
5.     @property (nonatomic, copy) NSString *firstName;  
6.     @property (nonatomic, copy) NSString *lastName;  
7.     @property NSInteger ageToday;  
8.     - (NSString *)getFullName;  
9.     // create and return a new Person instance with `firstName` and `lastName`  
10.     + (instancetype)createWithFirstName:(NSString *)firstName lastName:(NSString *)lastName;  
11. @end  
12. @interface Person : NSObject <PersonJSExports>  
13.     @property (nonatomic, copy) NSString *firstName;  
14.     @property (nonatomic, copy) NSString *lastName;  
15.     @property NSInteger ageToday;  
16. @end  
17. // in Person.m -----------------  
18. @implementation Person  
19. - (NSString *)getFullName {  
20.     return [NSString stringWithFormat:@"%@ %@", self.firstName, self.lastName];  
21. }  
22. + (instancetype) createWithFirstName:(NSString *)firstName lastName:(NSString *)lastName {  
23.     Person *person = [[Person alloc] init];  
24.     person.firstName = firstName;  
25.     person.lastName = lastName;  
26.     return person;  
27. }  
28. @end  

[cpp] view plaincopy

1. //Swift  
2. // Custom protocol must be declared with `@objc`  
3. @objc protocol PersonJSExports : JSExport {  
4.     var firstName: String { get set }  
5.     var lastName: String { get set }  
6.     var birthYear: NSNumber? { get set }  
7.     func getFullName() -> String  
8.     /// create and return a new Person instance with `firstName` and `lastName`  
9.     class func createWithFirstName(firstName: String, lastName: String) -> Person  
10. }  
11. // Custom class must inherit from `NSObject`  
12. @objc class Person : NSObject, PersonJSExports {  
13.     // properties must be declared as `dynamic`  
14.     dynamic var firstName: String  
15.     dynamic var lastName: String  
16.     dynamic var birthYear: NSNumber?  
17.     init(firstName: String, lastName: String) {  
18.         self.firstName = firstName  
19.         self.lastName = lastName  
20.     }  
21.     class func createWithFirstName(firstName: String, lastName: String) -> Person {  
22.         return Person(firstName: firstName, lastName: lastName)  
23.     }  
24.     func getFullName() -> String {  
25.         return "\(firstName) \(lastName)"  
26.     }  
27. }  

• 配置JSContext

创建Person类之后，需要先将其导出到JavaScript环境中去，同时还需导入Mustache JS库，以便对Person对象应用模板。

[cpp] view plaincopy

1. //Objective-C  
2. // export Person class  
3. context[@"Person"] = [Person class];  
4. // load Mustache.js  
5. NSString *mustacheJSString = [NSString stringWithContentsOfFile:... encoding:NSUTF8StringEncoding error:nil];  
6. [context evaluateScript:mustacheJSString];  

[cpp] view plaincopy

1. //Swift  
2. // export Person class  
3. context.setObject(Person.self, forKeyedSubscript: "Person")  
4. // load Mustache.js  
5. if let mustacheJSString = String(contentsOfFile:..., encoding:NSUTF8StringEncoding, error:nil) {  
6.     context.evaluateScript(mustacheJSString)  
7. }  

• JavaScript数据&处理

以下简单列出一个JSON范例，以及用JSON来创建新Person实例。

注意：JavaScriptCore实现了Objective-C/Swift的方法名和JavaScript代码交互。因为JavaScript没有命名好的参数，任何额外的参数名称都采取驼峰命名法（Camel-Case），并附加到函数名称上。在此示例中，Objective-C的方法createWithFirstName:lastName:在JavaScript中则变成了createWithFirstNameLastName()。

[js] view plaincopy

1. //JSON  
2. [  
3.     { "first": "Grace",     "last": "Hopper",   "year": 1906 },  
4.     { "first": "Ada",       "last": "Lovelace", "year": 1815 },  
5.     { "first": "Margaret",  "last": "Hamilton", "year": 1936 }  
6. ]  

[js] view plaincopy

1. //JavaScript  
2. var loadPeopleFromJSON = function(jsonString) {  
3.     var data = JSON.parse(jsonString);  
4.     var people = [];  
5.     for (i = 0; i < data.length; i++) {  
6.         var person = Person.createWithFirstNameLastName(data[i].first, data[i].last);  
7.         person.birthYear = data[i].year;  
8.         people.push(person);  
9.     }  
10.     return people;  
11. }  

• 动手一试

现在你只需加载JSON数据，并在JSContext中调用，将其解析到Person对象数组中，再用Mustache模板渲染即可：

[cpp] view plaincopy

1. //Objective-C  
2. // get JSON string  
3. NSString *peopleJSON = [NSString stringWithContentsOfFile:... encoding:NSUTF8StringEncoding error:nil];  
4. // get load function  
5. JSValue *load = context[@"loadPeopleFromJSON"];  
6. // call with JSON and convert to an NSArray  
7. JSValue *loadResult = [load callWithArguments:@[peopleJSON]];  
8. NSArray *people = [loadResult toArray];  
9. // get rendering function and create template  
10. JSValue *mustacheRender = context[@"Mustache"][@"render"];  
11. NSString *template = @"{{getFullName}}, born {{birthYear}}";  
12. // loop through people and render Person object as string  
13. for (Person *person in people) {  
14.    NSLog(@"%@", [mustacheRender callWithArguments:@[template, person]]);  
15. }  
16. // Output:  
17. // Grace Hopper, born 1906  
18. // Ada Lovelace, born 1815  
19. // Margaret Hamilton, born 1936  

[cpp] view plaincopy

1. //Swift  
2. // get JSON string  
3. if let peopleJSON = NSString(contentsOfFile:..., encoding: NSUTF8StringEncoding, error: nil) {  
4.     // get load function  
5.     let load = context.objectForKeyedSubscript("loadPeopleFromJSON")  
6.     // call with JSON and convert to an array of `Person`  
7.     if let people = load.callWithArguments([peopleJSON]).toArray() as? [Person] {  
8.   
9.         // get rendering function and create template  
10.         let mustacheRender = context.objectForKeyedSubscript("Mustache").objectForKeyedSubscript("render")  
11.         let template = "{{getFullName}}, born {{birthYear}}"  
12.   
13.         // loop through people and render Person object as string  
14.         for person in people {  
15.             println(mustacheRender.callWithArguments([template, person]))  
16.         }  
17.     }  
18. }  
19. // Output:  
20. // Grace Hopper, born 1906  
21. // Ada Lovelace, born 1815  
22. // Margaret Hamilton, born 1936  

（编译/张新慧）

文章来源：NSHipster