with regard to the this direction of the arrow function, I have always used Ruan Yifeng"s big judgment criterion:
:
:
according to Ruan Da"s criteria, test3 should output obj, and the results of test1 and test2 caused my brain to shut down. I am now completely
.do not understand why there is such a result, ask the boss for advice.
arrow function, and its value must be determined by looking for scope. Simply put, this binds the this of the nearest non-arrow function. The this of the arrow function in
1 and test1 points to the this bound within the test1 function, that is, the outer layer of the arrow function in obj
2 and test2 is still the outer layer of the arrow function. We have to find the outer layer of obj , that is, the outer layer of the arrow function in window
3, test3 is the outer layer of obj , that is, window
is actually the same as test3. No matter how many layers of arrow functions are embedded in the method, the main thing to make clear is that test1,test2,test3 is a first-class method of obj, and then there is the outside of obj, not inside of obj.
I don't know how to interpret this sentence, but it must be the runtime that determines the value of this . (this has nothing to do with the arrow function)
let test = function() {
console.log(this)
}
test();//window
let obj = { test }
obj.test();//obj arrow function does not create its own this , it only inherits this from one layer above its scope chain.
this in several cases:
new , pointing to the new object. bind/apply/call , point to the first parameter (or window if the first parameter is null ). window . Please re-check your this against the above rules. In addition, numerous articles on the site have introduced this , please search by yourself.
the arrow function has already determined the direction before it runs. Without this, the one bound is the this of the nearest non-arrow function.
test4: function () {
console.log("test4", this);
}//objassuming that it is a normal function, this points to obj, because there is no arrow function and no binding, so look for the next layer is window
this rule seems ambiguous. The
arrow function does not have this , and the this value changes from parent scope -- grandfather scope --. Go all the way up to the global scope . (can be regarded as the search order of variables)
this printed in test1 is equivalent to this in parent scope test1. this printed in
test2 and test3 is equivalent to this in the global scope found all the way up.
it's all in the picture
Previous: How does weex scale the picture?
Next: After the success of reactnative ios Alipay, there is no callback back to app?
originally run directly in the browser (Chrome 65) will report ReferenceError errors, but after babel conversion, and then run, it will be undefined, these two errors are completely different, does it mean that the conversion of babel is not complete? ...
function foo(){ setTimeout(()=>{ console.log("is:",this.id); 42 },100) } var id = 21; foo.call({id:42}) The this of the function in js is dynamic, depending on who calls it at run time, in which the this inside foo points to an a...
test(...arg) { console.log("",arg); } render(){ return <View style={{flex:1,backgroundColor:"blue"}}> <TouchableOpacity activeOpacity={1} onPress={this. test("")}&...
under normal circumstances, variables declared by let or const cannot be declared repeatedly, and an error will be reported even when using var. eg: let a = 123; var a = 456; error prompt: Uncaught SyntaxError: Identifier a has already been declar...
I want to return a data corresponding to id based on the data.id passed in ...
< H1 > Ruan Yifeng: the extension operator (spread) is three dots (.). It is like the inverse operation of rest parameters, converting an array into a sequence of parameters separated by commas. < H1 > what does the inverse operation of rest parameter...
in es6. The extension operator expands the array [1Magol 2pr 3] unfolds as 1Magol 2Jol 3, so what is this 1Magol 2Jol 3? An array is not an array, a string is not a string later, there was also the operation of the object. The operator is called de...
first of all, there is such a piece of data list[ zhangsan , lisi , wangmazi ] people[ { name: zhangsan , username: },{ name: lisi , username: },{ name: wangmazi , username: } ] then the qu...
I have a vue project where ajax requests are sent using axios. one of the list pages, clicking on the list will send the details of the corresponding list of the request query. now in order to prevent frequent requests from being sent due to multiple ...
there is a requirement to remove an element from the array when it exists, and to add the element to the array when it does not exist. this is how I implement it. Is there a more elegant or convenient way to write it? Please do not hesitate to give us ...
export default class Base extends Component<Props> { constructor(props) { super(props); console.log("Base this",this) this showToast renderModal } * *Toast * * showToast=(msg)=>{ cons...
The logic goes like this: phone number = "get city name = " get city code = "get city weather the next request will use the result of the last request I have tried the following two ways of writing, and I feel very verbose. Is there any good wa...
I want to fix the x-axis of an ordinary line chart (considering only the existence of one X-axis) at the top, because the x-axis defaults to the below. top I adjusted {position: top } and that s it. AxisLine and axisTick are at the bottom, on...
Today, when I was using es6 to deconstruct the assignment introduction method, I found that I could not get the details of this, in the method. paste code first: *mainVM* @observable planDetailList = []; @action ajaxPlanDetailList(i...
when namespaced is not used, actions is registered globally by default, but after use, actions will become under the module, but I don t want to do this. I also want it to be global. My namespace:true is just for the convenience that I introduce state, ...
there are more than 10 methods for methods in one of my .vue files, and this page looks messy. is it because my componentization is not thorough enough; is there any way to make the file more concise ...
I want a variable in the drop-down box v-model data, and the default value of this variable is the constant defined in state, but what if it doesn t change with the value in state? reference: https: codeshelper.com q 10. The value of computed canno...
I haven t thought of a good way. What I lack now is that webstorm cannot automatically quote . is there any way for my colleagues to solve the problem? Or is it that the usage has always been to write an ultra-long file, or that a module that divi...
var arr = [ "2018-04-17T03 ", "2018-04-18T15 ", "2018-04-17T04 ", "2018-04-18T16 ", "2018-04-17T05 ", "2018-04-18T17 ", "2018-04-17T06 ", "2018-04-17T07 ", "2018-04-17T08 ", "2018-04-17T09 ", "2018-04-17T20 ", "2018-04-18T10 ", "2018-04-17T2...
var a = []; for (var i = 0; i < 10; iPP) { a[i] = function () { console.log(i); }; } a[6](); 10 variable leakage causes the above a [6] to become 10; I don t quite understand why a [6] is 10 here. My wrong thinking is as follows a [6]...