Common basic knowledge of JavaScript reinforcement _ javascript skills

Source: Internet
Author: User
Tags variable scope
This article mainly introduces common basic knowledge Reinforcement Learning for JavaScript. For more information about JavaScript, see the following:

JavaScript is a literal-literal scripting language. It is a dynamic, weak, prototype-based language with built-in support types. Its Interpreter is calledJavaScript EngineIt is a part of the browser and is widely used in the script language of the client. It was first used on HTML (an application under the standard General Markup Language) web pages to add dynamic functions to HTML web pages.
JavaScript has the following features:

  • · Script language. JavaScript is an interpreted scripting language. C, C ++, and other languages are compiled and executed first, while JavaScript is interpreted line by line during program running.
  • · Object-based. JavaScript is an object-based scripting language that not only creates objects, but also uses existing objects.
  • · Simple. The JavaScript language uses a weak type of variable. It does not have strict requirements on the data types used. It is a script language based on Java basic statements and control. Its design is simple and compact.
  • · Dynamic. JavaScript is an event-driven scripting language that responds to user input without going through the Web server. When you access a webpage, you can directly respond to these events by clicking or moving up or down the webpage, moving the window, and other operations in JavaScript.
  • · Cross-platform. The JavaScript scripting language is not dependent on the operating system and only supports the browser. Therefore, after writing a JavaScript script, it can be used on any machine. on the premise that the browser on the machine supports the JavaScript script language, JavaScript is currently supported by most browsers.

JavaScript consists of the following parts:

  • · ECMAScript describes the syntax and basic objects of the language.
  • · The Document Object Model (DOM) describes the methods and interfaces for processing webpage content.
  • · Browser Object Model (BOM), which describes the methods and interfaces for interacting with the browser.

What data types does JavaScript have?

  • · The object contains functions, String, Array, object, Date, and so on.
  • · String
  • · Number
  • · Boolean
  • · Null
  • · Undefined

The following code proves the above:
String and Number are objects. string and number are different data formats...

 var str = "abc"; var Str = new String("abc"); var num = 100; var Num = new Number(100); console.log(typeof str, typeof Str, typeof num, typeof Num); // string object number object

What is the object prototype chain?
When we use a new Object (created using the constructor) or Object. create to create an Object, the Object will have a prototype and a prototype chain.
For example, if we create a constructor _ obj and use _ obj to create a new obj, the prototype chain is: obj → _ obj → Object. prototype → null.
Let's explain through code:

Function _ obj () {}; _ obj. prototype. name = "Beast"; // each function contains a prototype attribute that points to an object reference and the object is a "prototype object ". _ Obj. prototype. age = 21; _ obj. prototype. sayHello = function () {console. log ("Hello" + this. name) ;}; var obj = new _ obj (); console. log (obj); // _ obj {} and its _ proto _ contains all the attributes in _ obj, including name, age, and sayHello console. log (obj. _ proto _ = _ obj. prototype); // true obj. sayHello (); // Hello Beast console. log (Object. prototype. _ proto _); // null when the Object (that is, the object's source) points to null

Note that the prototype chain of Object. create (null) is directly null, that is, the prototype chain of people is very short...

How to play with the scope in JavaScript?
When we declare a variable using var in JavaScript, we add an attribute and attribute value to the object pointed to by this scope.
There is no block-level scope in JavaScript. variables declared in the current scope are only available in the current scope and functions in the current scope, the variable declared in the function only applies to the function (if no operation is performed). If the variable is called outside the function, the not defined error is returned.
Let's run the code to understand the scope:

Var firstNum = 1 ;~ Function () {var secondNum = 2; console. log ("print in:" + firstNum, secondNum); // print in: 1 2} (); console. log ("print out:" + firstNum, secondNum); // Uncaught ReferenceError: secondNum is not defined (...)

The scope also has a scope chain:

Var firstNum = 1; console. log ("print at the outermost layer:" + firstNum); // print at the outermost layer: 1 ~ Function () {var secondNum = 2; console. log ("print in the middle layer:" + firstNum, secondNum); // print in the middle layer: 1 2 ~ Function () {var thirdNum = 3; console. log ("print at the innermost layer:" + firstNum, secondNum, thirdNum); // print at the innermost layer: 1 2 3} (); console. log ("print in the middle layer:" + firstNum, secondNum, thirdNum); // Uncaught ReferenceError: thirdNum is not defined (...) } (); Console, log ("printing at the outermost layer:" + firstNum, secondNum, thirdNum); // The Browser executes JavaScript in a single thread because an error has been reported, so we didn't execute this sentence at all...

That is to say, the variables declared in the current scope will still be available in the subscope of the subscope. Haha...

What is a closure? How to play?
Function execution depends on the variable scope. This scope is determined when the function is defined, rather than when the function is called. To implement this lexical scope, the internal state of the JavaScript function object not only contains the logic code of the function, but also must reference the current scope chain. Function objects can be correlated through the scope chain. All the variables in the function body can be stored in the function scope. This feature is actually a "closure ".
Let's continue with the code:

Function counter () {var num = 0; return {count: function () {return num ++ ;}, reset: function () {return num = 0 ;}}}; var firstNum = counter (); var secondNum = counter (); console. log (firstNum. count (); // 0 console. log (secondNum. count (); // 0 firstNum. reset (); console. log (firstNum. count (); // 0 num has been reset, So 0 console is returned. log (secondNum. count (); // 1 num is not reset, so 1 console is returned. log (firstNum, secondNum ); // All values are Object {count: function (), reset: function () ,__ proto __} and the var n in counter cannot be found in it, this also implements the private variables in the function and only exposes the two methods to be exposed.

The closure uses two more functions: Read the variable values inside the function, so that these variable values are always saved (in memory ).
At the same time, it should be noted that the closure should be used with caution and should not be abused or used out of disorder. Because the internal variables of the function are stored in the memory, the memory consumption will be high.

This in JavaScript
In JavaScript, this usually points to the function we are executing, or to the object to which the function belongs.
Global this → pointing to Window
In the function, this → points to the object where the function is located.
This in the object → point to itself
Verification Code:

Console. log (this); // Window {external: Object, chrome: Object, document: document, global: Window, cr: Object ...} Execute console. log in global mode, so the point here is Window ~ Function seeThis () {console. log (this); // Window {external: Object, chrome: Object, document: document, global: Window, cr: Object ...} Because I wrote this function globally, it points to Window} (); var obj = {name: "Beast", showThis: function () {console. log (this); // Object {name: "Beast", showThis: function () ,__ proto __} the printed Object itself }}; obj. showThis ();

Arguments
In Javascript Functions, arguments is like an array (not a real array) and has the length attribute, which can represent the number of parameters passed to the function.
To put it simply, the actual parameters passed when the arguments function is executed.
For example, arguments [0] indicates that the first parameter is input.
Verify with code:

Function argumentsTest () {console. log (arguments [0]? Arguments [0]: "Hello World", arguments [1]? Arguments [1]: "")}; argumentsTest (); // Hello World argargargargumentstest ("This is firstValue => arguments [0]. "," This is secondValue => arguments [1]. "); // This is firstValue => arguments [0]. this is secondValue => arguments [1].

I will share these basic knowledge about common JavaScript programs for the moment. I hope you can learn more about javascript programming.

Related Article

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.