> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트 코드 작성 시 나쁜 습관 5가지, 총에 맞을까?

자바스크립트 코드 작성 시 나쁜 습관 5가지, 총에 맞을까?

PHPz
풀어 주다: 2018-09-30 13:45:56
원래의
1480명이 탐색했습니다.

이 글에서는 자바스크립트 코드 작성의 나쁜 습관 5가지를 주로 소개합니다. , 이 장에서는 네임스페이스 사용 실패, 변수 정의, 자바스크립트의 변수 범위, 자바스크립트의 객체 지향, 새 키워드 등의 문제를 지적합니다. 필요한 친구가 참고할 수 있습니다.

Javascript는 인터넷에서 나쁜 평판을 갖고 있지만 그만큼 역동적이고 널리 사용되며 우리 삶에 뿌리를 둔 다른 언어를 찾기가 어렵습니다. 학습 임계값이 낮기 때문에 많은 사람들이 이를 유아용 스크립트 언어라고 부릅니다. 사람들이 이를 비웃는 또 다른 점은 동적 언어의 개념이 높은 표준의 정적 데이터 유형을 사용한다는 것입니다. 사실, 당신과 Javascript는 잘못된 편에 있고 이제 당신은 Javascript를 매우 화나게 만들고 있습니다. 귀하의 JavaScript 기술이 형편없는 5가지 이유는 다음과 같습니다.

1. 네임스페이스를 사용하지 않습니다.

대학 선생님께서 숙제할 때 전역 변수를 사용하지 말라고 하셨던 것을 기억하시나요? Javascript에서 전역 변수를 사용하는 것도 예외는 아닙니다. 조심하지 않으면 웹 페이지는 인터넷의 모든 곳에서 상호 침해하는 스크립트와 스크립트 라이브러리로 가득 차 혼란스러워질 것입니다. 변수 loader()의 이름을 지정하면 문제가 발생합니다. 함수를 깨닫지 못한 채 오버로드하면 Javascript는 전혀 알림을 보내지 않습니다. 당신은 그것을 유치원 프로그래밍 언어라고도 불렀습니다. 기억하시나요? 내가 말하려는 것은, 이 일을 한 후에 무슨 일이 일어나는지 알아야 한다는 것입니다.

function derp(){ alert(“one”); }
function derp(){ alert(“two”); }
derp();
로그인 후 복사

'둘', 정답은 '둘'입니다. 반드시 이런 식일 필요는 없으며 "하나"일 수도 있습니다. 따라서 모든 코드를 자체 네임스페이스에 넣는 것이 쉽습니다. 자신만의 네임스페이스를 정의하는 간단한 방법은 다음과 같습니다.

var foospace={};
foospace.derp=function(){ alert(“one”); }
function derp(){ alert(“two”); }
foospace.derp();
로그인 후 복사

2. 변수를 하나씩 정의하는군요.

설명할 수 없는 숫자와 문자의 조합을 변수 이름으로 사용하는 것은 손실이 많은 결과입니다. 40줄의 코드 블록에서 의미 없는 문자 변수를 찾는 것은 유지 관리에 있어서 악몽입니다. 변수의 첫 번째 선언을 40줄의 코드 블록에 혼합하는 것도 악몽입니다. 이러한 변수를 직접 만나더라도 "이것은 어디에 정의되어 있지?"라고 자문하지 않을 수 없습니다. 그런 다음 신속하게 Ctrl F 조합을 사용하여 소스 코드에서 이 변수가 원래 정의된 위치를 찾습니다. 아니요, 그러지 마세요. 오히려 Javascript를 남용하는 것이며 어리석은 접근 방식입니다. 항상 범위의 최상위에 변수를 정의해야 합니다. 꼭 필요하지 않다고 해서 하지 않아도 된다는 뜻은 아닙니다.

function(){
var a,//description
b; //description
//process…
}
로그인 후 복사

3. Javascript 변수 범위를 이해하지 못합니다.

당신은 먹는 것이 C이고 하는 것이 리스트입니다. 변수 범위가 무엇인지 알고 변수를 완벽하게 제어할 수 있으며 왕처럼 감시할 수 있습니다. 하지만 자바스크립트는 커피에 똥을 싸서 웃게 만듭니다.

var herp=”one”;
{
var herp=”two”;
}
alert(herp);
로그인 후 복사

이 경우 얻는 약초는 "하나"가 아니라 "둘"입니다. Javascript의 변수 범위는 다른 언어와 마찬가지로 코드 블록에 의존하지 않습니다. Javascript의 변수 범위는 함수를 기반으로 합니다. 각 함수에는 고유한 변수 범위가 있으며 Javascript는 이에 대해 훌륭하며 중괄호로 묶인 의미 없는 범위를 무시합니다. 실제로 Javascript는 네임스페이스나 변수와 같은 변수 범위를 전달할 수도 있을 정도로 훌륭합니다.

4. 자바스크립트의 객체지향 기능을 접목한 것이라고 생각하시나요?

Javascript는 처음부터 객체지향 언어였습니다. Javascript의 모든 것은 객체입니다. 숫자나 문자와 같은 문자 기호도 고유한 생성자를 통해 객체로 변환될 수 있습니다. 다른 객체지향 언어와 비교하여 Javascript는 클래스가 없다는 점에서 다릅니다. Javascript 객체는 함수처럼 정의되며 함수 자체도 객체입니다. Javascript에는 프로토타입이라는 속성이 있습니다. 이 속성을 사용하여 객체의 구조를 변경하고, 객체를 수정하고, 더 많은 변수를 추가할 수 있습니다.

var derp; //will hold a Herp instance
var Herp= function(){
this.opinion=”Javascript is cooler than BASIC.”;
}
Herp.prototype.speak=function(){ alert(this.opinion); }
var derp= new Herp();
derp.speak();
로그인 후 복사

이것이 당신과 관련이 없다고 생각된다면 Google은 사람들이 지식을 배울 수 있도록 돕는 데 능숙한 나의 좋은 친구 Google을 소개하고 싶습니다. 객체지향은 나의 짧고 이목을 끄는 기사에 비해 너무 큰 주제입니다.

5. 'new'라는 키워드를 사용하면 눈먼 사람, 눈먼 말과 같습니다.

Javascript가 첫 번째 여자친구임에 틀림없어요. 당황한 것 같으니까요. 실제 사람처럼 자바스크립트를 즐기고 싶다면 객체 표기법을 이해해야 합니다. 개체를 인스턴스화해야 하는 경우나 데이터 로드를 지연해야 하는 드문 경우를 제외하면 기본적으로 new 키워드를 사용할 필요가 없습니다. JavaScript에서 많은 수의 새 변수의 주소를 할당하는 것은 느린 작업이므로 효율성을 위해 항상 객체 표기법을 사용해야 합니다.

var rightway= [1, 2, 3];
var wrongway= new Array(1, 2, 3);
로그인 후 복사

是否还记得我说过Javascript的变量范围是以函数为基础的?是否还记得有人说Javascript的对象像函数那样定义?如果你不使用new关键字来声明一个对象,你将会使这个对象成为全局范围内的对象。所以,永远使用new关键字来声明对象是一个好习惯。

var derp=”one”;
var Herp=function(){
this.derp=”two”;
}
var foo=Herp();
alert(derp);
로그인 후 복사

如果你这样写,Javascript并不会在意,而你真正弹出的答案是“two”!有很多方法可以防止对象做出这样的行为,可以以使用instanceOf,但更好的方法是正确的使用new关键字,这样显得更专业。

现在你知道你的Javascript代码写的很烂了吧,如果你记住了上面所说的东西,你的代码就会有所改善。更多相关教程请访问JavaScript视频教程

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿