Dynamic scope with this +apply and call +bind

Source: Internet
Author: User

Lexical scopes are a set of rules about how the engine looks for variables and where to find variables. (Function scope and block scope)

The scope in JavaScript is the lexical scope, which is the static scope, which is determined by the definition code.

Dynamic scopes seem to imply good reason to have scopes as a form that is dynamically determined at run time, rather than statically determined when writing code

Dynamic scopes do not care about how functions and scopes are declared and where they are declared, only about where they are called from. In other words, the scope chain is based on the call stack, not the scope nesting in the code

PS: You can ignore this passage:

A static type language is a language that can be determined at compile time for a variable's data type, and most static type languages require that the data type must be declared before the variable is used, and some modern languages with type derivation capabilities may be able to partially mitigate this requirement.
A dynamic type language is a language that determines the data type at run time. A type declaration is not required before a variable is used, and the type of the variable is usually the type of the value being assigned.

Don't confuse the concept OH

The binding of this and the position of the function declaration have no relation, only depends on how the function is called. When a function is called, an activity record is created (sometimes called an execution context). This record will be wrapped
Contains information about where the function is called (the call stack), the calling method of the function, the parameters passed in, and so on. This is one of the attributes of the record, which is used during the execution of the function.

Binding rules:

1. Called by new? Binds to the newly created object.
2. Called by call or apply (or bind)? Binds to the specified object.
3. Called by the context object? Binds to that context object.
4. Default: Bind to undefined in strict mode, otherwise bind to global object.

1. Default Bindings

functionthis. a);} var a = 2//  2

2.

functionthis. a);} var obj =2, foo:foo}; var // function Aliases!  var//  A is the attribute of the global object //  "oops, global" although bar is Obj.foo , but in fact it refers to the Foo function itself, so bar () at this point is actually a function call without any adornments, so the default binding is applied. 

3.

functionthis. a);} function Dofoo (FN) {//  FN is actually referring to the Foo//  <--call location!  }var obj =2, foo:foo}; var // A is a property of a global object // "Oops, global" parameter passing is actually an implicit assignment, so we are implicitly assigned when we pass in the function, so the result is the same as the previous example

A similar example:

function SetTimeout (fn,delay) {//  wait for delay milliseconds //  <--call location! }

fn If the incoming Obj.fn actually also has an implicit assignment

A typical scenario for hard binding is to create a package function, pass in all the parameters, and return all the values received:

functionthis. A, something); return this. A + something;} var obj = {A:2}; var function () {return  foo.apply (obj, arguments);}; var // 2 3 // 5

Call and apply are actually called FN (runtime bindings), the this binding inside FN points to obj, and the FN arguments is an array of FN parameters fn.apply (obj, "arguments")

Call is similar to the only FN parameter is not an array form

functionfoo (something) {Console.log ( This. A, something);return  This. A +something;}//Simple Auxiliary binding functionfunctionbind (FN, obj) {return function() {returnfn.apply (obj, arguments);};}varobj ={A:2};varBar =bind (foo, obj);varb = Bar (3);//2 3Console.log (b);//5

Arrow functions:

the arrow functions are most commonly used in callback functions, such as event handlers or timers: function  = = {//  Here the This is inherited from Foo () this. a);} var obj = {A:2//  2

The arrow function inherits the this binding of the outer function call

Dynamic scope with this +apply and call +bind

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.