Ios教程網 >> IOS編程開發 >> IOS開發基礎 >> JSPatch基礎用法總結

JSPatch基礎用法總結

編輯：IOS開發基礎

1.打印console.log();

2.Protocol

//OC
可以在定義時讓一個類實現某些 Protocol 接口，寫法跟 OC 一樣:
defineClass("JPViewController: UIViewController", {

})
這樣做的作用是，當添加 Protocol 裡定義的方法，而類裡沒有實現的方法時，參數類型不再全是 id，而是自動轉為 Protocol 裡定義的類型:
@protocol UIAlertViewDelegate 
- (void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex;
@end
//JSPatch
defineClass("JPViewController: UIViewController ", {
  viewDidAppear: function(animated) {
    var alertView = require('UIAlertView')
      .alloc()
      .initWithTitle_message_delegate_cancelButtonTitle_otherButtonTitles(
        "Alert",
        self.dataSource().objectAtIndex(indexPath.row()), 
        self, 
        "OK", 
        null
      )
     alertView.show()
  }
  alertView_clickedButtonAtIndex: function(alertView, buttonIndex) {
    console.log('clicked index ' + buttonIndex)
  }
})

3.Masonry使用JSPatch如何寫約束

1)原來Masonry方法中"_"下劃線的要變成兩個"__"
2)使用block塊包裝
3)make中的方法都需要添加()

//OC
UIView * view = [UIView new];
    view.backgroundColor = [UIColor orangeColor];
    [self.view addSubview:view];

    [view mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.view).with.offset(15);
        make.left.equalTo(self.view).with.offset(10);
        make.right.equalTo(self.view.mas_width);
        make.height.equalTo(@(50));
    }];
//JS
var view = UIView.alloc().init();
             view.setBackgroundColor(UIColor.redColor());
             self.view().addSubview(view);
             console.log("222");
             view.mas__makeConstraints(block('MASConstraintMaker*', function(make) {
                                            make.top().equalTo()(self.view()).with().offset()(15);
                                            make.left().equalTo()(self.view()).with().offset()(10);
                                            make.right().equalTo()(self.view().mas__right());                                            make.height().equalTo()((50));
                                }));

4.常用結構同類方法,不能使用;結尾,需要使用逗號或者什麼都不寫

// JS

defineClass(“類名”, {        

  //實例方法,不同方法之間使用逗號分隔

}, {

  //類方法,不同方法之間使用逗號分隔

})

5.require('UIColor,UIView,NSURL,NSURLRequest,UIFont,UILabel'); 導入頭文件.

6.在方法名前加 ORIG 即可調用未覆蓋前的 OC 原方法:

// OC
@implementation JPTableViewController 
- (void)viewDidLoad {
}
@end
// JS
defineClass("JPTableViewController", {            
viewDidLoad: function() {      
self.ORIGviewDidLoad();      
},     
})

7.動態新增 Property

可以在 defineClass() 第二個參數為類新增 property，格式為字符串數組，使用時與 OC property 接口一致：

defineClass("JPTableViewController", ['data', 'totalCount'], {    
init: function() {  
self = self.super().init()   
self.setData(["a", "b"])     //添加新的 Property (id data)   
self.setTotalCount(2)
return self   
},
viewDidLoad: function() {   
var data = self.data()     //獲取 Property 值   
var totalCount = self.totalCount()
},   
})

8.struct

偏移量和轉字符串

var contentOffSetY = scrollView.contentOffset().y;
var string = NSString.stringWithFormat("%@", contentOffSetY);
JSPatch原生支持 CGRect / CGPoint / CGSize / NSRange 這四個 struct 類型，用 JS 對象表示:
// Obj-C
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 100, 100)];
[view setCenter:CGPointMake(10,10)];
[view sizeThatFits:CGSizeMake(100, 100)];
CGFloat x = view.frame.origin.x;
NSRange range = NSMakeRange(0, 1);
// JS
var view = UIView.alloc().initWithFrame({x:20, y:20, width:100, height:100})
view.setCenter({x: 10, y: 10})
view.sizeThatFits({width: 100, height:100})
var x = view.frame().x   (orign也是一個結構體)
var range = {location: 0, length: 1}

其他 Struct 類型的支持請參照添加 struct 類型支持

9.Selector 注意方法名左右是雙引號 “”

//Obj-C
[self performSelector:@selector(viewWillAppear:) withObject:@(YES)];
//JS
self.performSelector_withObject("viewWillAppear:", 1)

10.nil

JS 上的 null 和 undefined 都代表 OC 的 nil，如果要表示 NSNull, 用 nsnull 代替，如果要表示 NULL, 也用 null 代替:

//Obj-C
@implemention JPTestObject
+ (BOOL)testNull(NSNull *null) {
    return [null isKindOfClass:[NSNull class]]
}
@end
//JS
require('JPTestObject').testNull(nsnull) //return 1
require('JPTestObject').testNull(null) //return 0
在JS裡面判斷是否為空要判斷false:
var url = "";
var rawData = NSData.dataWithContentsOfURL(NSURL.URLWithString(url));
if (rawData != null) {} //這樣判斷是錯誤的
應該如下判斷：
if (!rawData){}
在JSPatch.js源碼裡_formatOCToJS方法對undefined,null,isNil轉換成了false。

11. NSArray / NSString / NSDictionary

如果使用self.dataArray() ==使用get方法所以需要有括號如果直接使用數組 tempArray 不需要括號
NSArray / NSString / NSDictionary 不會自動轉成對應的JS類型，像普通 NSObject 一樣使用它們:

//Obj-C
@implementation JPObject  
+ (NSArray *)data
{  
  return @[[NSMutableString stringWithString:@"JS"]]  
} 
+ (NSMutableDictionary *)dict  
{ 
return [[NSMutableDictionary alloc] init]; 
}  
@end   

// JS  
require('JPObject')
var ocStr = JPObject.data().objectAtIndex(0)    
ocStr.appendString("Patch")  
var dict = JPObject.dict()
dict.setObject_forKey(ocStr, 'name')
console.log(dict.objectForKey('name')) //output: JSPatch
如果要把 NSArray / NSString / NSDictionary 轉為對應的 JS 類型，使用 .toJS() 接口:
// JS
var data = require('JPObject').data().toJS()  
//data instanceof Array === true
data.push("Patch")
var dict = JPObject.dict()
dict.setObject_forKey(data.join(''), 'name')
dict = dict.toJS()
console.log(dict['name'])    //output: JSPatch

12. Block

總結:
1.JS調用OC方法中帶有block的需要轉換成block()格式.
2.使用OC方法,傳入參數為block,JS需要將block()結構
JS 沒有 block 類型的變量，OC 的 block 對象傳到 JS 會變成 JS function，所有要從 JS 傳 block 給 OC 都需要用 block() 接口包裝。
3.若使用 block 時出現 crash，最常見的原因是在 block 裡使用了 self 變量，應該在 JS 聲明另一個變量持有 self，詳情見這裡。

block 傳遞
當要把 JS 函數作為 block 參數給 OC時，需要先使用 block(paramTypes, function) 接口包裝:

// Obj-C  
@implementation JPObject  
+ (void)request:(void(^)(NSString *content, BOOL success))callback
{ 
  callback(@"I'm content", YES); 
} 
@end 
// JS 
require('JPObject').request(block("NSString *, BOOL", function(ctn, succ) { 
  if (succ) log(ctn)  //output: I'm content 
}))

這裡 block 裡的參數類型用字符串表示，寫上這個 block 各個參數的類型，用逗號分隔。NSObject 對象如 NSString , NSArray 等可以用 id 表示，但 block 對象要用 NSBlock* 表示。
從 OC 返回給 JS 的 block 會自動轉為 JS function，直接調用即可:

// Obj-C  
@implementation JPObject 
typedef void (^JSBlock)(NSDictionary *dict); 
+ (JSBlock)genBlock 
{
  NSString *ctn = @"JSPatch"; 
  JSBlock block = ^(NSDictionary *dict) { 
       NSLog(@"I'm %@, version: %@", ctn, dict[@"v"]) 
  }; 
  return block; 
} 
+ (void)execBlock:(JSBlock)blk 
{  
}  
@end
// JS 

var blk = require('JPObject').genBlock();
blk({v: "0.0.1"});  //output: I'm JSPatch, version: 0.0.1

若要把這個從 OC 傳過來的 block 再傳回給 OC，同樣需要再用 block() 包裝，因為這裡 blk 已經是一個普通的 JS function，跟我們上面定義的 JS function 沒有區別：

// JS
var blk = require('JPObject').genBlock(); 

blk({v: "0.0.1"});  //output: I'm JSPatch, version: 0.0.1 

require('JPObject').execBlock(block("id", blk));

總結：JS 沒有 block 類型的變量，OC 的 block 對象傳到 JS 會變成 JS function，所有要從 JS 傳 block 給 OC 都需要用 block() 接口包裝。

block 裡使用 self 變量
在 block 裡無法使用 self 變量，需要在進入 block 之前使用臨時變量保存它:

defineClass("JPViewController", { 
  viewDidLoad: function() { 
    var slf = self; 
    require("JPTestObject").callBlock(block(function(){ 
      //`self` is not available here, use `slf` instead. 
      slf.doSomething(); 
      }); 
  } 
}

限制
從 JS 傳 block 到 OC，有兩個限制：
A. block 參數個數最多支持6個。（若需要支持更多，可以修改源碼）
B. block 參數類型不能是 double / NSBlock / struct 類型。
另外不支持 JS 封裝的 block 傳到 OC 再傳回 JS 去調用（原因見 issue #155）：

- (void)callBlock:(void(^)(NSString *str))block { 
} 
defineClass('JPTestObject', { 
    run: function() {
        self.callBlock(block('NSString*', function(str) {
            console.log(str); 
        })); 
    }, 
    callBlock: function(blk) { 
        //blk 這個 block 是上面的 run 函數裡 JS 傳到 OC 再傳過來的，無法調用。 
        blk("test block");    
    } 
});

常用例子:

//OC 
secondVC.buttonBlock = ^(NSString * string) 
{ 
      NSLog(@"原聲打印: %@",string); 
 }; 
//JS 
 var func = function(string) 
 { 
 console.log(string); 
  };
  //然後setblock 
  block包裝(參數,block塊) 
  secondVC.setButtonBlock(block('NSString*',func));

13.weak / strong

可以在 JS 通過 __weak() 聲明一個 weak 變量，主要用於避免循環引用。
例如我們在 OC 裡為了避免 block 導致的循環引用，經常這樣寫：

- (void)test { 
    _weak id weakSelf = self;
    [self setCompleteBlock:^(){
        [weakSelf blabla];
    }]
}

在 JS 對應的可以這樣寫：

var weakSelf = __weak(self) 
self.setCompleteBlock(block(function(){
    weakSelf.blabla(); 
}))

若要在使用 weakSelf 時把它變成 strong 變量，可以用 __strong() 接口：

var weakSelf = __weak(self)  
self.setCompleteBlock(block(function(){  
    var strongSelf = __strong(weakSelf) 
    strongSelf.blabla();  
}))

14. GCD

使用 dispatch_after() dispatch_async_main() dispatch_sync_main() dispatch_async_global_queue() 接口調用GCD方法:

// Obj-C  
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{  
  // do something
});  
dispatch_async(dispatch_get_main_queue(), ^{  
  // do something  
});  
// JS
dispatch_after(1.0, function(){  
  // do something  
})

dispatch_async_main(function(){  
  // do something  
})  

dispatch_sync_main(function(){  
  // do something  
})

dispatch_async_global_queue(function(){  
  // do something  
})

15. 常量、枚舉、宏、全局變量

常量/枚舉

Objective-C 裡的常量/枚舉不能直接在 JS 上使用，可以直接在 JS 上用具體值代替：

//OC 
[btn addTarget:self action:@selector(handleBtn)   
forControlEvents:UIControlEventTouchUpInside];
//UIControlEventTouchUpInside的值是1<<6  
btn.addTarget_action_forControlEvents(self, "handleBtn", 1<<6);  

或者在 JS 上重新定義同名的全局變量：  
//js  
var UIControlEventTouchUpInside  = 1 << 6;  
btn.addTarget_action_forControlEvents(self, "handleBtn", UIControlEventTouchUpInside);  
有些常量字符串，需要在 OC 用 NSLog 打出看看它的值是什麼：  

//OC  
[[NSAttributedString alloc].initWithString:@"str" attributes:@{NSForegroundColorAttributeName: [UIColor redColor]];  
上面代碼中 NSForegroundColorAttributeName 是一個靜態字符串常量，源碼裡看不出它的值，可以先用 NSLog 打出它的值再直接寫在 JS 上：  

//OC  
NSLog(@"%@", NSForegroundColorAttributeName) //output 'NSColor'
NSAttributedString.alloc().initWithString_attributes("無效啊", {'NSColor': UIColor.redColor()});  
NSFontAttributeName == NSFont
NSParagraphStyleAttributeName == NSParagraphStyle  
NSForegroundColorAttributeName == NSColor  

例子:   
var paragraphStyle = NSMutableParagraphStyle.alloc().init();  
      paragraphStyle.setLineSpacing(2); // 字體的行間距
      paragraphStyle.setAlignment(3);
      paragraphStyle.setLineBreakMode(0);
      var attributes = {
      NSFont: UIFont.systemFontOfSize(20),
      NSParagraphStyle: paragraphStyle,
      NSColor: UIColor.redColor()
      };  
      var attributesString = NSAttributed  String.alloc().initWithString_attributes("我就是測試", attributes);  
      self.contentLabel().setAttributedText(attributesString);

宏

獲取宏值
Objective-C 裡的宏同樣不能直接在 JS 上使用。若定義的宏是一個值，可以在 JS 定義同樣的全局變量代替，若定義的宏是程序，可以在JS展開宏：

#define TABBAR_HEIGHT 40
#define SCREEN_WIDTH [[UIScreen mainScreen] bounds].size.height
[view setWidth:SCREEN_WIDTH height:TABBAR_HEIGHT];
//JS
view.setWidth_height(UIScreen.mainScreen().bounds().height, 40);

若宏的值是某些在底層才能獲取到的值，例如 CGFLOAT_MIN，可以通過在某個類或實例方法裡將它返回，或者用添加擴展的方式提供支持：

@implementation JPMacroSupport
+ (void)main:(JSContext *)context  
{
  context[@"CGFLOAT_MIN"] = ^CGFloat() {  
    return CGFLOAT_MIN;  
  }
}
@end
require('JPEngine').addExtensions(['JPMacroSupport'])  
var floatMin = CGFLOAT_MIN();

修改宏值
JSPatch 不支持修改宏的值，若要修改，需要替換所有使用到這個宏的方法。例如：

#define VIEW_HEIGHT 40
@implementation JPMethodDemo
+ (void)func  
{
  UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, VIEW_HEIGHT)];  
  ...  
}
@end

//JS  
var VIEW_HEIGHT_NEW = 20;
defineClass('JPMethodDemo', {
  func: function() {
      var view = UIView.alloc().initWithFrame({x:0, y:0, width:100, height:VIEW_HEIGHT_NEW});  
      ...  
  } 
});

全局變量
在類裡定義的 static 全局變量無法在 JS 上獲取到，若要在 JS 拿到這個變量，需要在 OC 有類方法或實例方法把它返回：

static NSString *name;
@implementation JPTestObject
+ (NSString *)name {
  return name;
}
@end
var name = JPTestObject.name()  //拿到全局變量值

16.stringWithFormat

JSPatch 支持調用 stringWithFormat，不過所有參數類型都需改為 %@:

//OC
[NSString stringWithFormat:@"name:%@, age:%d", @"alex", 12];
//JS
NSString.stringWithFormat("name:%@, age:%@", "alex", 12);

雖然支持 stringWithFormat，但還是建議使用 JS 語法拼接字符串：

var ret = "name:" + "alex" + " age:(" + 12 + ")";

17.NSNumber 相關問題

NSNumber 與上述四個類型不一樣，所有數值類型以及 NSNumber 對象到 JS 後都會變成數值，不能再調用這個數值的任何方法：

//OC
@implementation JPTestObject
+ (NSNumber *)returnNSNumber {
    return @(42);
}
+ (int)returnInt
{
  return 42;
}
@end
var numFromOC = JPTestObject.returnNumber()
var intFromOC = JPTestObject.returnInt()
var jsNum = 42

//以上三個變量是相等的：
console.log(numFromOC == intFromOC == jsNum) //true

//不能調用 NSNumber 方法：
numFromOC.isEqualToNumber(42);  //crash

//所有數值操作都應該在 JS 語法下操作：
parseInt(numFromOC);
var all = numFromOC + intFromOC + jsNum;

18.for...in

首先從 OC 返回的 NSArray / NSDictionary 對象是不能直接用 for...in 遍歷的，需要調用 .toJS() 後才能進行遍歷，詳情見上文。

然後在遍歷數組時，JavaScript 的 for...in 語法定義與 Objective-C 不同：

//OC
NSArray *arr = @[@"name", @"age"];
for (var o in arr) {
  NSLog(@"%@", o); //輸出 name age
}
var arr = ["name", "age"];
for (var o in arr) {
  console.log(o); //輸出 0, 1，表示遍歷數組的序號
  console.log(arr[o]); //輸出 name age，這樣才表示數組的值
}

18.內存釋放問題

如果一個 OC 對象被 JS 引用，或者在 JS 創建這個對象，這個 OC 對象在退出作用域後不會馬上釋放，而是會等到 JS 垃圾回收時才釋放，這會導致一些 OC 對象延遲釋放：

defineClass('JPTestObject', {
  testObj: function() {
    var view = UIView.alloc().init();
    //函數執行完退出作用域，或者手動把這個變量置為null，這個 OC 對象都不會立即釋放
    //在 JS 沒有變量持有這些對象後，JS 引擎會在垃圾回收時才釋放
    view = null;
  }
});

沒有被 JS 引用過的 OC 對象不受影響。更多討論見 #69

19.dealloc 問題

可以用 JSPatch 為類添加 dealloc 方法，但無法覆蓋原 OC 上的 dealloc 方法，在執行完 JS 的 dealloc 後會自動執行 OC 上的 dealloc 方法，因為若不執行 OC 的 dealloc 方法，對象無法正常釋放，會產生內存洩漏：

@implementation JPViewController
- (void)dealloc {
    NSLog(@"dealloc from OC");
}
@end
defineClass('JPViewController', {
    dealloc: function() {
        console.log('dealloc from JS');
    }
}
會輸出

dealloc from JS
dealloc from OC