Introduction to JavaScript _javascript tips

This article is not a reference manual article, only suitable for JS to produce a general understanding, such as the need for the detailed syntax and application of JS, please go to W3school

What is JavaScript?

The birth of JavaScript

Around 1995, when the world's mainstream bandwidth of 28.8Kbps, now the world's average download bandwidth of 21.9Mbps (data from http://www.netindex.com). Netizens at that time, each submitted a form, need to wait for a long time to receive the response of the server, and even likely to wait a few minutes received is said to be missing a certain item. To improve the user experience, a script that embeds a browser client to make simple form judgments is born, which is JavaScript.

JavaScript was first developed by Netscape (Netscape) by Brendan Eich for the upcoming Netscapenavigator 2.0 (NN2.0), which was to be released in 1995, when it was called LiveScript. The language was named JavaScript in order to catch up with the current--java language, as it was a collaboration with very popular sun companies.

What does JavaScript have to do with Java?

This is also one of the first reactions to the layman's listening to JavaScript and the most reviled of the language.

Strictly speaking, there is no half cents relationship. If you want to be involved, it may be that some of the functions are the same, object-oriented thinking, judgment structure, loop statements, and so on, but these are obviously not Java patents, but the programming language consensus.

The standardization and development history of JavaScript

When JavaScript was launched, the user experience of better nn browsers dominated the browser market, while Microsoft was catching up. When the IE3 was launched, Microsoft released VBScript and was named after JScript, in fact not much different from Netscape's JavaScript (in today's case, the cottage). In the face of Microsoft's competition, Netscape and Sun have submitted their JavaScript drafts to ECMA (the European Computer Manufacturers Association) to standardize JavaScript, eventually forming the first version of ECMAScript (ECMA-262).

Interestingly, Netscape's internal problems followed the standardization of JavaScript, the JavaScript research stalled, and Microsoft overtook it, launched the IE4, built the first JavaScript engine to follow the ECMA specification, a year ahead of NN. Coupled with Microsoft's gradual occupation of the computer operating system market, its pre-installed IE browser market share gradually increased, nn is constantly crowding out the market. However, when Microsoft lost its biggest opponent, it has no power to develop, IE6~IE8, whether it is interface rendering or script execution, are incompatible, become a wonderful browser history, but also front-end developers nightmare.

Copy Code code as follows:

1.V1 June 1997 First edition
2.V2 June 1998 Format revision to make its form consistent with iso/iec16262 international standards
3.v3 December 1999 Powerful regular expressions, better word chain processing, new control directives, exception handling, error definition clearer, number output formatting and other changes
4.v4 not complete ... may be more specific to the definition of the class, namespaces, etc. ...
5.V5 December 2009 New "strict Mode" (strict mode), a subset used to provide more thorough error checking to avoid structural errors. Clarified a number of 3rd versions of the fuzzy specification, and accommodates behaviour of Real-world implementations that differed consistently from that Specificatio N. Added some new features, such as getters and setters, support for JSON and more complete reflection on object properties.

The June 2004 European Computer Manufacturers Association published the ECMA-357 Standard, which is an extension of ECMAScript, also known as e4x (ECMAScript for XML).

What does JavaScript have to do with ECMAScript?

In fact, the problem should be JavaScript, JScript, ECMAScript What is the relationship between the three. In fact, ECMAScript is the general specification, JavaScript and JScript are all developed in accordance with this specification, and ECMAScript compatible, but contain functionality beyond ECMAScript. However, now no matter what kind, are known as JavaScript, only because of its earliest appearance, the most influential, name spread to date.

What can JavaScript do?

On a Web page, all the operations that require logical processing can be done by JavaScript. Such as:

Copy Code code as follows:

• Form Validation
• Animation effect
• Web Games
• Countdown
•......

There are many many kinds of applications, here do not repeat, I believe that we learn the language will find a lot of applications to the place.

Why do you want to learn JavaScript?

1. Because you have no choice but to use JavaScript to control all the popular browsers, and JavaScript is one of the most important programming languages in the world, learning Web technology must learn JavaScript.

2.JavaScript is a beautiful language, it is very good, so we have to learn

The positioning of JavaScript

Copy Code code as follows:

1.JavaScript is a lightweight scripting language that does not need to be compiled, and is parsed by the JavaScript parsing engine (generally referred to as browsers, of course not excluding parsers like node)
2.JavaScript has non functional language features, functional language features and dynamic language features, its syntax is very flexible
3.JavaScript is an object-oriented programming language, there is a word in the JavaScript world: Everything is the object. Its inheritance is based on prototype inheritance (I have previously written an article specifically explaining the inheritance of prototypes)
4.JavaScript is a Class C language, so anyone who has studied C is easy to get started with JavaScript.
5.JavaScript writing does not need a compiler, but only a text editor (Notepad is free, here strongly recommend sublime text)

What does JavaScript have?

Now everyone uses JavaScript contains three parts: DOM, BOM, ECMAScript (or Core JS).

Dom

Here is the default to the HTML, CSS at least some understanding, if it is directly skipped HTML, CSS to see this article, first look here.

DOM, Document Object model

We know that XHTML requires that tags must be closed and nested correctly. The nesting of tags creates a parent-child relationship (or, ancestor-descendant relationships). And Dom, which provides a lot of APIs, allows us to easily manipulate the DOM tree. Later I will open an article specifically to talk about JS DOM.

Using DOM, we can dynamically modify the content of the page, adjust the style and so on, which is a reflection of JS diversification.

Bom

BOM, Browser object model (brower)

Similar to DOM, except that the subject becomes a browser. Browsers also provide a large number of APIs, some of which are open to JS, providing us with a way to manipulate the browser window.

Common uses:

Copy Code code as follows:

1. Ability to eject new browser window;
2. Ability to move, close, and change the size of the browser window;
3. Navigation objects that provide detailed information about the Web browser;
4. Can provide browser loading page details of local objects;
5. Screen objects that can provide detailed information about the user's screen resolution;
6. Support Cookies;
7.Internet Explorer expands the BOM to include ActiveX object classes, which can be implemented using JavaScript to implement ActiveX objects.

ECMAScript Core

Also known as JS Core, casually how to call, the same meaning, is to represent the core of JS language, including variable definition, garbage collection, syntax, scope and so on. Unlike the DOM and BOM mentioned above, they only require that we use these APIs, and ECMAScript core is the essence of the language and needs to be constantly studied. The next chapter will further talk about the syntax of JS.

Use of JavaScript

In-line

Inline is the Javascrip that is written in the label, such as we write in HTML:

Copy Code code as follows:

<button onclick= "alert (' Be clicked ');" > Click </button>

When we click on the button, the frame will display "be clicked".
But note that this is strongly not recommended because it can be a huge hassle for maintenance, and each time we need to change the event we need to find the element and then modify its JavaScript content, and the JavaScript code will not be reused.

In addition, the events written in the label need to be ' on ' and the tags can only be introduced into JS through events, rather than writing a simple JS expression

Inline type

Inline is the HTML script tag to write the JS code, the practice is to add a script tag in HTML, and then insert your arbitrary JS code in the middle of the tag, as follows:

Copy Code code as follows:

<body>
<button id= "BTN" > Click </button>
</body>
<script>
<span style= "font-family:arial, Helvetica, Sans-serif;" >var btn = document.getElementById ("btn") </span><pre name= "code" class= "JavaScript" > Btn.onclick = function () {
Alert ("Be clicked");
}
</script>

In-line, it's much more free than inline, you can write more code, you can avoid the problem of quotes escaping, and maintenance becomes easier. But the problem is there, the code can only be applied to this page, not to be used by other pages.

External-linked

The outer-form solves all the disadvantages of both of these forms. The procedure is as follows:

First create a new file and change the suffix to. js. For example, we create a new click.js file and then copy the JS code in the inline that we just wrote (note that the script tag is not included)

Copy Code code as follows:

var btn = document.getElementById ("btn");
Btn.onclick = function () {
Alert ("Be clicked");
}

The script tag is then introduced into the HTML

Copy Code code as follows:

<body>
<button id= "BTN" > Click </button>
</body>
<script src= "Click.js" ></script>

The advantage is that the same JS code can be shared by multiple HTML pages, the disadvantage is to increase the number of files, increase the time required to request, so should enhance the reuse of code, and finally to merge the JS file (the different JS files merged into a JS file)