모든 JavaScript 프로그래머가 알아야 할 사항은 무엇입니까? [닫은]

모든 JavaScript 프로그래머가 "I JavaScript를 알고 있습니다"라고 말할 수있는 사항이 있습니까?

jQuery가 아닙니다. 유이 아닙니다. 불가 (등 등)

프레임 워크는 유용 할 수 있지만 JavaScript와 DOM이 실제로 어떻게 작동하는지 가끔 추악한 세부 정보를 숨기는 경우가 많습니다. 당신의 목표가 "I JavaScript를 알고있다"고 말할 수 있다면, 프레임 워크에 많은 시간을 투자하는 것이 반대입니다.

다음은 JavaScript가 수행하는 작업을 파악하고 이해하지 못하도록 알아야하는 JavaScript 언어 기능입니다. 그러나 많은 사람들에게 즉시 명백하지는 않습니다.

• 그것 object.prop과 object['prop']같은 것입니다 (그래서 eval감사합니다.) 해당 객체 속성은 항상 문자열입니다 (배열의 경우에도). 어떤 것은 for... in입니다 (그리고 그것이 무엇되지 않습니다 ).

• 속성 스니핑; 무엇 undefined인가 (그리고 왜 냄새가 나는가 ); 왜 겉보기 알려지지 in오퍼레이터의 도움과 다르다 typeof/ undefined체크; hasOwnProperty; 의 목적 delete.

• 그 Number데이터 형식 정말 플로트이다; 플로트 사용의 언어 독립적 어려움; parseInt8 진 함정을 피하십시오 .

• 중첩 된 함수 범위; var우발적 인 글로벌을 피하려는 범위에서 사용해야 할 필요성 ; 클로저에 스코프를 사용하는 방법; 폐쇄 루프 문제 .

• 전역 변수와 window속성이 충돌하는 방식; 전역 변수와 문서 요소가 충돌하지 않고 IE에서 수행되는 방식; var이것을 피하기 위해 글로벌 범위에서도 사용의 필요성 .

• 어떻게 function문 '으로 역할을 감아 '을 위의 코드 전에 정의; 함수 문과 함수 표현식의 차이점; 명명 된 함수 표현식 을 사용하지 않아야하는 이유 .

• 생성자 함수, prototype속성 및 new연산자의 실제 작동 방식 이것을 이용하여 실제로 원하는 일반 클래스 / 서브 클래스 / 인스턴스 시스템을 만드는 방법 ; 프로토 타이핑 대신 클로저 기반 객체를 사용하려는 경우 (대부분의 JS 튜토리얼 자료는 이것에 대해 절대적으로 끔찍합니다.

• this제한이 아닌 콜 타임에 어떻게 결정 됩니까 ? 결과적으로 메소드 전달 이 다른 언어에서 예상 한 것처럼 작동하지 않는 방법 ; 클로저 또는 Function#bind그 문제를 해결하는 데 사용될 수 있습니다.

• 다른 인 ECMAScript 5 판은 같은 기능 indexOf, forEach및 기능 - 프로그래밍 방법에 대한Array ; 오래된 브라우저를 수정하여 사용할 수 있도록하는 방법; 인라인 익명 함수 표현식과 함께 사용하여 압축 가능하고 읽기 쉬운 코드를 얻습니다.

• 브라우저와 사용자 코드 간의 제어 흐름 동기식 및 비동기식 실행; 제어 흐름 내에서 발생하는 이벤트 (예 : 포커스) vs. 제어가 반환 될 때 발생하는 이벤트 및 시간 초과; 아마도 동기식 내장을 호출하면 alert잠재적으로 재앙이 발생할 수 있습니다.

• 어떻게 교차 창 스크립트가 영향을 instanceof; 교차 창 스크립팅이 다른 문서의 제어 흐름에 미치는 영향 어떻게 postMessage희망이 문제를 해결합니다.

마지막 두 항목에 대해서는 이 답변을 참조하십시오 .

무엇보다도 역사적으로 불완전한 언어 (대부분의 언어보다 더 많은 언어)이기 때문에 JavaScript를 비판적으로보고, 최악의 문제 지점을 피해야합니다. 이 부분에 대한 Crockford의 연구는 확실히 읽을만한 가치가 있습니다 (그러나 100 %가“좋은 부품”에 동의하지는 않지만).

비활성화 할 수 있습니다.

Crockford의 Javascript : The Good Parts 로 작성된 내용을 이해 하는 것은 사람이 괜찮은 JS 프로그래머라는 가정입니다.

JQuery와 같은 좋은 라이브러리를 사용하는 방법을 알 수 있지만 여전히 Javascript의 숨겨진 부분을 알 수는 없습니다.

또 다른 참고 사항은 다양한 브라우저의 디버깅 도구입니다. JS 프로그래머는 다른 브라우저에서 코드를 디버깅하는 방법을 알아야합니다.

오! 그리고 JSLint를 아는 것은 당신의 감정을 완전히 해칠 것입니다!

당신이 진정한 JavaScript 닌자가되고 싶다면 Perfection kills JavaScript Quiz 의 모든 질문에 대한 답을 알아야합니다 .

식욕을 자극하는 예 :

(function f(f){ 
  return typeof f(); 
})(function(){ return 1; });

이 표현은 무엇을 반환합니까?

• "번호"
• "찾으시는 주소가 없습니다"
• "함수"
• 오류

당신이 모른다면 당신은 JavaScript를 모른다.

1. 폐쇄
2. 프로토 타입 기반 상속
3. 모듈 패턴
4. W3C-DOM
5. 이벤트 작동 방식

.. 그 자바 스크립트는 자바가 아닙니다 :)

웹 사이트 개발을 시작한 많은 사람들이 자바 스크립트가 단순한 자바라고 말해주었습니다!

1. 하나 이상의 Javascript 라이브러리 (Jquery, Prototype 등)에 익숙해 지십시오.

2. 주요 브라우저 (MSIE 7-8, Firefox, Chrome, Safari)의 디버깅 도구 사용 방법 알아보기

3. 업계를 읽으십시오 : Douglas Crockford의 웹 사이트는 보물입니다. Ajaxian.com은 Javascript에 대한 새롭고 흥미롭고 이상한 아이디어를 유지하는 좋은 블로그입니다. 다른 많은 자료들이 있지만 그것들은 저에게 가장 큰 도움이되었습니다.

자바 스크립트 객체와 기능 등의 일류 시민 , 콜백 ,하지 잊어 이벤트 다음과 JQuery와 .

그 자바 스크립트는 한 시간 안에 배울 수있는 것이 아닙니다!

로컬로 선언되지 않는 한 변수는 전역입니다!

불량 (DoSomething ()은 10 회만 호출 됨) :

function CountToTen()
{
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

양호 (DoSomething ()은 의도 한대로 50 번 호출 됨) :

function CountToTen()
{
  var i;
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  var i;
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

좋은 부품 을 사용하는 방법과 끔찍한 부품을 피하는 방법 .

Javascript의 원래 이름은 LiveScript 이고 Java와 Javascript가 관련되어 있지 않기 때문에 'Java'접두어가 마케팅 목적으로 첨부되었습니다.

아 그리고 David Flanagan의 'Javascript : The Definitive Guide' (이 정보는 2 페이지에 있음) 를 소유하고 있습니다.

... 그리고 Jquery와 같은 사람들이 고통을 덜어주기 전에 Internet Explorer 4의 document.all [] 및 Netscape Navigator 4의 document.layers []를 난독 화하려고 시도했던 사람들에게 감사드립니다.

편집하다:

@Kinopiko가 지적한 것처럼 JavaScript는 원래 프로젝트 Mocha ( 일부 소스 는 프로젝트 LiveWire라고도 함)라고 지적했지만 Java 접두어가 채택되기 전에 언어 (Brendan Eich가 작성)가 LiveScript로 릴리스 될 것으로 일반적으로 인정됩니다 1996 년 초에 출시되었습니다.

다음은 "I JavaScript를 알고 있습니다"라는 것을 알고 있어야합니다.

1. JavaScript는 좋지만 DOM은 문제입니다
2. 크로스 브라우저 문제 는 당신을 미치게 만들 수 있습니다
3. 코드가 4 가지 다른 브라우저에서 테스트 되지 않으면 버그가 없다고 말할 수 없습니다
4. 마감 .............. 알아야합니다
5. 그것의 프로토 타입 기반 ........... 이것을 배우는 재미 하나
6. 디버거 키워드 ..... 위기에 도움

그 JavaScript는 생각보다 다른 언어와 훨씬 다릅니다. 이 멋진 Google Tech Talk를보고 인상을 얻으십시오. http://www.youtube.com/watch?v=hQVTIJBZook

모든 자바 스크립트 코더가 알아야 할 것은 무엇입니까?

2 번의 클릭으로 노력을 끌 수 있습니다. 따라서 가능한 경우 대체를 제공하십시오.

나는 자바 스크립트 를 읽는 것이 좋습니다 : 좋은 부분

Array, Number, String, Date 및 Object를 효과적으로 사용할 수 있다면 Javascript를 알고 있습니다. 수학 및 정규식에 대한 플러스 포인트. 함수를 작성하고 변수를 사용할 수 있어야합니다 (예 : 객체의 '방법').

클로저, 사치스러운 함수 구문, blabla에 대한 의견이 있습니다. 이 질문과는 전혀 관련이 없습니다. 그것은 11 초 이내에 100m 대시를 실행할 수 있다면 당신이 러너라고 말하는 것과 같습니다.

자바 스크립트에 능숙 해지는 데 몇 주가 걸릴 수 있다고합니다. 그 후 전문가, 닌자 등이 되려면 수십 권의 책과 수천 줄의 프로그래밍이 필요합니다.

그러나 그것은 질문이 아닙니다.

아, 그리고 DOM은 자바 스크립트의 일부가 아니며 jQuery도 아닙니다. 그래서 나는 둘 다 질문과 똑같이 관련이 없다고 생각합니다.

JSLint http://www.JSLint.com/

위의 모든 읽기 데, 그것은 또한입니다 완벽하게 정상적으로 jQuery를 같은 프레임 워크를 사용하여 자바 스크립트를 배울 수 있습니다. 진실은 많은 사람들이 처음으로 JS를 집어 들었던 첫 번째 방법이라는 것입니다. 부끄러운 일이 아닙니다.

배열 . lengthmethod는 배열 항목의 개수가 아니라 가장 높은 색인입니다. 항목이 설정된 경우에도undefined

var a = [];
a.length;   // === 0
a[10];      // === undefined
a[10] = undefined;
a.length;   // === 11
a.pop();    // === undefined
a.length;   // === 10

이 동작은 언어 디자인 버그와 거의 구별되지 않습니다.

jQuery가 가장 좋습니다. 코드 자체뿐만 아니라 관용구, 스타일, 에뮬레이션에 가장 적합한 관념입니다.

이 자바 스크립트는 세계에서 가장 널리 사용되는 언어입니다. (아마)

언어를 정말 잘 배우고 다양한 특성을 이해하는 것은 수년간의 경험에서 비롯됩니다. 더 나은 프로그래머가 되려면 디자인 패턴, 사용 방법 및시기를 이해하고 /하거나 심지어 그것을 인식하지 않고 사용할 때조차 이해해야합니다. 기술 아키텍처 및 사용자 경험.

(JavaScript) 언어를 아는 것은 모든 프레임 워크를 선택하여 마음대로 사용할 수 있음을 의미합니다. 필연적으로 소스 코드를 살펴볼 필요가 있으며, 구문 또는 프레임 워크 또는 2 또는 3 구문 만 알고 있다면 멀지 않을 것입니다. 즉, 몇 가지 다른 프레임 워크의 소스 코드에 들어가는 것이 JavaScript 사용 방법을 보는 가장 좋은 방법 중 하나 일 것입니다. Firebug 또는 Web Inspector에서 코드를 단계별로 살펴본 다음 JavaScript 설명서, 특히 Mozilla 및 Webkit 문서를 확인하여 현재보고있는 내용을 더 잘 이해할 수 있습니다.

객체 지향 프로그래밍과 함수형 프로그래밍의 차이점을 이해하면 JavaScript는이 둘의 완벽한 조합이며 킬러 코드베이스와 멋진 응용 프로그램을 만들기 위해 두 가지를 언제 어떻게 사용하여 더 나은 JavaScript 프로그래머가 될 수 있습니다.

일부 책, 특히 Crockford의 "좋은 부분"을 읽으면 JavaScript의 좋은 점에 대한 의견을 제시 할뿐 아니라 JavaScript의 가장 멋진 부분을 건너 뛰면 잘못 갈 수 있습니다.

반면 Thomas Fuchs와 같은 누군가가 작성한 코드를 확인하면 놀랍고 효율적인 JavaScript를 작성하는 힘에 대해 훨씬 더 많은 통찰력을 얻을 수 있습니다.

몇 가지 문제 나 WTF를 외우려고해도 큰 도움이되지 않을 것입니다. 코딩을 시작하고 라이브러리 / 프레임 워크의 코드, 특히 유용한 코드가있는 코드를 통해 스테핑 한 이유는 무엇입니까? 특정 피연산자와 연산자를 사용하는 것이 좋은 이유와시기에 다른 속성이 아닌 속성 / 값은 프레임 워크의 사람들이 사용하는 코드에 있습니다. 예를 들어 배우는 것보다 낫습니까? : ^)

자바 스크립트에서는 성능이 중요합니다.

코드를 최적화하는 지능형 컴파일러가 없으므로 C #, Java와 같은 언어보다 자바 스크립트 코드를 작성하는 동안 더 조심해야합니다 ...

객체 리터럴은 쓰기가 너무 좋기 때문에.

다음 사항도 중요합니다.

1) 가변 호이 스팅. 2) 범위 체인 및 활성화 개체.

그리고 다음과 같은 것들 : :)

3) wtfjs.com

4) 모든 것이 객체입니다 http://www.lifeinafolder.com/images/Js.jpg

1. with()선의 유무에 관계없이 선을 그리는 삶이 있다는 것을 아는 것 .
2. throw자바 스크립트 런타임을 의도적으로 중지하기 위해 명령문으로 사용자 정의 오류를 작성할 수 있습니다 .

JavaScript는 다음 코드와 같이 줄 바꿈 문자로 return 키워드와 return 문을 분리하는 것을 지원하지 않습니다 (또는 내 jsFiddle 페이지 에서 시도 하십시오 )

function foo()
{
    return
    {
        bar: 'something'
    };
}

$(function()
{
    document.write(foo());
});

JavaScript가 기본 스타일의 JavaScript와 비교할 때 매우 복잡한 JavaScript 소스 코드를 읽는 것이 훨씬 쉽기 때문에 JavaScript가이 스타일을 지원하지 않는 이유를 이해하지 못합니다.

추신. 거의 6 년 동안 JavaScript를 작성했습니다. 그러나 다음 기능을 실행하려고 할 때이 버그를 발견했습니다. 항상 undefined를 반환합니다. 디버거를 사용 하고이 기능을 시작하면 모든 것이 잘 작동합니다. 내 인생에서 최악의 프로그래밍 버그라고 생각합니다.

function JqGridInlineEditor_GenerateTool(cellvalue, options, rowObject, disableEdit, disableDelete)
{
    return 
        (!disableEdit ? '<a class="button edit" href="javascript: void(0);" onclick="JqGridInlineEditor_EditRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Edit.gif'), 'Click here to Edit or \nDouble-click row to edit.') : '') +
        (!disableDelete ? '<a class="button delete" href="javascript: void(0);" onclick="JqGridInlineEditor_DeleteRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Delete.png'), 'Click here to Delete or \nSelect row and then press Delete') : '') +
        (!disableEdit ? '<a class="button save" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_SaveRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Save.png'), 'Click here to Save or \nPress Enter') : '') +
        (!disableEdit ? '<a class="button cancel" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_RestoreRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Cancel.png'), 'Click here to Cancel or \nPress Esc') : '');
}

JS는 기능적 언어이므로 괜찮은 JS 프로그래머는 Y- 컴 바이 네이터를 작성하고 어떻게 작동하는지 설명 할 수 있어야합니다.

... Google Web Toolkit 에 대하여는 자바 스크립트 프로젝트가 훨씬 더 편리한 방식으로 개발 될 수 있음을 의미합니다.