Maison > interface Web > js tutoriel > le corps du texte

Explication détaillée d'exemples d'intermodulation entre JS et OC

零下一度
Libérer: 2017-05-10 11:06:10
original
1594 Les gens l'ont consulté

1. JavaScriptClasses de base couramment utilisées

Fonction JavaScriptCore : JavaScriptCore est l'API native d'Apple, utilisée pour JS et OC interactif.

JSContext : environnement d'exécution JS, utilisez-le pour exécuter du code JS et utilisez-le pour obtenir des données en JS

JSValue : utilisé pour recevoir le type de données obtenu en JS, qui peut être n'importe quel objet , méthode.

2. OC appelle JS

Essence : les variables et les méthodes ont été définies dans le code JS, obtenez-les via OC et appelez

Étapes :

1. Créer un environnement d'exécution JS

2. Exécuter le code JS

3. Obtenir les données JS (variables, méthodes)

4. Utiliser les données JS, méthodes

2.1 Obtenir les variables définies dans JS

Vous pouvez modifier la valeur des variables dans JS directement via OC

#pragma mark - 获取JS中定义的变量
- (void)getJSVar{
// JS代码
NSString *jsCode = @"var arr = [1,2,3]";
// 创建JS运行环境
JSContext *ctx = [[JSContext alloc] init];
// 执行JS代码
[ctx evaluateScript:jsCode];
// 因为变量直接定义在JS中,所以可以直接通过JSContext获取,根据变量名称获取,相当于字典的Key
// 只有先执行JS代码,才能获取变量
JSValue *jsArr = ctx[@"arr"]; 
  jsArr[0] = @5;
// 打印结果:5,2,3
NSLog(@"%@",jsArr);}
Copier après la connexion

2.2 Obtenir les méthodes définies dans JS, Et appelez

pour réaliser la méthode JS d'appel OC

#pragma mark - OC调用JS
// OC调用JS方法,并获取返回结果
- (void)ocCallJSFunc{
NSString *jsCode =@"function hello(say){"
" return say; "
"}";
// 创建JS运行环境
JSContext *ctx = [[JSContext alloc] init];
// 因为方法直接定义在JS中,所以可以直接通过JSContext获取,根据方法名称获取,相当于字典的Key
// 执行JS代码
[ctx evaluateScript:jsCode];
// 获取JS方法,只有先执行JS代码,才能获取
JSValue *hello = ctx[@"hello"];
// OC调用JS方法,获取方法返回值
JSValue *result = [hello callWithArguments:@[@"你好"]];
// 打印结果:你好
NSLog(@"%@",result);
}
Copier après la connexion

3. L'essence du bloc d'appel JS

dans OC : cela n'existe pas dans JS au début du bloc OC, vous ne pouvez donc pas appeler directement le bloc OC. Vous devez générer la méthode de bloc OC dans JS, puis l'appeler via JS.

Étapes :

1. Créez un environnement d'exécution JS

2. Générez le code OC correspondant dans JS

3. La méthode de bloc générée dans l'environnement peut être appelée dans le bloc d'OC.

3.1 JS appelle le bloc sans paramètres dans OC

Vous voulez appeler le bloc sans paramètres dans OC via JS

#pragma mark - JS调用OC中不带参数的block
- (void)jsCallOCBlock1WithNoneArguments{
// 创建JS运行环境
JSContext *ctx = [[JSContext alloc] init];
// JS调用Block方式// 由于JS本身没有OC这个代码,需要给JS中赋值,就会自动生成右边的代码.
// 相当于在JS中定义一个叫eat的方法,eat的实现就是block中的实现,只要调用eat,就会调用block
ctx[@"eat"] = ^(){NSLog(@"吃东西"); 
  };
// JS执行代码,就会直接调用到block中
NSString*jsCode =@"eat()"; 
  [ctx evaluateScript:jsCode];}
Copier après la connexion

3.2 JS appelle un bloc avec des paramètres en OC

Je souhaite appeler un bloc avec des paramètres en OC via JS

- (void)jsCallOCBlockWithArguments{
// 创建JS运行环境
JSContext *ctx = [[JSContext alloc] init];
// 2.调用带有参数的block
// 还是一样的写法,会在JS中生成eat方法,只不过通过[JSContext currentArguments]获取JS执行方法时的参数
ctx[@"eat"] = ^(){
// 获取JS调用参数
NSArray *arguments = [JSContext currentArguments];
NSLog(@"吃%@",arguments[0]); 
  };
// JS执行代码,调用eat方法,并传入参数面包
NSString*jsCode =@"eat('面包')"; 
  [ctx evaluateScript:jsCode];
}
Copier après la connexion

4. JS appelle les classes dans OC

Essence : il n'y a pas de classes OC dans JS au début. Vous devez d'abord générer des classes OC dans JS, puis les appeler via JS.

Étapes

1. La classe OC doit être conforme au protocole JSExport, JS générera cette classe

2. ne suffit pas, il y a des <🎜 dans la classe >Attributs et méthodes, doivent également être générés en JS

3.JSExport lui-même n'a pas ses propres attributs et méthodes, vous devez personnaliser un protocole,

hériterJSExport, dans son propre protocole Exposez les attributs et les méthodes qui doivent être utilisés dans JS

4 De cette façon, votre classe n'a besoin que d'hériter de son propre protocole, et JS générera automatiquement la classe, y compris les attributs et méthodes déclarés dans son propre protocole

4.1 JS appelle la classe personnalisée OC

Protocole personnalisé (PersonJSExport)

@protocolPersonJSExport
@property(nonatomic, strong) NSString *name;
-(void)play;
// 调用多个参数的方法,JS函数命名规则和OC还不一样,很可能调用不到对应的JS生成的函数,为了保证生成的JS函数和OC方法名一致,OC提供了一个宏JSExportAs,用来告诉JS应该生成什么样的函数对应OC的方法,这样就不会调错了。
// PropertyName:JS函数生成的名字
// Selector:OC方法名
// JS就会自动生成playGame这个方法JSExportAs(playGame,
- (void)playWithGame:(NSString *)gametime:(NSString *)time);
@end
Copier après la connexion
Classe personnalisée (Personne)

@interfacePerson: NSObject
@property(nonatomic, strong) NSString *name;
-(void)playWithGame:(NSString*)gametime:(NSString*)time;
@end
@implementationPerson
-(void)play{
NSLog(@"%@玩",_name);
}
-(void)playWithGame:(NSString*)gametime:(NSString*)time{
NSLog(@"%@在%@玩%@",_name,time,game);
}
@end
Copier après la connexion
Appel de classes personnalisées OC via JS

#pragmamark - JS调用OC自定义类
- (void)jsCallOCCustomClass{
// 创建Person对象
Person *p = [[Person alloc] init];   
p.name = @"zs";   
JSContext *ctx = [[JSContext alloc] init];
// 会在JS中生成Person对象,并且拥有所有值
// 前提:Person对象必须遵守JSExport协议,
ctx[@"person"] = p;
// 执行JS代码
// 注意:这里的person一定要跟上面声明的一样,因为生成的对象是用person引用// NSString *jsCode = @"person.play()";
NSString *jsCode = @"person.playGame(&#39;德州扑克&#39;,&#39;晚上&#39;)"; 
  [ctx evaluateScript:jsCode];
}
Copier après la connexion
4.1 JS appelant OC classes système

Problème : Classes fournies avec le système, que devons-nous faire si nous voulons l'appeler via JS Nous ne pouvons pas modifier les fichiers des propres classes du système

Tout comme ? en appelant une classe personnalisée, nous devons également créer un protocole personnalisé pour hériter de JSExport et décrire les attributs qui doivent être exposés (pensez Pour exposer quels attributs de la classe système, déclarez-le dans votre propre protocole)

Ajouter un protocole à la classe via l'exécution

Protocole personnalisé (UILabelJSExport)

@protocolUILabelJSExport
@property(nonatomic, strong) NSString *text;
@end
Copier après la connexion
JS appelle les classes du système OC

#pragma mark - JS调用OC系统类
- (void)jsCallOCSystemClass{ 
  // 给系统类添加协议 class_addProtocol([UILabel class],
@protocol(UILabelJSExport)); 
  // 创建UILabel 
UILabel *label= [[UILabel alloc] initWithFrame:CGRectMake(50, 50, 100, 100)];
[self.view addSubview:label];
JSContext *ctx = [[JSContext alloc] init];   
// 就会在JS中生成label对象,并且用laebl引用
ctx[@"label"] =label;
// 利用JS给label设置文本内容
NSString *jsCode = @"label.text = &#39;Oh Year&#39;"; 
  [ctx evaluateScript:jsCode];
}
Copier après la connexion
[Recommandations associées]

1.

Tutoriel vidéo en ligne js gratuit

2

Manuel de référence en chinois JavaScript

3. .

php.cn Dugu Jiujian (3) - Tutoriel vidéo JavaScript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!