Shulou(Shulou.com)06/01 Report--

How to analyze the javascript scope and scope chain, many novices are not very clear about this, in order to help you solve this problem, the following editor will explain in detail for you, people with this need can come to learn, I hope you can gain something.

1. Javascript scope 1, global scope 1, variables defined by outermost function and outermost function var age = 20function func1 () {var sex = "male" function func2 () {console.log ("hello func2")} func2 ()} console.log (age) / / 20console.log (func1) / / normal execution console.log (func2) / / error console.log (sex) / / error 2, all variables that have not been directly declared Directly assign the global variable function func1 () {var age = 20 sex = "male"} func1 () console.log (sex) / / male console.log (age) / / error 3. The attribute above the window object has a global scope function func1 () {var age = 20 sex = "male" console.log (top) / / window.... } func1 () console.log (sex) / / "male" console.log (top) / / window....2, the local scope is the opposite of the global scope, and the local scope is only accessible within the function. Function func1 () {var age = 20 func1 () function func1 () {console.log ("func1")}} func1 () is the opposite of the global scope, and the local scope is only accessible within the function. Function func1 () {var age = 20 func1 () function func1 () {console.log ("func1")}} func1 () II. The scope chain function of javascript is also an object, and there is an attribute [[scope]] inside the function that contains a collection of accessible attributes. Determines which properties are accessible in the function. Let's use an example of a function to explain in detail the function scope chain. 1. When the function is created. The code is as follows: function add (num1, num2) {return num1 + num2}

When the function is initialized, the global variable var total = add (10,20) is put into the scope chain. When the function is executed, a new object is created and put into the scope chain, including arguments, parameter, this, and return values.

Active object is an active object, which is created when the function is executed. Then scope chain is similar to the stack structure, which is pushed into the stack before the function is executed, and pops up from the stack at the end of the function execution. The process of the function accessing the property is to look it up from top to next along the scope chain. Third, scope chain and optimization from the above example, we can see that accessing the global scope is the slowest, because we need to search from top to bottom, we should use as few global variables as possible, and we should use local variables as much as possible. If we use global variables multiple times in a function, we can convert global variables to local variables, and then use local variables. Function changeColor () {document.getElementById ("btnChange") .onclick=function () {document.getElementById ("targetCanvas") .style.backgroundColor = "red";};} We used document twice in the above code, but document as a global variable, we should convert it to a local variable to use, so here is the converted code. Function changeColor () {var doc=document; doc.getElementById ("btnChange"). Onclick=function () {doc.getElementById ("targetCanvas") .style.backgroundColor = "red";}; IV, change scope chain 1, with syntax change scope chain with syntax is to solve the problem of code rewriting, is a quick way to write objects, but such a good way, why not vigorously promote the use? Because there are some performance problems. Function initUI () {with (document) {var bd=body, links=getElementsByTagName ("a"), iS0, len=links.length; while (I < len) {update (links [I + +]);} getElementById ("btnInit"). Onclick=function () {doSomething ();};} here document is omitted using the with syntax. The purpose of with syntax is to solve the problem of code rewriting, which is a quick way to write objects, but why not vigorously promote the use of such a good way? Because there are some performance problems. Function initUI () {with (document) {var bd=body, links=getElementsByTagName ("a"), iS0, len=links.length; while (I < len) {update (links [I + +]);} getElementById ("btnInit"). Onclick=function () {doSomething ();};} here document is omitted using the with syntax.

The attributes of the objects passed in by with are put on the top layer, and the rest are pressed down, resulting in an increase in the access cost of local variables, so the performance of with is poor. 2. Catch syntax when we use try--catch, when the code executes an error, the catch function will be executed. The parameter in the catch function is the error object, which is the error object, which will be placed at the head of the scope chain. But we have to use try--catch when necessary, and we can solve it this way. Try {doSomething ();} catch (ex) {alert (ex.message); / / after the scope chain is changed here} processing: try {doSomething ();} catch (ex) {handleError (ex); / / delegate to the processor method} the solution is to hand over the catch error handling to another function. What kind of language is javascript? javascript is a dynamically typed, weakly typed language, based on object and event-driven, relatively secure, and widely used in client-side web page development. it is also a widely used scripting language for client-side Web development. It is mainly used to add dynamic functions to HTML web pages, and now JavaScript can also be used in web servers, such as Node.js.

Is it helpful for you to read the above content? If you want to know more about the relevant knowledge or read more related articles, please follow the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.