Front-end JavaScript

Knowledge preview:

JavaScript overview

JavaScript Basics

JavaScript object

BOM object

DOM object

example exercises

JS extension

JavaScript overview 

History of JavaScript

• In 1992, Nombas developed the C-minus-minus (C--) embedded scripting language (initially bound in CEnvi software). It was later renamed ScriptEase. (client-side execution language)

• Netscape (Netscape) accepted the idea of ​​Nombas, (Brendan Eich) developed a set of livescript scripting language in its Netscape Navigator 2.0 product. Sun and Netscape jointly completed. Later renamed Javascript

• Microsoft then imitated a JavaScript clone called Jscript in its IE 3.0 product.

• In order to unify the three, ECMA (European Computer Manufacturing Association) defines the ECMA-262 specification. The International Organization for Standardization and the International Electrotechnical Commission (ISO/IEC) also adopt ECMAScript as a standard (ISO/IEC-16262). Since then, Web browsers have made efforts (albeit with varying degrees of success and failure) to use ECMAScript as the basis for JavaScript implementations . EcmaScript is the specification.

ECMAScript

While ECMAScript is an important standard, it's not the only part of JavaScript, and certainly not the only part that's been standardized. In fact, a complete JavaScript implementation consists of 3 distinct parts:

• Core (ECMAScript) 
• Document Object Model (DOM) Document object model (integrating js, css, html)
• Browser object model (BOM) Browser object model (integrating js and browser)
• Javascript is mostly object-based in development. It is also object-oriented. 

Simply put, ECMAScript describes the following:

• grammar 
• Types of 
• statement 
• keywords 
• reserved word 
• operator 
• Objects (encapsulation inheritance polymorphism) Object-based languages. Use objects.

Basics of JavaScript

2.1 Introduction of JS

1 Write directly
     <script> 
        alert( ' hello yuan ' )
     </script>
2 Import the file
     <script src= " hello.js " ></script>

2.2 JS variables, constants and identifiers

2.2.1 JS variables

x=5
y=6
z=x+y

In algebra, we use letters (like x) to hold values ​​(like 5). From the above expression z=x+y, we can calculate that the value of z is 11. In JavaScript, these letters are called variables.

So how to define and use variables in JS?

1. When declaring variables, you do not need to declare the variable type. All use the var keyword;

var a;<br>a=3;

2. One line can declare multiple variables. And can be of different types

var name="yuan", age=20, job="lecturer";

3. You can declare variables without var. If you do not use var, then it is a global variable

4. Variable naming, the first character can only be a letter, an underscore, a dollar sign

Camel notation
The first letter is lowercase, and all subsequent letters begin with an uppercase character. E.g:
var myTestValue = 0, mySecondValue = "hi";
Pascal notation
The first letter is capitalized, and all subsequent letters begin with an uppercase character. E.g:
Var MyTestValue = 0, MySecondValue = "hi";
Hungarian type notation
A lowercase letter (or sequence of lowercase letters) is appended to a variable named in Pascal notation, indicating the variable's type. For example, i represents an integer and s represents a string, as follows"
Var iMyTestValue = 0, sMySecondValue = "hi";

Naming conventions

 

2.2.2 Constants and Identifiers

Constants  : data values ​​that appear directly in the program

Identifier:

1. Consists of letters that do not start with a number, numbers, underscores (_), dollar signs ($)
2. A name often used to denote functions, variables, etc.
3. For example: _abc, $abc, abc, abc123 are identifiers, but 1abc is not
4. Words that represent specific meanings in the JavaScript language are called reserved words , and programs are not allowed to be redefined as identifiers

 

2.3 JS data types

 

/*        
        number      -----   numeric value
        boolean     -----   Boolean value
        string      -----   string
        undefined  -----  undefined
        null        -----    null  
      
 *

2.3.1 Number Type (number)

• Does not distinguish between integer values ​​and floating-point values;
• All numbers are stored in 64-bit floating point format, equivalent to double format in Java and C languages
• The maximum value that can be represented is ±1.7976931348623157 x 10308
• The minimum value that can be represented is ±5 x 10 -324 　

Integers: In            JavaScript
           , decimal integers consist of a sequence of numbers. The
           exact range is -9007199254740992 (-253) to 9007199254740992 (253)
           out-of-range integers, and the precision will be affected            . 3.4, 5.6            record data using exponent eg: 4.3e23            = 4.3 x 1023

The expression of hexadecimal and octal numbers:
           0x is added in front of the hexadecimal data, and 0 is added in front of the octal; the hexadecimal number is composed of 16 characters such as 0-9, AF; the octal number is composed of 0-7 Composed of 8 numbers

           Conversion of hexadecimal and octal to binary:

2.3.2 String type (string)

It is a sequence composed of Unicode characters, numbers, and punctuation marks; the beginning and end of string constants are enclosed in single or double quotation marks; there is no character type in JavaScript; common special characters are expressed in
strings; some special characters in strings must be added Upper right dash \; commonly used escape characters\n: newline\': single quotation mark \": double quotation mark\\: right dash

2.3.3 Boolean type (boolean)

The Boolean type has only two values: true and false, which also represent 1 and 0. In actual operations, true=1, false=0
Boolean values ​​can also be regarded as on/off, yes/no, and 1/0 correspond to true/false
Boolean Values ​​are mainly used in JavaScript control statements, such as:

if (x==1){
      y =y+1 ;
}else{
      y =y-1 ;
      }

2.3.4 Null & Undefined types

Undefined type

The Undefined type has only one value, undefined. When a declared variable is uninitialized, the default value of the variable is undefined.

When the function has no explicit return value, the returned value is also "undefined";

Null type

Another type with only one value is Null, which has only one private value, null, its literal. The value undefined is actually derived from the value null, so ECMAScript defines them as equal.

Although the two values ​​are equal, they have different meanings. undefined is the value assigned to a variable when it was declared but not initialized, and null is used to represent an object that does not yet exist (this was briefly introduced when discussing the typeof operator). If a function or method is to return an object, then if the object is not found, it usually returns null.

2.4 Operators

　  

JavaScript objects

　　

 

 

BOM object

 

 

 

DOM object

 

example exercises

 

 

 

 

 

js extension

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

pass