Summary of common JavaScript knowledge points for interview development

No1. Syntax and type

1. Declaration and definition

Variable type: var, define variables; let, define Block scope (scope) local variables; const, defines read-only constants.

Variable format: starts with a letter, underscore "_" or $ symbol, case sensitive.

Variable assignment: A variable that is declared but not assigned has a value of undefined when used. If an undeclared variable is used directly, an exception will be thrown.

Calculation of unassigned variables: the result is NaN. For example:

var x, y = 1;
console.log(x + y); //结果为NaN，因为x没有赋值。

　2. Scope

Variable scope: Before ES6, there was no block declaration scope, and variables acted on function blocks or globally. As shown in the following code, the input x is 5.

if (true) {
var x = 5;
}
console.log(x); // 5

　ES6 variable scope: ES6 supports block scope, but you need to use let to declare variables. The following code output results in an exception being thrown.

f (true) {
let y = 5;
}
console.log(y); // ReferenceError: y is not defined1234

Variable floating: In a method or global code, when we use a variable before the variable is declared, an exception is not thrown, but undefined is returned. This is because JavaScript automatically floats variable declarations to the front of functions or globals. For example, the following code:

/**
* 全局变量上浮
*/
console.log(x === undefined); // logs "true"
var x = 3;

/**
* 方法变量上浮
*/
var myvar = "my value";
// 打印变量myvar结果为：undefined
(function() {
console.log(myvar); // undefined
var myvar = "local value";
})();

The above code and the following code are equivalent:

/**
* 全局变量上浮
*/
var x;
console.log(x === undefined); // logs "true"
x = 3;

/**
* 方法变量上浮
*/
var myvar = "my value";
(function() {
var myvar;
console.log(myvar); // undefined
myvar = "local value";
})();

Global variables: In the page, the global object is window, so we can access global variables through window. variable. For example:

version = "1.0.0";
console.log(window.version); //输出1.0.0

No2. Data structure and type

1. Data type

6 basic types: Boolean (true or false), null (js is case-sensitive and is different from Null and NULL), undefined, Number, String, Symbol (marked as unique and immutable)

An object type: object.

Object and function: Objects serve as containers of values, and functions serve as application procedures.

　2. Data conversion

Function: The parseInt and parseFloat methods can be used to convert strings into numbers.

ParseInt: The function signature is parseInt(string, radix), radix is ​​a number from 2 to 36 representing the digital base, such as decimal or hexadecimal. The return result is integer or NaN. For example, the output results below are all 15.

parseInt("0xF", 16);
parseInt("F", 16);
parseInt("17", 8);
parseInt(021, 8);
parseInt("015", 10);
parseInt(15.99, 10);
arseInt("15,123", 10);
parseInt("FXX123", 16);
parseInt("1111", 2);
parseInt("15*3", 10);
parseInt("15e2", 10);
parseInt("15px", 10);

ParseFloat: The function signature is parseFloat(string), and the return result is a number or NaN. For example:

parseFloat("3.14"); //返回数字
parseFloat("314e-2"); //返回数字
parseFloat("more non-digit characters"); //返回NaN

　3. Data type textualization

Textualization type: Array, Boolean, Floating-point, integers, Object, RegExp, String.

Extra commas in Array: ["Lion", , "Angel"], the length is 3, and the value of [1] is undefiend. ['home', , 'school', ], the last comma is omitted so the length is 3. [ , 'home', , 'school'], length is 4. ['home', , 'school', , ], length is 4.

integer integer: Integer can be expressed as decimal, octal, hexadecimal, binary. For example:

0, 117 and -345 //十进制
015, 0001 and -0o77 //八进制
0x1123, 0x00111 and -0xF1A7 //十六进制
0b11, 0b0011 and -0b11 1234 //二进制

Floating point number: [(+|-)][digits][.digits][(E|e)[(+|-)]digits]. For example:

3.1415926，-.123456789，-3.1E+12（3100000000000），.1e-23（1e-24）

Object: The attribute value of the object can be obtained through ".property" or "[property name]". For example:

var car = { manyCars: {a: "Saab", "b": "Jeep"}, 7: "Mazda" };
console.log(car.manyCars.b); // Jeep
console.log(car[7]); // Mazda

Object attributes: The attribute name can be any string or an empty string. Invalid names can be enclosed in quotation marks. Complex names cannot be obtained through ., but can be obtained through []. For example:

var unusualPropertyNames = {
"": "An empty string",
"!": "Bang!"
}
console.log(unusualPropertyNames.""); // SyntaxError: Unexpected string
console.log(unusualPropertyNames[""]); // An empty string
console.log(unusualPropertyNames.!); // SyntaxError: Unexpected token !
console.log(unusualPropertyNames["!"]); // Bang!

Escape characters: The following string output contains double quotes because the escape symbol "\"" is used.

var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service.";
console.log(quote);
//输出：He read "The Cremation of Sam McGee" by R.W. Service.1。

String wrapping method: Directly in the character Add "\" at the end of the serial, as shown in the following code:

var str = "this string \
is broken \
across multiple\
lines."
console.log(str); // this string is broken across multiplelines.

No3. Control flow and error handling

　1. Block expression

Function: Block expressions are generally used for control flow, such as if, for, while. In the following code, {x++;} is a block declaration.

while (x < 10) {
x++;
}

Before ES6, there was no block scope. The variables defined in the block are actually included in the method or the global scope, and the influence of the variable exceeds the scope of the block. For example, the final execution result of the following code is 2, because the variables declared in the block act on the method

var x = 1;
{
var x = 2;
}
console.log(x); // outputs 2

　There is block scope after ES6: In ES6, we can change the block scope declaration var to let, so that the variable only scopes the block scope.

Special values ​​judged as false: false, undefined, null, 0, NaN, "".

Simple boolean and object Boolean types: false and true of simple boolean type and object Boolean type. There is a difference between false and true. They are not equal. As in the following example:

var b = new Boolean(false);
if (b) // 返回true
if (b == true) // 返回false

No4. Exception handling

Throw exception syntax: Throw exception can be of any type as shown below.

throw "Error2"; // 字符串类型
throw 42; // 数字类型
throw true; // 布尔类型
throw {toString: function() { return "I'm an object!"; } }; //对象类型

Custom exception:

// 创建一个对象类型UserException
function UserException(message) {
this.message = message;
this.name = "UserException";
}

//重写toString方法，在抛出异常时能直接获取有用信息
UserException.prototype.toString = function() {
return this.name + ': "' + this.message + '"';
}

// 创建一个对象实体并抛出它
throw new UserException("Value too high");

Keywords: Use try{}catch(e){}finally{} syntax, similar to C# syntax

Finally return value: If finaly adds a return statement, no matter what the entire try.catch returns. The return values ​​are finally returns as follows:

function f() {
    try {
        console.log(0);
        throw "bogus";
    } catch(e) {
        console.log(1);
        return true; // 返回语句被暂停，直到finally执行完成
        console.log(2); // 不会执行的代码
    } finally {
        console.log(3);
        return false; //覆盖try.catch的返回
        console.log(4); //不会执行的代码
    }
    // "return false" is executed now 
    console.log(5); // not reachable
}
f(); // 输出 0, 1, 3; 返回 false

　　finally吞并异常：如果finally有return并且catch中有throw异常。throw的异常不会被捕获，因为已经被finally的return覆盖了。如下代码所示：

function f() {
    try {
        throw "bogus";
    } catch(e) {
        console.log('caught inner "bogus"');
        throw e; // throw语句被暂停，直到finally执行完成
    } finally {
        return false; // 覆盖try.catch中的throw语句
    }
    // 已经执行了"return false"
}

try {
    f();
} catch(e) {
    //这里不会被执行，因为catch中的throw已经被finally中的return语句覆盖了
    console.log('caught outer "bogus"');
}
// 输出
// caught inner "bogus"

　　系统Error对象：我们可以直接使用Error{name, message}对象，例如：throw (new Error('The message'));

 以上就是面试开发常用的 JavaScript 知识点总结的内容，更多相关内容请关注PHP中文网（m.sbmmt.com）！