Native JS---1, native js

Native JS---1, native js

History of js

In the 1995 s of the last century, Netscape was making its Navigator browser the most famous first-generation Internet company when the Web age started.

Wangjing hopes to add some dynamic effects to the static HTML page, So Brendan Eich, the buddy, designed the JavaScript language within two weeks. You are not mistaken. This guy only took 10 days.

Why is it called JavaScript? The reason was that the Java language was very popular at the time, So Netscape wanted to use Java's fame for promotion, but in fact JavaScript had nothing to do with other parts except the syntax.

JavaScript version compatibility

The JavaScript language was designed within 10 days. Although the language designer level is very NB, no one can hold the question of "tight time and heavy tasks, javaScript has many design flaws and will be discussed later.

In addition, because the JavaScript standard-ECMAScript is constantly developing, the latest version of ECMAScript 6 (ES6 for short) has been officially released in June 2015. Therefore, when it comes to the JavaScript version, it is actually the version that implements the ECMAScript standard.

When the browser was released, it determined the JavaScript version. In addition, many users are still using IE6, an old browser. This causes you to take care of the old users when writing JavaScript, the latest ES6 standard cannot be used as soon as it comes up. Otherwise, the old user's browser cannot run the new JavaScript code.

Composition of js

ECMAScript

ECMAScript is a standard.

Because Netscape developed JavaScript, Microsoft developed JScript in imitation of JavaScript a year later. To make JavaScript a global standard, several companies have joined with ECMA (European Computer Manufacturers Association) the organization customizes the JavaScript language standard, known as the ECMAScript standard.

So simply put, ECMAScript is a language standard, while JavaScript is an implementation of ECMAScript standards by Netscape.

So why not simply set JavaScript as the standard? Because JavaScript is the registered trademark of Netscape.

But most of the time, we still use JavaScript. If you encounter the word ECMAScript, simply replace it with JavaScript.

DOM

DOM: Document Object Model. Document Object Model. Later we will have a special course to explain DOM operations.

BOM

BOM: Browser Object Model. Browser object model. Later we will also talk about bom operations.

Features of JavaScript

(1) An interpreted scripting language.

Like other scripting languages, JavaScript is also an explanatory language, which provides a very convenient development process. The basic structure of JavaScript syntax is similar to that of C, C ++, and Java. However, before using it, it is not necessary to compile these languages first, but it is explained line by line during the program running. JavaScript and HTML tags are combined to facilitate user operations.

(2) An object-based scripting language.

It can also be seen as an object-oriented language, which means that JavaScript can use the created objects. Therefore, many functions can come from the interaction between methods of objects and scripts in the script environment.

(3) A simple and weak scripting language.

Its simplicity is mainly reflected in: first, JavaScript is a simple and compact design based on the Basic Java statements and control flow, therefore, it is a very good transition for users to learn Java or other C-language programming languages. For programmers with C-language programming skills, JavaScript is also very easy to use. Secondly, the variable type adopts the weak type and does not use the strict data type.

(4) a relatively secure scripting language.

As a security language, JavaScript is not allowed to access local hard disks, store data on servers, and modify or delete network documents, information Browsing or dynamic interaction can only be achieved through a browser. This effectively prevents data loss or illegal access to the system.

(5) An event-driven scripting language.

JavaScript responds to users in an event-driven manner. An action generated by an operation on a Web Page is called an Event ). For example, pressing the mouse, moving the window, and selecting a menu can all be regarded as events. When an event occurs, it may cause the corresponding Event Response and execute some corresponding scripts. This mechanism is called "event-driven ".

(6) A cross-platform scripting language.

JavaScript depends on the browser itself and has nothing to do with the operating environment. As long as the computer can run the browser and support the JavaScript browser, it can be correctly executed, thus realizing the dream of "writing once, going all over the world.

Therefore, JavaScript is a new descriptive language that can be embedded into HTML files. The JavaScript language can respond to user requirement events (such as form input) without any network to transmit data back and forth. Therefore, when a user inputs a data item, the data does not need to be sent to the server for processing and then transmitted back, but can be directly processed by the client application.

3. Advantages and Disadvantages of JavaScript

(1) Advantages of JavaScript:

<1>. JavaScript reduces network transmission.

Before the emergence of a client scripting language such as JavaScript, the traditional data submission and verification work was carried out by the client browser over the network. If the data volume is large, this is an invisible waste for network and server resources. With JavaScript, you can perform data verification on the client.

<2> JavaScript allows you to easily manipulate HTML objects.

JavaScript allows you to easily manipulate objects on various pages. You can use JavaScript to control the appearance, status, and even running mode of each element on the page. JavaScript can be customized based on your needs, this makes the webpage more friendly.

<3>. JavaScript supports distributed operations.

JavaScript allows multiple tasks to be completed only on the user end, without the involvement of networks and servers, thus supporting distributed computation and processing.

(2) Limitations of JavaScript:

<1> browser vendors have different levels of support for JavaScript.

Currently, there are many browsers on the Internet, such as Firefox, Internet Explorer, and Opera. However, each browser supports JavaScript to a different extent. When different browsers browse a home page with JavaScript scripts, because the support for JavaScript is slightly different, there may be some difference in the effect, and sometimes it may not be displayed.

<2>. Web security sacrifices some JavaScript Functions.

When a JavaScript design goal is set to "Web security", some functions of JavaScript need to be sacrificed. Therefore, pure JavaScript cannot open, read, write, and save files on your computer. The only information that the user has the right to access is the information on the Web page embedded in the JavaScript. In short, JavaScript will only exist on its own Web page.

Introduction of js

Introduce js Code in a pair of script labels

By using this method, you can write the js Code and html code in the same file, but note: it is best to write the js Code after the body, and the document loading order is from top to bottom, first, the page content is rendered and then added to user interaction, which greatly enhances the user experience.

Sample Code:

<HtmlLang = "en">

<Head>

<MetaCharset = "UTF-8"/>

<Title> Js Foundation 1 </Title>

</Head>

<Body>

</Body>

<! -- It is recommended that the script be placed after the body to process Interaction Events and wait until the content is displayed. -->

<ScriptType = "text/javascript">

// Warning box

Alert ('network error! ');

</Script>

</Html>

Open the file in a browser as follows:

Introduce external js Code

We can write the js Code in a file suffixed with. js, and then introduce this js file into the html document.

Procedure:

Create a directory folder such as js, and then create a js file with a suffix of. js, such as index. js;

Write the js file path to src in the script tag.

Sample Code:

<! Doctype html>

<HtmlLang = "en">

<Head>

<MetaCharset = "UTF-8"/>

<Title> Js Foundation 1 </Title>

</Head>

<Body>

</Body>

<! -- It is recommended that the script be placed after the body to process Interaction Events and wait until the content is displayed. -->

<! -- Method 2: Introduce js files -->

<ScriptSrc = "js/index. js" type = "text/javascript">

</Script>

</Html>

Alert statement

We noticed that the preceding statement alert ('network error! ');. This is an alert statement used to pop up a prompt box in the browser.

Js Variables

What is a variable?

A variable is a container that can be used to store data and the data stored in the container can change. For example, I have a basin where I can hold both sand, water, and food. This basin can be seen as a variable. The water, sand, and grain in it are the values stored in the variable.

In life, we use paper to record and store information, while in computer, we use variables to store information. The concept of variables is basically the same as that of the equation variables of junior high school algebra. in computer programs, variables can not only be numbers, but also any data type.

How to define variables?

Use the keyword var + variable name + = (Value assignment) + value +; to define a variable.

Sample Code: Define a variable:

Var a = 12;

The code above defines a variable a. The value saved in the variable is 12.

Variable naming rules

A variable is represented by a variable name in JavaScript. The variable name is a combination of uppercase and lowercase English letters, numbers, $, and _, and cannot start with a number. The variable name cannot be a JavaScript keyword, such as if or while. Declare a variable using the var statement, for example:

VarA; // declare the variable a. The value of a is undefined.Var$ B = 1; // declare the variable $ B and assign a value to $ B. The value of $ B is 1.VarS_007 = '007 '; // s_007 is a string.VarAnswer =True; // Answer is a Boolean value trueVarT =Null; // The value of t is null.

The variable name can also be in Chinese. However, because the compatibility of Chinese characters is poor, do not use Chinese as the variable name.

Variable naming rules:

Type prefix

Uppercase letters

 

Basic js Data Types

Number

Number is a numerical value. In our life, we call the number without decimal places an integer and the number with decimal places a decimal point (a floating point in the computer). JavaScript does not distinguish between integers and floating points, it is uniformly represented by Number. The following are valid Number types:

VarA = 123; // an integer of 123VarA = 0.456; // floating point number 0.456VarA = 1.2345e3; // scientific notation 1.2345x1000, equivalent to 1234.5VarA =-99; // negative NaN; // NaN indicates Not a Number. When the calculation result cannot be calculated, NaN indicates Infinity. // Infinity indicates infinite size, when the value exceeds the maximum value expressed by the JavaScript Number, it is Infinity.

You can perform addition, subtraction, multiplication, division, remainder, auto-increment, and auto-subtraction operations on the Number type.

String

A string is any text enclosed by single quotation marks or double quotation marks, such as 'abc' and "xyz. Note that ''or" "is only a representation, not a part of the string. Therefore, the string 'abc' contains only three characters: a, B, and c.

If 'is also a character, it can be enclosed by "". For example, "I'm OK" contains the characters I,', m, space, O, k.

What if the string contains both 'and? It can be identified by escape characters \, for example:

'I \'m \ "OK \"! ';

The string content is: I'm "OK "!

Escape characters

'Indicates the escape character. In the computer, some special characters are given special meanings by the system. For example,' indicates to enclose strings. But what should I do if I want to output? We can use the Escape Character 'as above, and add an escape character before a special character. The computer will treat this special character as a normal string.

Boolean Value

In the computer, we use True to indicate that conditions are true, and false to indicate that conditions are not true. True and false are boolean values ).

In js, we use true to represent truth, and false to represent false. The Boolean value is true or false, and there is no third value. Boolean values are often used in condition judgment.

VarBo1 =True; // Boolean result true and false

// Typeof () is used to obtain the data type of a variable. (You can also use ypeof () to obtain the data type without knowing the type of the variable)

Alert (Typeof(Bo1 ));

Null and undefined

Null indicates a "null" value. It is different from 0 and null String ''. 0 is a value,'' indicates a string with a length of 0, and null indicates "null ".

In other languages, JavaScript-like null representation is also available. For example, Java uses null, Swift uses nil, and Python uses None. However, in JavaScript, there is an undefined similar to null, which indicates "undefined ".

JavaScript designers want to use null to indicate an empty value, while undefined indicates that the value is undefined. Facts have proved that this is useless and it is of little significance to distinguish the two. In most cases, we should use null. Undefined is only useful when determining whether function parameters are passed.

Extended undefined type

 

// If we do not set a value for a variable, it is of the undefined type;VarColor;

Alert (TypeofColor );

Operators in js

Arithmetic Operators

+ Add

-Subtraction

* Multiplication

/Division

% Remainder (Modulo)

Value assignment operator

= Value assignment

+ = Add and assign values

-= Value after subtraction

* = Value after Multiplication

/= Assign values after Division

% = Post-modulo Value

Relational operators

> Greater

<Less

<= Less than or equal

> = Greater than or equal

= (If the types on both sides are inconsistent, It is implicitly converted to the same type before comparison)

==== (If the types on both sides are inconsistent, false is returned)

! = Not equal to (if the types on both sides are inconsistent, It is implicitly converted to the same type before comparison)

! = Not equal to (NO Conversion Type, direct comparison)

Logical operators

&

| Or

! Non

Javascript logical operators

The result of a logical operation is a Boolean value. There are three logical operators in js:

&

| Or

! Non

Logic &&

Writing Method: expression 1 & Expression 2. The true condition for the logic and expression is that the entire logic and expression are valid only when the expressions on both sides of the left and right are both true. If one expression is not true, the entire logic expression is false.

Logic or |

Writing Method: expression 1 | expression 2. The true condition for a logic or expression is the expression on both sides of the left and right. If one of them is true, the entire expression is true. The entire expression is false only when both expressions are false.

Non-logical!

The writing method is :! Expression. The logic is not to reverse the result of the original expression. If the original expression is true, the value returned after the logical non-operation is performed is false. If the meta expression is false, the expression is true after the logical non-operation.