Home  >  Article  >  Web Front-end  >  JavaScript minimalist introductory tutorial (1): Basics_javascript skills

JavaScript minimalist introductory tutorial (1): Basics_javascript skills

WBOY
WBOYOriginal
2016-05-16 16:32:571151browse

Reading this article requires programming experience in other languages.

Before you start studying

Most programming languages ​​have good parts and bad parts. This article only covers the good parts of JavaScript because:

1. Only learning good parts can shorten the learning time
2. The code written is more robust
3. The code written is more readable
4. The code written is easier to maintain

Weak typing and strong typing

Generally speaking, the sooner a bug is fixed, the less costly it is. Compilers for strongly typed languages ​​can check for certain errors at compile time. JavaScript is a weakly typed language, and its interpreter cannot check for type errors, but practice shows:

1. The errors that strong typing can avoid are not critical errors
2. Weak typing can bring flexibility, and there is no need to carry the baggage of strong typing

JavaScript related standards

The ECMA-262 standard defines the language ECMAScript. The JavaScript and ActionScript we know well are both based on ECMAScript. Currently, the mainstream uses ECMA-262 fifth edition, and Google's V8 engine is the implementation of this.

Hello JavaScript

JavaScript is a scripting language that requires an interpreter to interpret and execute. You can interpret and execute JavaScript in the browser or directly use node.js, which integrates Google's V8 JavaScript engine. Since node.js is very convenient to use, here I use node.js to interpret and execute JavaScript. Now look at the first JavaScript program:

Copy code The code is as follows:

// test.js
console.log("Hello JavaScript");

Execute this procedure:

Copy code The code is as follows:

node test.js

Grammar

Notes

JavaScript uses the same comment method as C, // is used for single-line comments, and /* */ is used for multi-line comments.

Number type

JavaScript has only one number type, which is a 64-bit floating point number. The numeric type has two special values, NaN and Infinity. NaN means not a number (not a number). Use the function isNaN to check whether it is NaN. The value Infinity means infinity. In the Math object, there are a set of methods for manipulating numbers, for example: the Math.floor method is used to round down.

String

String literals can be wrapped in single or double quotes, using escape characters (not unlike many other languages). Each character in JavaScript is two bytes and uses the Unicode character set. Strings have a length property:

Copy code The code is as follows:

"Hello".length // The value is 5, note not "Hello".length()

Strings cannot be changed (same as Lua). In addition to the length attribute mentioned here, there are also some methods, such as:

Copy code The code is as follows:

'cat'.toUpperCase() === 'CAT'

Statement

The

var statement is used to declare local variables, otherwise the variable is a global variable, and the value of an uninitialized variable is undefined:

Copy code The code is as follows:

function f() {
var localVar = 123;
globalVar = 456;
var i; // The value of i is undefined
};

f();

console.log(globalVar); // ok
console.log(localVar); // Error, localVar is not defined

A group of statements wrapped by {} is called a block. Unlike other languages, functions in JavaScript will create new scopes but blocks will not, for example:

Copy code The code is as follows:

{
var v = 123;
}
console.log(v); // ok

if statement

Copy code The code is as follows:

if (expression)
Statement

or

Copy code The code is as follows:

if (expression)
Statement1
else
Statement2

or

Copy code The code is as follows:

if (expression1)
Statement1
else if (expression2)
Statement2
else if (expression3)
Statement3
else
Statement4

The if statement determines whether to execute or skip certain statements by judging whether the value of the expression is true or false. In JavaScript the following values ​​are false (all other values ​​are true):

1.false
2.null
3.undefined
4. Empty string
5.0
6.NaN

The statement in if can be a statement or a statement block.

switch statement

Copy code The code is as follows:

switch (n) {
case 1: // if n equals 1
//Execute code block
Break;
Case 2: // If n equals 2
//Execute code block
Break;
Default: // If n is neither 1 nor 2
//Execute code block
Break;
}

The break here is used to exit the loop statement or switch statement. In JavaScript, there are two operators to compare whether two values ​​are equal:

1.== ​​(corresponding to != operator), equal, when the two operand types are different, this operator attempts to convert the operand type before comparison, for example:

Copy code The code is as follows:

var x = 1;
x == 1; // true
x == "1"; // true

2.=== (corresponding to !== operator), completely equal, comparing two operands without performing operand type conversion, for example:

Copy code The code is as follows:

var x = 1;
x === 1; // true
x === "1"; // false

It should be noted that NaN is not equal to any value. If x is NaN, then x !== x (only true for NaN), we can implement the isNaN function like this:

Copy code The code is as follows:

function isNaN(n) {
Return n !== n;
}

The above switch statement is converted into an if statement:

Copy code The code is as follows:

if (n === 1)
// ...
else if (n === 2)
// ...
else
// ...

while and do-while statements

Copy code The code is as follows:

while (expression)
Statement

If expression is true, statement is executed repeatedly until expression is false.

Copy code The code is as follows:

do
Statement
while (expression);

Similar to a while loop, except that statement is executed first and then the conditional expression is checked.

for statement

Copy code The code is as follows:

for (initialize; test; increment)
Statement

First initialize is executed once (commonly used to initialize loop variables), and then the test condition is tested (commonly used to test loop variables). If the test condition is false, the loop is stopped, otherwise statement is executed, and then increment is executed (commonly used to update loops) variable), and then perform the test condition test, and the loop continues. Usage example:

Copy code The code is as follows:

for (var i=0; i<5; i) {
console.log(i);
}

Another form of for is used to enumerate all property names of an object:

Copy code The code is as follows:

for (variable in object)
Statement

Example:

Copy code The code is as follows:

var obj = {
a: 1,
b: 2,
c: 3
};

for (var name in obj)
console.log(name);

It should be noted that we use the hasOwnProperty method to check whether the property name belongs to the object or is found from the prototype chain (prototype will be introduced in the next article):

Copy code The code is as follows:

for (var in obj) {
If (obj.hasOwnProperty(var)) {
               // ...
}
}

return statement

The

return statement is used to let the function return a value. If the function does not explicitly use return, then undefined is returned:

Copy code The code is as follows:

function f() { }
var v = f(); // v === undefined

?: conditional operator (the only ternary operator in JavaScript)
?: The conditional operator exists in many programming languages. When the first operand is true, the operator returns the value of the second operand, otherwise it returns the value of the third operand. Usage example:

Copy code The code is as follows:

function abs() {
Return x > 0 ? x : -x;
}

typeof operator

The typeof operator is used to obtain the type of a variable, and its return value includes:

1.'number'
2.'string'
3.'boolean'
4.'undefined'
5.'function'
6.'object'

The special typeof null returns 'object'. Example about typeof:

Copy code The code is as follows:

var a = typeof 'hello'; // a === 'string'
var b = typeof null; // b === 'object'

Operator

The

operator can be used for addition operations in JavaScript and can also be used for string concatenation:

Copy code The code is as follows:

var message = 'hello' 'world'; // message === 'helloworld'

&& and || operators

&& operator returns the value of the first operand if the first operand is false, otherwise returns the value of the second operand
The || operator returns the value of the first operand if the first operand is true, otherwise it returns the value of the second operand

Copy code The code is as follows:

var a = 1 && true; // a === true
var b = 1 || false; // b === 1
An idiomatic usage of

||:

Copy code The code is as follows:

name = name || 'unknown'; // Set the default value for name 'unknown'
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn