간과하기 쉬운 JavaScript 지식 포인트

이번에는 간과하기 쉬운 JavaScript에 대한 지식 포인트를 알려드리겠습니다. JavaScript에 관해 간과하기 쉬운 주의 사항은 무엇인지 살펴보겠습니다.

1. 객체의 모든 키를 가져옵니다.

var arr = ['a', 'b', 'c'];Object.keys(arr ); //["0","1","2"]var obj={name:Jack,age:12}Object.keys(obj)//["name","age"]Object.getOwnPropertyNames(obj)

2. 함수

name 속성의

속성 및 메서드: function 키워드 바로 다음에 오는 함수 이름을 반환합니다.

function f1() {}
f1.name // 'f1'var f2 = function () {};
f2.name // ''var f3 = function myName() {};
f3.name // 'myName'

length 속성: 함수에 전달될 것으로 예상되는 매개변수 수, 즉 함수 정의의 매개변수 수를 반환합니다.

function f(a, b) {}
f.length // 2

함수의 toString 메소드는 함수의 소스 코드를 반환합니다.

function f() {
  a();
  b();
  c();
}
f.toString()// function f() {//  a();//  b();//  c();// }

3 일반적으로 eval의 가장 일반적인 경우는 JSON 데이터 문자열을 구문 분석하는 것이지만 올바른 접근 방식은 브라우저에서 제공하는 JSON.parse 메서드를 사용하는 것입니다.

4.Bit 연산자를 사용하여 직접 조작합니다. 바이너리 비트 계산에는 총 7개가 있습니다.

Or 연산(또는): 기호는 |입니다. 즉, 두 이진 비트가 모두 0이면 결과는 0이고, 그렇지 않으면 1입니다.

And 연산(and): 기호는 &입니다. 즉, 두 이진 비트가 모두 1이면 결과는 1이고, 그렇지 않으면 0입니다.

연산 없음(not): 기호는 ~입니다. 이는 이진 비트 반전을 의미합니다.

배타적 OR 연산(xor): 기호는 ^입니다. 즉, 두 이진 비트가 동일하지 않으면 결과는 1이고, 그렇지 않으면 0입니다.

왼쪽 시프트 연산(왼쪽 시프트): 기호는 7c2cd660f92dfc8838f8a0e1dacd18ae>입니다.
오른쪽 시프트 연산자는 숫자의 이진 값을 지정된 자릿수만큼 오른쪽으로 이동하여 머리 부분을 0으로 채우는 것, 즉 지정된 2의 거듭제곱으로 나누는 것을 의미합니다(가장 높은 비트인 부호 비트는 운동에 참여하지 않음)

4 > 10진수로 2
*/-4 >> ; 1// -2/*
// -4의 이진수 형식은 11111111111111111111111111100이므로,
// 한 자리 오른쪽으로 이동하고 1을 더합니다. 111111111111111111111111111110,
// 십진법에서는 -2입니다.
*/


부호 비트를 사용한 오른쪽 시프트 연산(0으로 채워진 오른쪽 시프트): 기호는 > 따라서 이 작업은 항상 양수 값을 반환합니다. 양수의 경우 이 연산의 결과는 오른쪽 시프트 연산자(»)와 정확히 동일합니다. 주요 차이점은 음수의 경우

4 >>> 1// 2-4 >> 1// 2147483646/*

// -4의 이진 형식은 1111111111111111111111111111100이므로,
// 부호 비트를 1비트 오른쪽으로 이동하고 0111111111111111111111111111110을 얻습니다.

// 십진수로 2147483646입니다.

*/


5. JavaScript의 기본 오류 유형

SyntaxError는 코드를 구문 분석할 때 발생하는 구문 오류입니다.

// 变量名错误var 1a;// 缺少括号console.log 'hello');

ReferenceError는 존재하지 않는 변수를 참조할 때 발생하는 오류입니다.

unknownVariable// ReferenceError: unknownVariable is not definedconsole.log() = 1// ReferenceError: Invalid left-hand side in assignmentthis = 1// ReferenceError: Invalid left-hand side in assignment

RangeError는 값이 유효한 범위를 벗어날 때 발생하는 오류입니다. 몇 가지 주요 상황이 있습니다. 하나는 배열 길이가 음수이고, 다른 하나는 Number 객체의 메서드 매개변수가 범위를 벗어났으며, 함수 스택이 최대값을 초과하는 것입니다.

new Array(-1)// RangeError: 잘못된 배열 길이(1234).toExponential(21)// RangeError: toExponential() 인수는 0에서 20 사이여야 합니다.

TypeError는 변수나 매개변수가 다음과 같지 않을 때 발생합니다. 예상되는 유형 오류입니다. 예를 들어 문자열, 부울 값, 숫자 값과 같은 기본 유형에 대해 new 명령을 사용하는 경우 new 명령의 매개변수가 생성자여야 하므로 이 오류가 발생합니다.

new 123//TypeError: number is not a funcvar obj = {};
obj.unknownMethod()// TypeError: obj.unknownMethod is not a function

URIError는 URI 관련

함수의 매개변수

가 올바르지 않을 때 발생하는 오류입니다. 주로 encodeURI(), decodeURI(), encodeURIComponent(), decodeURIComponent(), escape() 및 unescape() 6개 함수와 관련됩니다.

decodeURI('%2')// URIError: URI malformed

eval 함수가 올바르게 실행되지 않으면 EvalError가 발생합니다. 이 오류 유형은 더 이상 ES5에 나타나지 않으며 이전 코드와의 호환성을 보장하기 위해서만 유지됩니다. 6. 사용자 정의 오류

function UserError(message) {   this.message = message || "默认信息";   this.name = "UserError";
}
UserError.prototype = new Error();
UserError.prototype.constructor = UserError;

위 코드는 오류 개체 UserError를 사용자 정의하고 Error 개체를 상속할 수 있도록 합니다. 그런 다음 이 사용자 지정 오류를 생성할 수 있습니다.

new UserError("커스텀 오류입니다!");

7. JavaScript 프로그래밍 스타일

Indentation

스페이스 또는 탭 키 들여쓰기를 선택하세요. 하나만 선택할 수 있습니다. 프로젝트를 중간에 추가하는 경우 혼동하지 마세요. 원래 프로그램의 스타일을 따릅니다.

Block

블록 시작 부분의 중괄호는 아래와 같이 새 줄에서 시작해서는 안 되며 블록 바로 뒤에 와야 합니다.

block{
    ···
}

Parenthes

함수가 호출될 때 공백이 없음을 나타냅니다. 함수 이름과 왼쪽 대괄호 사이.

은 함수를 정의할 때 함수 이름과 왼쪽 대괄호 사이에 공백이 없어야 함을 의미합니다.

其他情况时，前面位置的语法元素与左括号之间，都有一个空格。

行尾的分号
建议不要省略

全局变量
JavaScript最大的语法缺点，可能就是全局变量对于任何一个代码块，都是可读可写。这对代码的模块化和重复使用，非常不利。
因此，避免使用全局变量。如果不得不使用，用大写字母表示变量名，比如UPPER_CASE。

变量声明
JavaScript会自动将变量声明”提升”（hoist）到代码块（block）的头部。

if (!o) {  var o = {};
}// 等同于var o;if (!o) {
  o = {};
}

为了避免可能出现的问题，最好把变量声明都放在代码块的头部。

for (var i = 0; i < 10; i++) {  // ...}// 写成var i;for (i = 0; i < 10; i++) {  // ...}

另外，所有函数都应该在使用之前定义，函数内部的变量声明，都应该放在函数的头部。

new命令
JavaScript使用new命令，从构造函数生成一个新对象。

var o = new myObject();

上面这种做法的问题是，一旦你忘了加上new，myObject()内部的this关键字就会指向全局对象，导致所有绑定在this上面的变量，都变成全局变量。
因此，建议使用Object.create()命令，替代new命令。如果不得不使用new，为了防止出错，最好在视觉上把构造函数与其他函数区分开来。比如，构造函数的函数名，采用首字母大写（InitialCap），其他函数名一律首字母小写。

with语句
禁止使用with语句。

相等和严格相等
不要使用“相等”（==）运算符，只使用“严格相等”（===）运算符。

语句的合并
有些程序员追求简洁，喜欢合并不同目的的语句。比如，原来的语句是

a = b;if (a) {  // ...}```

他喜欢写成下面这样。

if (a = b) {
// ...
}

虽然语句少了一行，但是可读性大打折扣，而且会造成误读，让别人误解这行代码的意思是下面这样。

```if （a === b）{  // ...}```

建议不要将不同目的的语句，合并成一行。
- 自增和自减运算符
自增（++）和自减（--）运算符，放在变量的前面或后面，返回的值不一样，很容易发生错误。事实上，所有的++运算符都可以用+= 1代替。

- switch…case结构switch...case结构要求，在每一个case的最后一行必须是break语句，否则会接着运行下一个case。这样不仅容易忘记，还会造成代码的冗长。
而且，switch...case不使用大括号，不利于代码形式的统一。此外，这种结构类似于goto语句，容易造成程序流程的混乱，使得代码结构混乱不堪，不符合面向对象编程的原则。

function doAction(action) {
switch (action) {
case 'hack':
return 'hack';
break;
case 'slash':
return 'slash';
break;
case 'run':
return 'run';
break;
default:
throw new Error('Invalid action.');
}
}

上面的代码建议改写成对象结构。

function doAction(action) {
var actions = {
'hack': function () {
return 'hack';
},
'slash': function () {
return 'slash';
},
'run': function () {
return 'run';
}
};
if (typeof actions[action] !== 'function') {
throw new Error('Invalid action.');
}
return actionsaction;
}```

建议避免使用switch...case结构，用对象结构代替。

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

Javascript的策略模式

用JS实现排序算法

위 내용은 간과하기 쉬운 JavaScript 지식 포인트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!