The This mechanism in RN

1:4 kinds of binding rules

Precedence from highest to lowest order
1:new binding

var o = {
    m:function () {return this
        ;
    }
}
var obj = new o.m ();//obj for the newly generated object
console.log (obj,obj = = O);//{} false
Console.log (obj.constructor = = O.M);/ True

2: Show Bindings
Implement with Call apply Bind

var a = 0;
function foo () {
    console.log (THIS.A);
}
var obj1 = {
    a:1
};
var obj2 = {
    a:2
};
Foo.call (obj1);//1
Foo.call (obj2);//2

3: Implicit binding

function foo () {
    console.log (THIS.A);
};
var obj1 = {
    a:1,
    foo:foo,
}
the direct object of the//foo () function is obj1,this implicitly bound to Obj1 Obj1.foo
();//1

4: Default Bindings

Although the test () function is nested within the Obj.foo () function, the test () function is a stand-alone call, not a method call. So this is bound to window
var a = 0 by default;
var obj = {
    a:2,
    foo:function () {
            function test () {
                console.log (THIS.A);
            }
            Test ();
    }
}
Obj.foo ();//0

Two: arrow function binding

The binding rule for the arrow function is only relevant to the scope, and the arrow function inherits the this binding of the outer function call Three: function nesting

internal and external functions in a function nesting are independent calls without this inheritance relationship,
Method nested internal methods inherit the this point of the external function.

Function F3 () {Console.log (' F3 this ', this);//Global Object} Export default class Page1 extends Component {constructor (p
    Rops) {super (props);
        The test= () =>{//arrow function points internally to Page1 class Console.log (' Test this ', this); Let obj={f1:function () {console.log ("obj F1 this", this);//point to obj function
                F () {Console.log (' obj f this ', this);   } f ();
                The nested function does not exist the inheritance internal F and external F1 are independent of each other so the internal F global Object external F1 points to the Obj object F3 (); The inheritance of this is not present in the inline function, so the F3 is called the Global object This.f2 (); A method's nesting is an internal method that can inherit this, which can inherit this from an external method, F2:function () {console.log ("obj F2 this"
    , this)}} obj.foo ();

    };
        Test2 () {//Not the arrow function points to the object that calls it here for the touch component Console.log (' Test2 this ', this);
    This.countdown ()//Error} countdown () {Console.log (' Countdown this ', this);
 } render () {       Return (<view style={styles.container}> <touchableopacity Style={styles.touch
                        Style} activeopacity={0.7} onpress={this.test}> <view style={styles.viewstyle}>
                    <text Style={{fontsize:font (39/2), backgroundcolor: ' Transparent ', textAlign: ' Center '}}>test</text> </View> </TouchableOpacity> <touchableopacity Style={styl
                        Es.touchstyle} activeopacity={0.7} onpress={this.test2}> <view style={styles.viewstyle}> <text Style={{fontsize:font (39/2), backgroundcolor: ' Transparent ', textAlign: ' Center '}}>test2 This means To touch Components </Text> </View> </TouchableOpacity> </view&gt
        ;
 )
    }

Reference: http://www.cnblogs.com/xiaohuochai/p/5735901.html