From e0a0bb1857eb2673f5d55bf0b80512a30f6f9b88 Mon Sep 17 00:00:00 2001 From: Christopher Chedeau Date: Wed, 8 Apr 2015 10:56:20 -0700 Subject: [PATCH] Create JavaScriptEnvironment.md --- docs/JavaScriptEnvironment.md | 33 +++++++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) create mode 100644 docs/JavaScriptEnvironment.md diff --git a/docs/JavaScriptEnvironment.md b/docs/JavaScriptEnvironment.md new file mode 100644 index 000000000..4d366d60a --- /dev/null +++ b/docs/JavaScriptEnvironment.md @@ -0,0 +1,33 @@ + +## JavaScript Runtime + +When using React Native, you're going to be running your JavaScript code in two environments: + +* In the simulator and on the phone: [JavaScriptCore](http://trac.webkit.org/wiki/JavaScriptCore) which is the JavaScript engine that powers Safari and web views. Due to the absence of writable executable memory in iOS apps, it doesn't run with JIT. +* When using Chrome debugging, it runs all the JavaScript code within Chrome itself and communicate with the obj-c via WebSocket. So you are using [V8](https://code.google.com/p/v8/). + +While both environments are very similar, you may end up hitting some inconsistencies. We're likely going to experiment with other JS engines in the future, so it's best to avoid relying on specifics of any runtime. + + +## JavaScript Transforms + +React Native ships with many JavaScript transforms to make writing code more enjoyable. If you are curious, you can see the [implementation of all those transformations](https://github.com/facebook/jstransform/tree/master/visitors). Here's the full list: + +ES5 +* Reserved Words: `promise.catch(function() { });` + +ES6 +* Arrow function: ` { this.setState({pressed: true}); }}` +* Call spread: `Math.max(...array);` +* Class: `class MyComponent extends React.Component { render() { return ; } }` +* Destructuring: `var {isActive, style} = this.props;` +* Iteration: `for (var element of array) { }` +* Computed Properties: `var key = 'abc'; var obj = {[key]: 10};` +* Object Consise Method: `var obj = { method() { return 10; } };` +* Object Short Notation: `var name = 'vjeux'; var obj = { name };` +* Rest Params: `function(type, ...args) { }` +* Template: ``var who = 'world'; var str = `Hello ${who}`;`` + +ES7 +* Object Spread: `var extended = { ...obj, a: 10 };` +* Function Trailing Comma: `function f(a, b, c,) { }`