Java/C 개발자가 알아야 할 3 개의 JavaScript 기발함

코어 포인트

C 또는 Java와 달리 JavaScript의 범위는

또는

에 선언 된 변수가 기능 기반입니다.
• JavaScript의 고도는 변수 및 함수 선언이 컴파일 중에 포함 된 범위의 상단으로 이동하지만 초기화는 상승하지 않음을 의미합니다. if JavaScript의 기능은 일류 시민으로 취급되므로 변수에 저장되고 매개 변수로 전달되며 다른 기능에 의해 반환되며 객체와 같은 속성이 있습니다. for JavaScript의 명령문 (동적 범위 변수)은 런타임 오류를 유발할 수 있고 본질적으로 혼란스러워서 더 이상 사용되지 않았습니다.
JavaScript는 클로저를 지원하여 기능이 반환 후 외부 기능의 변수에 액세스 할 수 있도록하여 데이터 개인 정보를 향상시키고 모듈 및 개인 변수와 같은 강력한 프로그래밍 모드를 가능하게합니다.
• JavaScript는기만적인 언어 일 수 있습니다. 100% 일관성이 없기 때문에 고통 스러울 수 있습니다. 피해야 할 혼란 스럽거나 중복 된 함수의 일부 나쁜 부분이있는 것으로 알려져 있습니다. 악명 높은 진술, 암시 적 글로벌 변수 및 비교 행동 예외는 아마도 가장 유명합니다. JavaScript는 역사상 가장 성공적인 불꽃 생성기 중 하나입니다! 대부분의 프로그래머는 두 가지 이유로 JavaScript를 싫어하는 결함 (새로운 ECMAScript 사양에서 부분적으로 해결) 외에도 JavaScript 언어와 동일하다고 생각합니다. - C 및 Java와 같은 언어에서 JavaScript로 이동했습니다. JavaScript의 구문은 그것이 그 명령적인 언어와 같은 방식으로 작동한다고 믿게되었습니다. 이 오해는 혼란, 좌절 및 오류로 이어질 수 있습니다.
이것이 보통 JavaScript가 그럴만 한 가치가있는 명성을 가진 이유입니다. 내 경력에서 나는 몇 가지 패턴을 발견했습니다. Java 또는 C/C 배경을 가진 대부분의 개발자는 JavaScript에서 동일한 언어 기능을 생각하며 완전히 다릅니다. 이 기사는 Java 접근 방식을 JavaScript 접근법과 비교하여 차이점을 보여주고 JavaScript의 모범 사례를 강조하는 가장 번거로운 언어 기능을 수집합니다.
• with 스코프
• 대부분의 개발자는 JavaScript가 그렇게해야하기 때문에 JavaScript를 사용하기 시작하며 거의 모든 개발자가 언어를 배우는 데 시간을 보내기 전에 코드를 작성하기 시작합니다. 그러한 각 개발자는 적어도 한 번은 JavaScript 범위에 속했다. JavaScript의 구문은 C- 시리즈의 구문과 매우 유사하기 때문에 (의도적으로) 기능 본문을 중괄호로 분리하면 사람들은 어휘

  블록 레벨 범위를 합리적으로 기대할 것입니다. 불행히도 이것은 그렇지 않습니다. 첫째, JavaScript에서 가변 범위는 괄호가 아닌 함수에 의해 결정됩니다. 다시 말해서, 신체가 새로운 범위를 만들지 않는 경우, 신체에 선언 된 변수는 실제로 홍보됩니다. 둘째, 진술의 존재는 JavaScrip 스코프가 동적이되도록하며 런타임까지 결정할 수 없습니다. with 진술의 사용이 더 이상 사용되지 않았다는 사실에 놀라지 않을 수 있습니다. 가없는 javaScript는 실제로 어휘 스코프 언어가 될 것입니다. 즉, 코드를 보면 범위를 완전히 결정할 수 있습니다. 공식적으로 JavaScript에서는 범위를 높이는 4 가지 방법이 있습니다 .- 언어 정의 : 기본적으로 모든 스코프에는 이름 with 및 가 포함됩니다. - 공식 매개 변수 : 함수에 대해 선언 된 모든 (공식) 매개 변수의 범위는 함수의 본문에 속합니다. - 기능 선언. - 변수 선언. with 또 다른 복잡성은 this 키워드에서 선언되지 않은 (암시 적으로) 변수 할당의 암시 적 범위에 의해 발생합니다. 이 광기는 명시 적 바인딩없이 함수를 호출 할 때 (다음 섹션에서 더) 글로벌 범위를 arguments 참조로 암시 적으로 할당합니다. 세부 사항을 파헤 치기 전에 혼란을 피하기 위해 어떤 좋은 패턴을 사용할 수 있는지 명확히 해보자 해당 블록 내에서 기능의 선언 및 IF 블록 내에서 및 IF IF 선언 (이것은 다른 이유로이 기사의 범위를 벗어납니다).

  고도 고도는 진술의 실제 행동을 설명하기위한 단순화 된 방법입니다. 프로모션 된 변수는 포함 된 함수의 시작 부분에서 선언되며 var로 초기화됩니다. 그런 다음 과제는 원래 선언의 실제 줄에서 발생합니다. 다음 예를 참조하십시오 : this 콘솔에 인쇄 할 값은 얼마입니까? 다음 출력에 놀랐습니까?

  table.sp_table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
  }
  table.sp_table td, table.sp_table th {
    border: solid 1px #ccc;
    padding: 10px;
    line-height: 1.5;
    text-align: center;
    width: 20%;
  }
  table.sp_table tr td:first-child {
    font-weight: bold;
  }

  <🎜 🎜> <🎜 🎜> 블록에서 <🎜 🎜> 명령문은 변수 <인지도의 로컬 사본을 선언하는 것이 아니라 이전에 선언 된 변수를 덮어 씁니다. 첫 번째 <<> 명령문은 변수

  의 실제 값을 인쇄하며, 이는 if로 초기화됩니다. var 지시를 함수의 첫 번째 줄로 사용하여 테스트 할 수 있습니다. 엄격한 모드에서는 변수를 사용하기 전에 선언해야하지만 JavaScript 엔진이 선언으로 인해 오류를보고하지 않는지 확인할 수 있습니다. 그건 그렇고, i 재고로 인해 오류를보고하지 않을 것입니다. 그러한 오류를 잡으려면 Jshint 또는 JSlint와 같은 Linter를 사용하여 코드를 처리하는 것이 좋습니다. 이제 변수 선언의 다른 오류가 발생하기 쉬운 사용법을 강조하기 위해 다른 예를 살펴 보겠습니다. console.log 는 다르게 기대할 수 있지만 i undefined라는 변수의 로컬 사본이 <🎜 🎜> 함수 내부에서 선언되기 때문에 <🎜 🎜> 본문이 실행되며 <🎜 🎜>에 의해 홍보됩니다. 유형의 필수 작업도 여기에서도 작동합니다. "use strict"; 함수 선언 및 함수 표현식 var 고도는 변수에 적용 할 수있을뿐만 아니라 <🎜 🎜> 함수 표현식 <🎜

  (실제로 변수) 및 <🎜 🎜> 함수 선언

  function myFunction() {
    console.log(i);
    var i = 0;
    console.log(i);
    if (true) {
      var i = 5;
      console.log(i);
    }
    console.log(i);
  }

  도 홍보됩니다. 이 주제는 여기보다 더 신중하게 처리되어야하지만, 요소는 선언이 범위의 시작 부분으로 이동한다는 점을 제외하고는 함수 표현과 거의 동일하게 행동합니다. 기능 선언의 동작을 보여주는 다음 예를 고려하십시오.

  이제 기능 표현의 동작을 보여주는 다음 예와 비교하십시오. if 이러한 개념에 대한 추가 이해는 참조 섹션을 참조하십시오. test() <🎜 🎜> 다음 예제는 런타임에서만 범위를 결정할 수있는 상황을 보여줍니다. notNull <🎜 🎜>에 <🎜 🎜>라는 필드가 있으면 <🎜 🎜>는 <🎜 🎜>를 반환하고, 그렇지 않으면 123이 반환됩니다. 이 코딩 실무는 런타임 오류의 원인 일 수 있으므로 문을 피하는 것이 좋습니다.

  앞으로도 : ecmascript 6
  ecmascript 6 사양은 블록 레벨 범위를 추가하기 위해 다섯 번째 메소드를 추가합니다 :

  문. 다음 코드를 고려하십시오 ECMAScript 6에서 의 본문 내부에서 를 사용하여 블록에 새로운 변수를 생성하기 위해 를 사용합니다. 비표준 대안으로서,

  블록은 다음과 같이 선언 할 수 있습니다.

  <code>undefined
  0
  5
  5</code>

  위 코드에서는 변수 <🎜 🎜 <p> 및 </p>가 블록 내에 만 존재합니다. 글을 쓰는 시점에서 크롬의 경우에도 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>var notNull = 1; function test() { if (!notNull) { console.log(&quot;Null-ish, so far&quot;, notNull); for(var notNull = 10; notNull &lt; 20; notNull++) { //.. } console.log(&quot;Now it's not null&quot;, notNull); } console.log(notNull); }</pre><div class="contentsignin">로그인 후 복사</div></div>에 대한 지원이 제한적입니다. <p> <ary> 스코프 요약 <🎜 🎜> <summ> 다음 표는 다른 언어로 된 범위를 요약합니다.<table> <thead> <tr> <th>特性</th> <th>Java</th> <th>Python</th> <th>JavaScript</th> <th>警告</th> </tr> </thead> <tbody> <tr> <td>作用域</td> <td>词法（块）</td> <td>词法（函数、类或模块）</td> <td>是</td> <td>它与 Java 或 C 的工作方式大相径庭</td> </tr> <tr> <td>块作用域</td> <td>是</td> <td>否</td> <td><code>let 关键字（ES6） 再一次警告：这不是 Java！ 提升 不可能！ 否 是 仅提升变量和函数表达式的声明。对于函数声明，也会提升定义 函数 作为内置类型 是 是 回调/命令模式对象（或 Java 8 的 lambda） 动态创建 否 否 eval – Function 对象 eval 存在安全问题，Function 对象可能无法按预期工作 属性 否 否 可以具有属性 无法限制对函数属性的访问 闭包 弱化，只读，在匿名内部类中 弱化，只读，在嵌套的 def 中 是 内存泄漏

  <<> 함수 JavaScript의 또 다른 오해의 특징은 기능, 특히 Java와 같은 명령적인 프로그래밍 언어에서 기능 개념이 없다는 것입니다. 실제로 JavaScript는 기능적 프로그래밍 언어입니다. 글쎄, 그것은 Haskell과 같은 순수한 기능 프로그래밍 언어가 아닙니다. 결국에는 여전히 명령적인 스타일이 있으며 Scala와 마찬가지로 허용하는 것보다는 돌연변이를 장려합니다. 그러나 JavaScript는 부작용이없는 기능 호출과 함께 순전히 기능적인 프로그래밍 언어로 사용할 수 있습니다.

  일류 시민 <🎜

  JavaScript의 함수는 문자열 및 숫자와 같은 다른 유형과 같이 처리 될 수 있습니다. 변수로 저장하고 함수에 매개 변수로 전달되고 함수에 의해 반환되고 배열에 저장 될 수 있습니다. 함수는 또한 속성을 가질 수 있으며 동적으로 변경 될 수 있습니다.

  .

  객체 <🎜 🎜> 대부분의 JavaScript 초보자에게 매우 놀라운 사실은 기능이 실제로 객체라는 것입니다. JavaScript에서 각 함수는 실제로 기능 객체입니다. 함수 생성자 새 기능 객체를 만듭니다

  이것은 다음과 거의 같습니다

  나는 함수 생성자를 사용하는 것이 효율적이지 않고 익명 함수를 생성하며 생성 컨텍스트에 대한 클로저를 생성하지 않기 때문에 거의 동일하다고 말합니다. 기능 객체는 항상 전역 범위에서 생성됩니다. 함수 (함수 유형)는 객체에 구축됩니다. 이것은 당신이 선언하는 모든 함수를 확인하여 쉽게 볼 수 있습니다 :

  이것은 함수가 속성을 가질 수 있음을 의미합니다. 이들 중 일부는 이름이나 길이와 같은 생성 시간에 함수에 할당됩니다. 이 속성은 각각 함수 정의에서 이름과 매개 변수 수를 반환합니다. 다음 예를 고려하십시오 :

  그러나 모든 기능에 대한 새로운 속성을 직접 설정할 수도 있습니다.

  <<> 함수 요약 <🎜 🎜> 다음 표는 Java, Python 및 JavaScript의 함수를 설명합니다.

  <<> 닫는 내가 좋아하는 JavaScript 기능을 선택하라는 요청을 받으면 망설임없이 클로저를 선택합니다. JavaScript는 폐쇄를 도입 한 최초의 주류 프로그래밍 언어입니다. 아시다시피, Java와 Python은 오랫동안 동봉 된 스코프의 값 만 읽을 수있는 버전의 폐쇄 버전을 약화 시켰습니다. 예를 들어, Java에서 익명의 내부 클래스는 특정 제한 사항이있는 폐쇄 기능을 제공합니다. 예를 들어, 최종 로컬 변수는 범위에서만 사용할 수 있습니다. 더 정확하게는 그 값을 읽을 수 있습니다. JavaScript를 사용하면 외부 범위 변수 및 기능에 대한 전체 액세스 권한이 있습니다. 필요한 경우 로컬 정의에 의해 읽고, 쓰고, 심지어 숨겨 질 수도 있습니다. 스코프 섹션에서 이러한 모든 경우의 예를 볼 수 있습니다. 더 흥미로운 점은 클로저에서 생성 된 기능이 생성 된 환경을 기억한다는 것입니다. 클로저와 기능 중첩을 결합하면 외부 기능이 실행되지 않고 내부 기능을 반환 할 수 있습니다. 또한, 선언하는 함수의 실행이 종료 되었음에도 불구하고 내부 함수의 폐쇄에서 외부 함수의 로컬 변수를 오랫동안 지속 할 수 있습니다. 이것은 매우 강력한 기능이지만 JavaScript 응용 프로그램에서 메모리 누출의 일반적인 원인이므로 단점도 있습니다. 몇 가지 예는 이러한 개념을 설명 할 것입니다 :

  위의 함수는 생성 된 환경을 추적하는 다른 함수를 생성하고 반환합니다. 변수

  table.sp_table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
  }
  table.sp_table td, table.sp_table th {
    border: solid 1px #ccc;
    padding: 10px;
    line-height: 1.5;
    text-align: center;
    width: 20%;
  }
  table.sp_table tr td:first-child {
    font-weight: bold;
  }

  가 할당 될 때 의 실행이 완료되지만, 로컬 변수

  는 의 폐쇄에 남아 있으므로 신체 내부에 접근 할 수 있습니다. 다시 를 실행하려면 의 항목이 다른 새로운 폐쇄를 만듭니다. makeCounter() 더 흥미롭게 만들기 위해 counter 함수를 업데이트하여 매개 변수를 수락 할 수 있습니다. makeCounter() 외부 기능 매개 변수도 폐쇄에 저장되므로 이번에는 로컬 변수를 선언 할 필요가 없습니다. 각 통화 는 우리가 설정 한 초기 값을 기억하고 계속 계산합니다. 클로저는 여러 기본 JavaScript 패턴에 필수적입니다. 네임 스페이스, 모듈, 개인 변수, 메모리가 가장 유명합니다. 예를 들어, 객체에 대한 개인 변수를 시뮬레이션하는 방법을 살펴 보겠습니다. i 이 패턴을 사용하여 클로저를 사용하여 속성 이름에 대한 래퍼를 만들고 자체 세터와 게터를 사용할 수 있습니다. ES5는 getters and setter를 사용하여 속성에 대한 객체를 만들 수 있고 최고의 곡물에서 특성 자체에 대한 액세스를 제어 할 수 있기 때문에 훨씬 쉽게 만듭니다. displayCounter 폐쇄 요약 다음 표는 Java, Python 및 JavaScript의 폐쇄를 설명합니다.

  特性	Java	Python	JavaScript	警告
  闭包	弱化，只读，在匿名内部类中	弱化，只读，在嵌套的 def 中	是	内存泄漏
  记忆化模式	必须使用共享对象	可以使用列表或字典	是	最好使用惰性求值
  命名空间/模块模式	不需要	不需要	是
  私有属性模式	不需要	不可能	是	可能令人困惑

  결론

  이 기사에서는 다른 언어, 특히 Java 및 C의 개발자가 종종 오해하는 JavaScript의 세 가지 기능을 소개합니다. 특히, 우리는 범위, 홍보, 기능 및 폐쇄와 같은 개념에 대해 논의합니다. 이 주제를 파헤치려면 다음은 다음과 같이 읽을 수있는 몇 가지 기사 목록입니다 .- JavaScript의 범위 - 함수 선언 및 기능 표현 - 문 및

  블록

  . JavaScript 기능 (FAQ)에 대한 FAQ JavaScript에서 "=="과 "==="의 차이점은 무엇입니까? let JavaScript에서 "=="및 "==="는 비교 연산자이지만 다르게 작동합니다. "=="연산자를 느슨한 평등 연산자라고합니다. 필요한 유형 변환을 수행 한 후 두 값이 동일한지 여부를 비교합니다. 즉, 숫자를 숫자를 가진 문자열과 비교하면 true가 반환됩니다. 예를 들어, "5"== 5는 true를 반환합니다. 반면에 "==="는 엄격한 평등 연산자입니다. 유형 변환을 수행하지 않으므로 두 값 유형이 다르면 False를 반환합니다. 예를 들어, "5"=== 5는 문자열이고 다른 하나는 숫자이기 때문에 false를 반환합니다. let JavaScript가 무효와 정의되지 않은 이유는 무엇입니까?

  JavaScript에서는 NULL 및 UNDEFINED가 존재하지 않는 특수 값입니다. 그러나 약간 다르게 사용됩니다. 정의되지 않은 것은 변수가 선언되었지만 아직 할당되지 않았 음을 의미합니다. 반면 NULL은 할당 값으로 값이 없거나 객체가 없음을 나타냅니다. 변수의 값이 존재하지 않음을 의미하지만 정의되지 않은 것은 변수 자체가 존재하지 않음을 의미합니다.

  JavaScript의 개선은 무엇입니까?

  고도는 변수와 함수 선언을 컴파일 단계에서 포함 된 범위의 상단으로 이동시키는 자바 스크립트의 메커니즘입니다. 이는 변수와 함수를 선언하기 전에 변수와 함수를 사용할 수 있음을 의미합니다. 그러나 선언 만 홍보되며 초기화는 홍보되지 않습니다. 변수를 사용한 후에 변수가 선언되고 초기화되면 값은 정의되지 않습니다.

  JavaScript의 글로벌 변수와 로컬 변수의 차이점은 무엇입니까?

  JavaScript에서 변수는 글로벌 또는 로컬 변수 일 수 있습니다. 글로벌 변수는 기능 외부에서 선언 된 변수이거나 "var"키워드로 선언 된 변수입니다. 스크립트의 모든 함수에서 액세스 할 수 있습니다. 반면에 로컬 변수는 "var"키워드를 사용하여 함수 내에서 선언 된 변수입니다. 선언하는 함수 내에서만 액세스 할 수 있습니다.

  JavaScript의"이 "키워드는 무엇입니까?

  JavaScript의"이 "키워드는 특수 키워드이며, 이는 함수를 호출하는 컨텍스트를 나타냅니다. 그 값은 함수 호출 방식에 따라 다릅니다. 방법에서 "이"는 소유자 객체를 나타냅니다. 개별적으로, "이것은"는 글로벌 객체를 나타냅니다. 함수에서 "This"는 글로벌 객체를 나타냅니다. 이벤트에서 "이"는 이벤트를받는 요소를 나타냅니다.

  JavaScript의 폐쇄는 무엇입니까?

  JavaScript의 클로저는 자체 범위, 외부 함수의 범위 및 글로벌 범위뿐만 아니라 액세스 기능 매개 변수 및 변수에 액세스 할 수있는 함수입니다. 이를 통해 기능이 반환 된 외부 함수의 변수에 액세스하여 변수를 메모리에 유지하고 데이터 개인 정보 및 기능 공장을 허용합니다.

  JavaScript의 함수 선언과 함수 표현식의 차이점은 무엇입니까?

  JavaScript에서 기능은 여러 가지 방법으로 정의 될 수 있으며 그 중 두 가지는 기능 선언 및 기능 표현입니다. 함수 선언은 명명 된 함수를 정의하고 선언이 촉진되어 기능을 정의하기 전에 사용할 수 있습니다. 함수 표현식은 표현식에서 함수를 정의하고 홍보되지 않으므로 정의 전에 사용할 수 없습니다.

  JavaScript에서 "let", "var"및 "const"의 차이점은 무엇입니까?

  JavaScript의 객체와 어레이의 차이점은 무엇입니까?

  JavaScript에서 객체와 배열은 데이터를 저장하는 데 사용되지만 다른 방식으로 저장됩니다. 객체는 각 속성이 키 값 쌍인 속성 모음입니다. 키는 문자열이며 값은 모든 데이터 유형 일 수 있습니다. 배열은 항목 목록을 나타내는 특수 유형의 객체입니다. 키는 숫자 인덱스이며 값은 모든 데이터 유형 일 수 있습니다.

  JavaScript의 메소드와 함수의 차이점은 무엇입니까?

  JavaScript에서 함수는 특정 작업을 수행하도록 설계된 코드 블록이며 필요에 따라 사용할 수있는 별도의 엔티티입니다. 반면에, 메소드는 객체와 관련된 함수, 즉 메소드는 객체의 특성입니다. 메소드는 객체의 속성으로 값을 할당해야한다는 점을 제외하고는 일반 함수와 동일한 방식으로 정의됩니다.

위 내용은 Java/C 개발자가 알아야 할 3 개의 JavaScript 기발함의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!