diff options
Diffstat (limited to 'files/ko/web/javascript')
20 files changed, 170 insertions, 170 deletions
diff --git a/files/ko/web/javascript/reference/classes/index.html b/files/ko/web/javascript/reference/classes/index.html index 8bb836788a..3e6bfc0a8f 100644 --- a/files/ko/web/javascript/reference/classes/index.html +++ b/files/ko/web/javascript/reference/classes/index.html @@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Classes <p>Class를 정의하는 한 가지 방법은 <strong>class 선언</strong>을 이용하는 것입니다. class를 선언하기 위해서는 클래스의 이름(여기서 "Rectangle")과 함께 <code>class</code> 키워드를 사용해야 합니다.</p> -<pre class="brush: js notranslate">class Rectangle { +<pre class="brush: js ">class Rectangle { constructor(height, width) { this.height = height; this.width = width; @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Classes <p><strong>함수 선언</strong>과 <strong>클래스 선언</strong>의 중요한 차이점은 험수의 경우 정의하기 하기 전에 호출할 수 있지만, 클래스는 반드시 정의한 뒤에 사용할 수 있다는 점입니다. 다음 코드는 {{jsxref("ReferenceError")}}를 던질 것입니다.</p> -<pre class="brush: js example-bad notranslate">const p = new Rectangle(); // ReferenceError +<pre class="brush: js example-bad ">const p = new Rectangle(); // ReferenceError class Rectangle {} </pre> @@ -37,7 +37,7 @@ class Rectangle {} <p><strong>Class 표현식</strong>은 class를 정의하는 또 다른 방법입니다. Class 표현식은 이름을 가질 수도 있고, 갖지 않을 수도 있습니다. 이름을 가진 class 표현식의 이름은 클래스 body의 local scope에 한해 유효합니다. (하지만, 클래스의 (인스턴스 이름이 아닌) {{jsxref("Function.name", "name")}} 속성을 통해 찾을 수 있습니다).</p> -<pre class="brush: js notranslate">// unnamed +<pre class="brush: js ">// unnamed let Rectangle = class { constructor(height, width) { this.height = height; @@ -80,7 +80,7 @@ console.log(Rectangle.name); <p>{{jsxref("Functions/Method_definitions", "메서드 정의", "", "true")}}도 참조해보세요.</p> -<pre class="brush: js notranslate">class Rectangle { +<pre class="brush: js ">class Rectangle { constructor(height, width) { this.height = height; this.width = width; @@ -103,7 +103,7 @@ console.log(square.area); // 100</pre> <p>{{jsxref("Classes/static", "static", "", "true")}} 키워드는 클래스를 위한 정적(static) 메서드를 정의합니다. 정적 메서드는 클래스의 인스턴스화(<a href="https://developer.mozilla.org/ko/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript#The_object_(class_instance)" title='An example of class instance is "var john = new Person();"'>instantiating</a>) 없이 호출되며, 클래스의 인스턴스에서는 호출할 수 없습니다. 정적 메서드는 어플리케이션(application)을 위한 유틸리티(utility) 함수를 생성하는 데 주로 사용됩니다. 반면, 정적 속성은 캐시, 고정 환경설정 또는 인스턴스 간에 복제할 필요가 없는 기타 데이터에 유용합니다.</p> -<pre class="brush: js notranslate">class Point { +<pre class="brush: js ">class Point { constructor(x, y) { this.x = x; this.y = y; @@ -132,7 +132,7 @@ console.log(Point.distance(p1, p2)); // 7.0710678118654755</pre> <p>메서드를 변수에 할당 한 다음 호출하는 것과 같이, 정적 메서드나 프로토타입 메서드가 {{jsxref("Operators/this", "this")}} 값 없이 호출될 때, <code>this</code> 값은 메서드 안에서 <code>undefined</code>가 됩니다. 이 동작은 {{jsxref("Strict_mode", "\"use strict\"")}} 명령어 없이도 같은 방식으로 동작하는데, <code>class</code> 문법 안에 있는 코드는 항상 strict mode 로 실행되기 때문입니다.</p> -<pre class="brush: js notranslate">class Animal { +<pre class="brush: js ">class Animal { speak() { return this; } @@ -152,7 +152,7 @@ eat(); // undefined</pre> <p>위에 작성된 코드를 전통적 방식의 함수기반의 non–strict mode 구문으로 재작성하면, <code>this</code> 메서드 호출은 기본적으로 {{Glossary("Global_object", "전역 객체")}}인 초기 <code>this</code> 값에 자동으로 바인딩 됩니다. Strict mode에서는 자동 바인딩이 발생하지 않습니다; <code>this</code> 값은 전달된 대로 유지됩니다.</p> -<pre class="brush: js notranslate">function Animal() { } +<pre class="brush: js ">function Animal() { } Animal.prototype.speak = function() { return this; @@ -173,7 +173,7 @@ eat(); // global object (in non-strict mode)</pre> <p>인스턴스 속성은 반드시 클래스 메서드 내에 정의되어야 합니다:</p> -<pre class="brush: js notranslate">class Rectangle { +<pre class="brush: js ">class Rectangle { constructor(height, width) { this.height = height; this.width = width; @@ -182,7 +182,7 @@ eat(); // global object (in non-strict mode)</pre> <p>정적 (클래스사이드) 속성과 프로토타입 데이터 속성은 반드시 클래스 선언부 바깥쪽에서 정의되어야 합니다. </p> -<pre class="brush: js notranslate">Rectangle.staticWidth = 20; +<pre class="brush: js ">Rectangle.staticWidth = 20; Rectangle.prototype.prototypeWidth = 25; </pre> @@ -196,7 +196,7 @@ Rectangle.prototype.prototypeWidth = 25; <p>자바스크립트의 필드 선언 문법을 사용해서 위의 예제는 아래와 같이 다시 쓰여질 수 있습니다.</p> -<pre class="brush: js notranslate">class Rectangle { +<pre class="brush: js ">class Rectangle { height = 0; width; constructor(height, width) { @@ -215,7 +215,7 @@ Rectangle.prototype.prototypeWidth = 25; <p>private 필드를 사용하면 아래와 같이 예제를 개선할 수 있습니다.</p> -<pre class="brush: js notranslate">class Rectangle { +<pre class="brush: js ">class Rectangle { #height = 0; #width; constructor(height, width) { @@ -238,7 +238,7 @@ Rectangle.prototype.prototypeWidth = 25; <p>{{jsxref("Classes/extends", "extends")}} 키워드는 <em>클래스 선언</em>이나 <em>클래스 표현식</em>에서 다른 클래스의 자식 클래스를 생성하기 위해 사용됩니다.</p> -<pre class="brush: js notranslate">class Animal { +<pre class="brush: js ">class Animal { constructor(name) { this.name = name; } @@ -265,7 +265,7 @@ d.speak(); // Mitzie barks.</pre> <p>또한 es5에서 사용되던 전통적인 함수 기반의 클래스를 통하여 확장할 수도 있습니다.</p> -<pre class="brush: js notranslate">function Animal (name) { +<pre class="brush: js ">function Animal (name) { this.name = name; } @@ -286,7 +286,7 @@ d.speak(); // Mitzie barks. <p>클래스는 생성자가 없는 객체(non-constructible)을 확장할 수 없습니다. 만약 기존의 생성자가 없는 객체을 확장하고 싶다면, 이 메서드를 사용하세요. {{jsxref("Object.setPrototypeOf()")}}:</p> -<pre class="brush: js notranslate">const Animal = { +<pre class="brush: js ">const Animal = { speak() { console.log(`${this.name} makes a noise.`); } @@ -310,7 +310,7 @@ d.speak(); // Mitzie makes a noise.</pre> <p>예를 들어, {{jsxref("Array.map", "map()")}}과 같은 기본 생성자를 반환하는 메서드를 사용할 때 이 메서드가 MyArray 객체 대신 <code>Array</code> 객체가 반환하도록 하고 싶을 것입니다. {{jsxref("Symbol.species")}} 심볼은 이러한 것을 가능하게 해줍니다:</p> -<pre class="brush: js notranslate">class MyArray extends Array { +<pre class="brush: js ">class MyArray extends Array { // 부모 Array 생성자로 species 덮어쓰기 static get [Symbol.species]() { return Array; } } @@ -324,7 +324,7 @@ console.log(mapped instanceof Array); // true</pre> <p>{{jsxref("Operators/super", "super")}} 키워드는 객체의 부모가 가지고 있는 메서드를 호출하기 위해 사용됩니다. 이는 프로토타입 기반 상속보다 좋은 점 중 하나입니다.</p> -<pre class="brush: js notranslate">class Cat { +<pre class="brush: js ">class Cat { constructor(name) { this.name = name; } @@ -352,7 +352,7 @@ l.speak(); <p>슈퍼클래스를 인자로 받고 이 슈퍼클래스를 확장하는 서브클래스를 생성하여 반환하는 함수를 사용하여 ECMAScript에서 믹스-인을 구현할 수 있습니다:</p> -<pre class="brush: js notranslate">var calculatorMixin = Base => class extends Base { +<pre class="brush: js ">var calculatorMixin = Base => class extends Base { calc() { } }; @@ -362,7 +362,7 @@ var randomizerMixin = Base => class extends Base { <p>위 믹스-인을 사용하는 클래스는 다음과 같이 작성할 수 있습니다:</p> -<pre class="brush: js notranslate">class Foo { } +<pre class="brush: js ">class Foo { } class Bar extends calculatorMixin(randomizerMixin(Foo)) { }</pre> <h2 id="클래스_재정의">클래스 재정의</h2> diff --git a/files/ko/web/javascript/reference/classes/private_class_fields/index.html b/files/ko/web/javascript/reference/classes/private_class_fields/index.html index ea5508ab27..0e31821cb3 100644 --- a/files/ko/web/javascript/reference/classes/private_class_fields/index.html +++ b/files/ko/web/javascript/reference/classes/private_class_fields/index.html @@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Classes/Private_class_fields <h2 id="Syntax">Syntax</h2> -<pre class="notranslate">class ClassWithPrivateField { +<pre >class ClassWithPrivateField { #privateField } @@ -35,7 +35,7 @@ class ClassWithPrivateStaticField { <p>static 메소드에서만 static 변수들을 호출할 수 있다는 제약은 그대로 유지된다.</p> -<pre class="notranslate">class ClassWithPrivateStaticField { +<pre >class ClassWithPrivateStaticField { static #PRIVATE_STATIC_FIELD static publicStaticMethod() { @@ -52,7 +52,7 @@ console.assert(ClassWithPrivateStaticField.publicStaticMethod() === 42)</pre> <p>이는 <code>this</code> 를 사용함에 있어 예상치 못한 동작을 야기할 수 있다.</p> -<pre class="notranslate">class BaseClassWithPrivateStaticField { +<pre >class BaseClassWithPrivateStaticField { static #PRIVATE_STATIC_FIELD static basePublicStaticMethod() { @@ -77,7 +77,7 @@ console.assert(error instanceof TypeError)</pre> <p>캡슐화(encapsulation) 는 언어로부터 강제된다(enforced by the language). 즉, scope 밖에서 <code>#</code> 이름에 접근하는 것은 syntax error 이다.</p> -<pre class="notranslate">class ClassWithPrivateField { +<pre >class ClassWithPrivateField { #privateField constructor() { @@ -97,7 +97,7 @@ instance.#privateField === 42 // Syntax error</pre> <p>private static 메소드는 generator, async 그리고 async generator 함수가 될 수 있다.</p> -<pre class="notranslate">class ClassWithPrivateStaticMethod { +<pre >class ClassWithPrivateStaticMethod { static #privateStaticMethod() { return 42 } @@ -116,7 +116,7 @@ console.assert(ClassWithPrivateStaticMethod.publicStaticMethod2() === 42);</pre> <p>이는 <code>this</code> 를 사용할 때 예상치 못한 동작을 발생시킬 수 있다. (이는 <code>this</code> binding rule 이 적용되기 때문이다.) 다음 예시에서 <code>Derived.publicStaticMethod2()</code> 를 호출할 때, <code>this</code> 는 class <code>Derived</code> (<code>Base</code> 가 아니라) 를 가리킨다. </p> -<pre class="notranslate">class Base { +<pre >class Base { static #privateStaticMethod() { return 42; } @@ -137,7 +137,7 @@ console.log(Derived.publicStaticMethod2()); // TypeError</pre> <p>private 인스턴스 메소드는 private 인스턴스 필드와는 다르게 class 인스턴스로부터 접근 가능하다.</p> -<pre class="notranslate">class ClassWithPrivateMethod { +<pre >class ClassWithPrivateMethod { #privateMethod() { return 'hello world' } @@ -153,7 +153,7 @@ console.log(instance.getPrivateMessage()) <p>private 인스턴스 메소드는 generator, async 그리고 async generator 함수가 될 수 있다. private getter 와 setter 또한 가능하다:</p> -<pre class="notranslate">class ClassWithPrivateAccessor { +<pre >class ClassWithPrivateAccessor { #message get #decoratedMessage() { diff --git a/files/ko/web/javascript/reference/functions/arrow_functions/index.html b/files/ko/web/javascript/reference/functions/arrow_functions/index.html index cff8d043ae..2a12888f65 100644 --- a/files/ko/web/javascript/reference/functions/arrow_functions/index.html +++ b/files/ko/web/javascript/reference/functions/arrow_functions/index.html @@ -27,7 +27,7 @@ original_slug: Web/JavaScript/Reference/Functions/애로우_펑션 <h3 id="기본_구문">기본 구문</h3> -<pre class="syntaxbox notranslate"><strong>(</strong><em>param1</em>, <em>param2</em>, …, <em>paramN</em><strong>) => {</strong> <em>statements</em> <strong>}</strong> +<pre class="syntaxbox "><strong>(</strong><em>param1</em>, <em>param2</em>, …, <em>paramN</em><strong>) => {</strong> <em>statements</em> <strong>}</strong> <strong>(</strong><em>param1</em>, <em>param2</em>, …, <em>paramN</em><strong>) =></strong> <em>expression</em> // 다음과 동일함: => { return expression; } @@ -40,7 +40,7 @@ original_slug: Web/JavaScript/Reference/Functions/애로우_펑션 <h3 id="고급_구문">고급 구문</h3> -<pre class="syntaxbox notranslate">// 객체 리터럴 표현을 반환하기 위해서는 함수 본문(body)을 괄호 속에 넣음: +<pre class="syntaxbox ">// 객체 리터럴 표현을 반환하기 위해서는 함수 본문(body)을 괄호 속에 넣음: <em>params</em> => ({<em>foo: bar</em>}) // <a href="/ko/docs/Web/JavaScript/Reference/Functions/rest_parameters">나머지 매개변수</a> 및 <a href="/ko/docs/Web/JavaScript/Reference/Functions/Default_parameters">기본 매개변수</a>를 지원함 @@ -64,7 +64,7 @@ f(); // 6 <p>일부 함수 패턴에서는, 짧은 함수가 환영받습니다. 비교해 보세요:</p> -<pre class="notranslate">var elements = [ +<pre >var elements = [ 'Hydrogen', 'Helium', 'Lithium', @@ -114,7 +114,7 @@ elements.<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map" <p>이는 객체 지향 스타일로 프로그래밍할 때 별로 좋지않습니다.</p> -<pre class="brush: js notranslate">function Person() { +<pre class="brush: js ">function Person() { // Person() 생성자는 `this`를 자신의 인스턴스로 정의. this.age = 0; @@ -130,7 +130,7 @@ var p = new Person();</pre> <p>ECMAScript 3/5 에서는, 이 문제를 <code>this</code> 값을 폐쇄될 수 있는 (비전역) 변수에 할당하여 해결했습니다.</p> -<pre class="brush: js notranslate">function Person() { +<pre class="brush: js ">function Person() { var that = this; that.age = 0; @@ -146,7 +146,7 @@ var p = new Person();</pre> <p>따라서 다음 코드에서 <code>setInterval</code>에 전달 된 함수 내부의 <code>this</code>는 <code>setInterval</code>을 포함한 function의 <code>this</code>와 동일한 값을 갖습니다.</p> -<pre class="brush: js notranslate">function Person(){ +<pre class="brush: js ">function Person(){ this.age = 0; setInterval(() => { @@ -160,7 +160,7 @@ var p = new Person();</pre> <p><code>this</code>가 렉시컬(lexical, 정적)임을 감안하면, <code>this</code>에 관한 <a href="/ko/docs/Web/JavaScript/Reference/Strict_mode">엄격 모드</a> 규칙은 그냥 무시됩니다.</p> -<pre class="notranslate">var f = () => { 'use strict'; return this; }; +<pre >var f = () => { 'use strict'; return this; }; f() === window; // 혹은 전역객체</pre> <p>엄격 모드의 나머지 규칙은 평소대로 적용합니다.</p> @@ -173,7 +173,7 @@ f() === window; // 혹은 전역객체</pre> <p>This code sample using Chrome 81 demonstrates that arrow functions allow the creation of global variables in such situations (both for a concise body and for a normal function body):</p> -<pre class="notranslate">> f1 = x => { y = x; console.log(`x: ${x}, y: ${y}`); return x + 1; } +<pre >> f1 = x => { y = x; console.log(`x: ${x}, y: ${y}`); return x + 1; } x => { y = x; console.log(`x: ${x}, y: ${y}`); return x + 1; } > y @@ -230,7 +230,7 @@ VM51891:1 Uncaught ReferenceError: z1 is not defined <p>화살표 함수에서는 <code>this가 </code> 바인딩되지 않았기 때문에, <code>call()</code> 또는 <code>apply()</code> 메서드는 인자만 전달 할 수 있습니다. this는 무시됩니다.</p> -<pre class="brush: js notranslate">var adder = { +<pre class="brush: js ">var adder = { base : 1, add : function(a) { @@ -255,7 +255,7 @@ console.log(adder.addThruCall(1)); // 이도 2가 콘솔에 출력될 것임</pr <p>화살표 함수는 <a href="/ko/docs/Web/JavaScript/Reference/Functions/arguments"><code>arguments</code> 객체</a>를 바인드 하지 않습니다. 때문에, <code>arguments는</code> 그저 둘러싸는 범위(scope) 내 이름에 대한 참조입니다.</p> -<pre class="brush: js notranslate"><code>var arguments = [1, 2, 3]; +<pre class="brush: js "><code>var arguments = [1, 2, 3]; var arr = () => arguments[0]; arr(); // 1 @@ -269,7 +269,7 @@ foo(1); // 2</code></pre> <p>화살표 함수는 자신의 <code>arguments</code> 객체가 없지만, 대부분의 경우에 <a href="/ko/docs/Web/JavaScript/Reference/Functions/rest_parameters">나머지 매개변수</a>가 좋은 대안입니다:</p> -<pre class="brush: js notranslate">function foo(n) { +<pre class="brush: js ">function foo(n) { var f = (...args) => args[0] + n; return f(2); } @@ -280,7 +280,7 @@ foo(1); // 3</pre> <p>이야기 했듯이, 화살표 함수 표현은 메소드 함수가 아닌 형태로 사용 할 수 있습니다. 메소드로 사용하려고 한면 무슨일이 발생하는지 봅시다.</p> -<pre class="brush: js notranslate"><code>'use strict'; +<pre class="brush: js "><code>'use strict'; var obj = { // does not create a new scope i: 10, @@ -295,7 +295,7 @@ obj.c(); // prints 10, Object {...}</code> <p>화살표 함수는 자신의 this를 가지고("bind" 바인드)있지 않습니다.{{jsxref("Object.defineProperty()")}}</p> -<pre class="brush: js notranslate"><code>'use strict'; +<pre class="brush: js "><code>'use strict'; var obj = { a: 10 @@ -312,14 +312,14 @@ Object.defineProperty(obj, 'b', { <p>화살표 함수는 생성자로서 사용될 수 없으며 <code>new</code>와 함께 사용하면 오류가 발생합니다.</p> -<pre class="brush: js notranslate"><code>var Foo = () => {}; +<pre class="brush: js "><code>var Foo = () => {}; var foo = new Foo(); // TypeError: Foo is not a constructor</code></pre> <h3 id="prototype_속성_사용"><code>prototype</code> 속성 사용</h3> <p>화살표 함수는 <code>prototype</code> 속성이 없습니다.</p> -<pre class="brush: js notranslate"><code>var Foo = () => {}; +<pre class="brush: js "><code>var Foo = () => {}; console.log(Foo.prototype); // undefined</code></pre> <h3 id="yield_키워드_사용"><code>yield</code> 키워드 사용</h3> @@ -336,7 +336,7 @@ console.log(Foo.prototype); // undefined</code></pre> <p>block바디는 자동으로 값을 반환하지 않습니다. <code>return</code>을 사용해서 값을 반환해야 합니다.</p> -<pre class="brush: js notranslate">var func = x => x * x; // concise 바디, 생략된 "return" 여기서는 x * x +<pre class="brush: js ">var func = x => x * x; // concise 바디, 생략된 "return" 여기서는 x * x var func = (x, y) => { return x + y; }; // block 바디, "return"이 필요 </pre> @@ -344,7 +344,7 @@ var func = (x, y) => { return x + y; }; // block 바디, "return"이 필요 <p>간결한 구문 <code>params => {object:literal}</code>을 사용한 객체 리터럴 반환은 예상대로 작동하지 않음을 명심하세요:</p> -<pre class="brush: js notranslate">var func = () => { foo: 1 }; +<pre class="brush: js ">var func = () => { foo: 1 }; // func() 호출은 undefined를 반환! var func = () => { foo: function() {} }; @@ -354,19 +354,19 @@ var func = () => { foo: function() {} }; <p>객체 리터럴를 괄호로 감싸는 것을 기억하세요:</p> -<pre class="brush: js notranslate">var func = () => ({ foo: 1 });</pre> +<pre class="brush: js ">var func = () => ({ foo: 1 });</pre> <h3 id="줄바꿈">줄바꿈</h3> <p>화살표 함수는 파라메터와 화살표 사이에 개행 문자를 포함 할 수 없습니다.</p> -<pre class="brush: js notranslate"><code>var func = (a, b, c) +<pre class="brush: js "><code>var func = (a, b, c) => 1; // SyntaxError: expected expression, got '=>'</code></pre> <p>하지만, 보기 좋은 코드를 유지하고 싶다면, 아래에 보는 것처럼 괄호나 개행을 둠으로써 이를 수정할 수 있습니다.</p> -<pre class="notranslate">var func = (a, b, c) => +<pre >var func = (a, b, c) => 1; var func = (a, b, c) => ( @@ -389,7 +389,7 @@ var func = (a, b, c) => { <p>화살표 함수 내의 화살표는 연산자가 아닙니다. 그러나 화살표 함수는 평범한 함수와 비교했을 때 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">operator precedence</a>와 다르게 반응하는 특별한 파싱룰을 가지고 있습니다.</p> -<pre class="brush: js notranslate"><code>let callback; +<pre class="brush: js "><code>let callback; callback = callback || function() {}; // ok @@ -403,7 +403,7 @@ callback = callback || (() => {}); // ok</code> <h3 id="기본_사용법">기본 사용법</h3> -<pre class="brush: js notranslate"><code>// </code> empty 화살표 함수는 undefined를 반환 <code> +<pre class="brush: js "><code>// </code> empty 화살표 함수는 undefined를 반환 <code> let empty = () => {}; (() => 'foobar')(); diff --git a/files/ko/web/javascript/reference/functions/default_parameters/index.html b/files/ko/web/javascript/reference/functions/default_parameters/index.html index 15828a0c51..d047ebaaa4 100644 --- a/files/ko/web/javascript/reference/functions/default_parameters/index.html +++ b/files/ko/web/javascript/reference/functions/default_parameters/index.html @@ -17,7 +17,7 @@ translation_of: Web/JavaScript/Reference/Functions/Default_parameters <h2 id="구문">구문</h2> -<pre class="brush: js notranslate"> +<pre class="brush: js "> function fnName(param1 = defaultValue1, ..., paramN = defaultValueN) { ... } </pre> @@ -29,7 +29,7 @@ function fnName(param1 = defaultValue1, ..., paramN = defaultValueN) { ... } <p>다음 예제에서, <code>multiply</code>호출시 <code>b</code>에 할당된 값이 없다면, <code>b</code> 값은 <code>a*b</code>를 평가할 때 <code>undefined</code>일 거고 <code>multiply</code> 호출은 <code>NaN</code>이 반환됩니다. </p> -<pre class="brush: js notranslate">function multiply(a, b) { +<pre class="brush: js ">function multiply(a, b) { return a * b } @@ -39,7 +39,7 @@ multiply(5) // NaN ! <p>이를 방지하기 위해서, 아래 두번째 줄과 같이 <code>multiply</code> 함수가 오직 한 개의 인수만 있다면 <code>b</code>를 <code>1</code>로 설정하는 방식을 사용하곤 했습니다.</p> -<pre class="brush: js notranslate">function multiply(a, b) { +<pre class="brush: js ">function multiply(a, b) { b = (typeof b !== 'undefined') ? b : 1 return a*b } @@ -50,7 +50,7 @@ multiply(5) // 5 <p>ES2015의 기본값 매개변수로 함수 내부 에서의 검사는 더 이상 필요치 않습니다. 이제, 간단히 함수 머리(head)에서 <code>b</code>의 기본값으로 <code>1</code> 로 설정할 수 있습니다:</p> -<pre class="brush: js notranslate">function multiply(a, b = 1) { +<pre class="brush: js ">function multiply(a, b = 1) { return a*b } @@ -65,7 +65,7 @@ multiply(5, undefined) // 5 <p>아래 예제중 두 번째 호출에서, 설사 두 번째 인수를 호출할 때 명시해서 <code>undefined</code> (<code>null</code> 혹은 {{glossary("falsy")}} 값이 아니긴 하지만 )로 설정하더라도 , <code>num</code> 인수의 값은 여전히 기본값입니다.</p> -<pre class="brush: js notranslate">function test(num = 1) { +<pre class="brush: js ">function test(num = 1) { console.log(typeof num) } @@ -81,7 +81,7 @@ test(null) // 'object' (num 은 null로 설정됨) <p>기본 인수는 <em>호출</em> <em>시 </em>에 평가됩니다, 그래서 Python의 경우 와는 달리, 함수가 호출될 때마다 새로운 객체가 생성됩니다.</p> -<pre class="brush: js notranslate">function append(value, array = []) { +<pre class="brush: js ">function append(value, array = []) { array.push(value) return array } @@ -93,7 +93,7 @@ append(2) // [2], [1, 2]가 아니라 <p>이는 심지어 함수 및 변수에도 적용됩니다:</p> -<pre class="brush: js notranslate">function callSomething(thing = something()) { +<pre class="brush: js ">function callSomething(thing = something()) { return thing } @@ -111,7 +111,7 @@ callSomething() // 2 <p>매개 변수가 여러개일 때 앞쪽에( 왼쪽 부분) 정의된 매개변수는 뒷쪽에 정의된 매개변수의 기본값에 바로 사용할 수 있습니다.</p> -<pre class="brush: js notranslate">function greet(name, greeting, message = greeting + ' ' + name) { +<pre class="brush: js ">function greet(name, greeting, message = greeting + ' ' + name) { return [name, greeting, message] } @@ -121,7 +121,7 @@ greet('David', 'Hi', 'Happy Birthday!') // ["David", "Hi", "Happy Birthday!"] <p>이 기능은, 얼마나 많은 경계 조건(edge case)를 다룰수 있는지 보여주는, 아래 예제로 거의 설명 가능합니다.</p> -<pre class="brush: js notranslate">function go() { +<pre class="brush: js ">function go() { return ':P' } @@ -172,13 +172,13 @@ withoutDefaults.call({value:"=^_^="}); <p>아래 함수는 호출되면 <code>ReferenceError</code> 를 발생시킵니다. 매개변수 기본값이 함수 내부의 자식 유효범위를 참조할 수 없기 때문입니다.</p> -<pre class="brush: js example-bad notranslate">function f(a = go()) { // `f`가 호출 되면 `ReferenceError` 발생 +<pre class="brush: js example-bad ">function f(a = go()) { // `f`가 호출 되면 `ReferenceError` 발생 function go() { return ':P' } }</pre> <p>...그리고 아래 함수는 <code>undefined</code> 를 프린트 하는데, <code>var a</code> 가 함수 내부 대상의 유효범위내에서만 효과를 가지기 때문입니다. ( 매개변수 목록이 대상인 부모 스코프가 아니라)</p> -<pre class="brush: js example-bad notranslate">function f(a, b = () => console.log(a)) { +<pre class="brush: js example-bad ">function f(a, b = () => console.log(a)) { var a = 1 b() // `undefined`를 인쇄하는데, 매개변수 기본값이 자체 스코프에 있기 때문입니다 } </pre> @@ -187,7 +187,7 @@ withoutDefaults.call({value:"=^_^="}); <p>매개변수는 여전히 왼쪽에서 오른쪽으로 설정됩니다. 아래 예제에서 뒷쪽에 기본값이 없는 매개변수가 있지만 기본값 매개변수를 덮어씁니다.</p> -<pre class="brush: js notranslate">function f(x=1, y) { +<pre class="brush: js ">function f(x=1, y) { return [x, y]; } @@ -199,7 +199,7 @@ f(2) // [2, undefined] <p>기본값 할당을 {{jsxref("Operators/Destructuring_assignment", "destructuring assignment", "", 1)}} 표기와 함께 사용할 수 있습니다:</p> -<pre class="brush: js notranslate">function f([x, y] = [1, 2], {z: z} = {z: 3}) { +<pre class="brush: js ">function f([x, y] = [1, 2], {z: z} = {z: 3}) { return x + y + z } diff --git a/files/ko/web/javascript/reference/global_objects/eval/index.html b/files/ko/web/javascript/reference/global_objects/eval/index.html index d599cadbe9..d7bcfeb182 100644 --- a/files/ko/web/javascript/reference/global_objects/eval/index.html +++ b/files/ko/web/javascript/reference/global_objects/eval/index.html @@ -72,7 +72,7 @@ eval(expression.toString()); // 4를 반환 <p><code>eval</code>을 사용하는 나쁜 코드:</p> -<pre class="brush:js notranslate">function looseJsonParse(obj){ +<pre class="brush:js ">function looseJsonParse(obj){ return eval(obj); } console.log(looseJsonParse( @@ -82,7 +82,7 @@ console.log(looseJsonParse( <p><code>eval</code>이 없는 코드:</p> -<pre class="brush:js notranslate">function looseJsonParse(obj){ +<pre class="brush:js ">function looseJsonParse(obj){ return Function('"use strict";return (' + obj + ')')(); } console.log(looseJsonParse( @@ -92,7 +92,7 @@ console.log(looseJsonParse( <p>위의 두 코드는 얼핏 보면 같은 방식으로 실행되는 것처럼 보이지만, <code>eval</code>이 있는 코드가 훨씬 느립니다. 평가되는 객체의 <code>c: new Date()</code>를 주목하세요. <code>eval</code>이 없는 함수의 경우 이 객체는 전역 범위에서 평가되기 때문에 브라우저에서는 <code>Date</code>를 같은 이름의 지역 변수가 아니라 <code>window.Date</code>로 취급할 수 있습니다. 그러나 <code>eval()</code>을 사용하는 코드에서는 아래와 같은 경우도 존재할 수 있기 때문에 <code>Date</code>를 이렇게 취급할 수 없습니다.</p> -<pre class="brush:js notranslate">function Date(n){ +<pre class="brush:js ">function Date(n){ return ["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"][n%7 || 0]; } function looseJsonParse(obj){ @@ -107,7 +107,7 @@ console.log(looseJsonParse( <p>만약 위의 상황에서 실제로 새로 선언한 <code>Date</code> 함수를 <code>Function()</code>에서 실행해야 하는 상황을 생각해 봅시다. 이렇게 되면 <code>eval()</code>로 돌아가야 할까요? 물론 아닙니다. 아래의 접근을 시도해 보세요.</p> -<pre class="brush:js notranslate">function Date(n){ +<pre class="brush:js ">function Date(n){ return ["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"][n%7 || 0]; } function runCodeWithDateFunction(obj){ @@ -132,7 +132,7 @@ console.log(runCodeWithDateFunction( <p>마지막으로 코드 최소화의 측면에서 살펴보면, 위와 같이 <code>Function()</code>을 사용했을 때는 아래의 최소화된 코드와 같이 함수의 인자 이름 역시 짧게 줄일 수 있으므로 runCodeWithDateFunction에 전달하는 코드 문자열을 더욱 효율적으로 줄일 수 있습니다.</p> -<pre class="brush:js notranslate">console.log(Function('"use strict";return(function(a){return a(5)})')()(function(a){ +<pre class="brush:js ">console.log(Function('"use strict";return(function(a){return a(5)})')()(function(a){ return"Monday Tuesday Wednesday Thursday Friday Saturday Sunday".split(" ")[a%7||0]}));</pre> <p>자주 쓰이는 용례에 대해서는 <code>eval()</code>이나 <code>Function()</code>보다 안전하고 빠른 대안도 존재합니다.</p> @@ -141,7 +141,7 @@ return"Monday Tuesday Wednesday Thursday Friday Saturday Sunday".split(" ")[a%7| <p>속성명으로 속성을 찾는 데 <code>eval()</code>을 사용해서는 안 됩니다. 다음 예제와 같이 코드를 실행하기 전까지는 접근할 속성을 알 수 없는 상황을 생각해 봅시다. 이 상황은 <code>eval</code>로 처리할 수 있습니다.</p> -<pre class="brush:js notranslate">var obj = { a: 20, b: 30 }; +<pre class="brush:js ">var obj = { a: 20, b: 30 }; var propname = getPropName(); // "a" 또는 "b"를 반환 eval( "var result = obj." + propname ); @@ -149,21 +149,21 @@ eval( "var result = obj." + propname ); <p>그러나 여기에서 <code>eval()</code>을 쓸 필요가 없고, 지양되어야 합니다. 그 대신 훨씬 빠르고 안전한 <a href="/ko/docs/Web/JavaScript/Reference/Operators/Property_Accessors">속성 접근자</a>를 사용하여야 합니다.</p> -<pre class="brush:js notranslate">var obj = { a: 20, b: 30 }; +<pre class="brush:js ">var obj = { a: 20, b: 30 }; var propname = getPropName(); // "a" 또는 "b"를 반환 var result = obj[ propname ]; // obj[ "a" ]는 obj.a와 동일함 </pre> <p>이 방법으로 더 깊은 속성에도 접근할 수 있습니다. <code>eval()</code>을 사용한다면 다음과 같을 것입니다.</p> -<pre class="notranslate"><code>var obj = {a: {b: {c: 0}}}; +<pre ><code>var obj = {a: {b: {c: 0}}}; var propPath = getPropPath(); // "a.b.c"를 반환한다고 가정 eval( 'var result = obj.' + propPath );</code></pre> <p>여기서 <code>eval()</code>의 사용을 피하려면 속성 경로를 <code><a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/String/split">split</a></code>한 다음 순서대로 접근할 수도 있습니다.</p> -<pre class="notranslate"><code>function getDescendantProp(obj, desc) { +<pre ><code>function getDescendantProp(obj, desc) { var arr = desc.split('.'); while (arr.length) { obj = obj[arr.shift()]; @@ -177,7 +177,7 @@ var result = getDescendantProp(obj, propPath);</code></pre> <p>속성에 값을 대입하는 것도 비슷하게 할 수 있습니다.</p> -<pre class="notranslate"><code>function setDescendantProp(obj, desc, value) { +<pre ><code>function setDescendantProp(obj, desc, value) { var arr = desc.split('.'); while (arr.length > 1) { obj = obj[arr.shift()]; @@ -194,7 +194,7 @@ var result = setDescendantProp(obj, propPath, 1); // test.a.b.c의 값은 1로 <p>JavaScript의 <a href="http://en.wikipedia.org/wiki/First-class_function">함수는 1급 객체</a>이므로 다른 API에 함수를 인자로 전달할 수도 있고, 변수나 객체의 속성으로 대입할 수도 있습니다. 다수의 DOM API는 이 점을 염두에 두고 설계되므로, 다음과 같이 코드를 짜야 합니다.</p> -<pre class="brush: js notranslate">// setTimeout(" ... ", 1000) 대신에 +<pre class="brush: js ">// setTimeout(" ... ", 1000) 대신에 setTimeout(function() { ... }, 1000); // elt.setAttribute("onclick", "...") 대신에 @@ -222,7 +222,7 @@ elt.addEventListener("click", function() { ... } , false); </pre> <p>아래 코드에서 <code>eval()</code>를 포함하는 문장은 모두 42를 반환합니다. 전자는 문자열 "<code>x + y + 1</code>"을, 후자는 문자열 "<code>42</code>"를 평가합니다.</p> -<pre class="brush:js notranslate">var x = 2; +<pre class="brush:js ">var x = 2; var y = 39; var z = "42"; eval("x + y + 1"); // 42를 반환 @@ -233,14 +233,14 @@ eval(z); // 42를 반환 <p>다음 예제에서는 <code>eval()</code>을 사용하여 <code>str</code> 문자열을 평가합니다. 이 문자열은 <code>x</code>가 5이면 로그를 출력한 다음 <code>z</code>에 42를 할당하고, 그렇지 않으면 <code>z</code>에 0 을 할당하는 JavaScript 코드입니다. 두 번째 문장이 실행되면, <code>eval()</code>은 이 문장의 집합을 수행하고, <code>z</code>에 할당된 값을 반환합니다.</p> -<pre class="brush:js notranslate">var x = 5; +<pre class="brush:js ">var x = 5; var str = "if (x == 5) {console.log('z is 42'); z = 42;} else z = 0; "; console.log("z is ", eval(str));</pre> <p>여러 값을 정의할 경우 마지막 값을 반환합니다.</p> -<pre class="notranslate"><code>var x = 5; +<pre ><code>var x = 5; var str = "if (x == 5) {console.log('z is 42'); z = 42; x = 420; } else z = 0;"; console.log('x is ', eval(str)); // z는 42, x는 420</code></pre> @@ -249,7 +249,7 @@ console.log('x is ', eval(str)); // z는 42, x는 420</code></pre> <p><code>eval()</code> 은 마지막 표현식의 평가값을 반환합니다.</p> -<pre class="brush:js notranslate">var str = "if ( a ) { 1+1; } else { 1+2; }"; +<pre class="brush:js ">var str = "if ( a ) { 1+1; } else { 1+2; }"; var a = true; var b = eval(str); // 2를 반환 @@ -262,7 +262,7 @@ console.log("b is : " + b);</pre> <h3 id="함수_정의_문자열로서의_eval_은_앞뒤를_와_로_감싸야_한다">함수 정의 문자열로서의 <code>eval</code> 은 앞뒤를 "("와 ")"로 감싸야 한다</h3> -<pre class="brush:js notranslate">var fctStr1 = "function a() {}" +<pre class="brush:js ">var fctStr1 = "function a() {}" var fctStr2 = "(function a() {})" var fct1 = eval(fctStr1) // undefined를 반환 var fct2 = eval(fctStr2) // 함수를 반환 diff --git a/files/ko/web/javascript/reference/global_objects/globalthis/index.html b/files/ko/web/javascript/reference/global_objects/globalthis/index.html index a06d8520dc..8a46c92c54 100644 --- a/files/ko/web/javascript/reference/global_objects/globalthis/index.html +++ b/files/ko/web/javascript/reference/global_objects/globalthis/index.html @@ -37,7 +37,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/globalThis <p><code>globalThis</code> 없이 현재 환경의 전역 객체를 가져오는 방법 중 유일하게 믿을만한 방법은 <code>Function('return this')()</code> 입니다. 그러나 일부 환경에서는 <a href="/ko/docs/Web/HTTP/CSP">CSP</a> 위반에 걸리는 코드이므로, <a href="https://github.com/paulmillr/es6-shim">es6-shim</a>은 대신 다음 검사를 수행합니다.</p> -<pre class="brush: js notranslate">var getGlobal = function () { +<pre class="brush: js ">var getGlobal = function () { if (typeof self !== 'undefined') { return self; } if (typeof window !== 'undefined') { return window; } if (typeof global !== 'undefined') { return global; } @@ -53,7 +53,7 @@ if (typeof globals.setTimeout !== 'function') { <p><code>globalThis</code>를 사용할 수 있으면 환경별 전역 객체 검사는 더 이상 필요하지 않습니다.</p> -<pre class="brush: js notranslate">if (typeof globalThis.setTimeout !== 'function') { +<pre class="brush: js ">if (typeof globalThis.setTimeout !== 'function') { // no setTimeout in this environment! }</pre> diff --git a/files/ko/web/javascript/reference/global_objects/infinity/index.html b/files/ko/web/javascript/reference/global_objects/infinity/index.html index ffda333c14..8c5a8c6e77 100644 --- a/files/ko/web/javascript/reference/global_objects/infinity/index.html +++ b/files/ko/web/javascript/reference/global_objects/infinity/index.html @@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Infinity <h2 id="예제">예제</h2> -<pre class="brush: js notranslate">console.log(Infinity); /* Infinity */ +<pre class="brush: js ">console.log(Infinity); /* Infinity */ console.log(Infinity + 1); /* Infinity */ console.log(Math.pow(10,1000)); /* Infinity */ console.log(Math.log(0)); /* -Infinity */ diff --git a/files/ko/web/javascript/reference/global_objects/nan/index.html b/files/ko/web/javascript/reference/global_objects/nan/index.html index e2e4aa9bac..0ddec1ad2d 100644 --- a/files/ko/web/javascript/reference/global_objects/nan/index.html +++ b/files/ko/web/javascript/reference/global_objects/nan/index.html @@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/NaN <p><code>NaN</code>은 다른 모든 값과 비교(<code>==</code>, <code>!=</code>, <code>===</code>, <code>!==</code>)했을 때 같지 않으며, 다른 NaN과도 같지 않습니다. NaN의 판별은 {{jsxref("Number.isNaN()")}} 또는 {{jsxref("Global_Objects/isNaN", "isNaN()")}}을 사용하면 제일 분명하게 수행할 수 있습니다. 아니면, 오로지 NaN만이 자기자신과 비교했을 때 같지 않음을 이용할 수도 있습니다.</p> -<pre class="brush: js notranslate">NaN === NaN; // false +<pre class="brush: js ">NaN === NaN; // false Number.NaN === NaN; // false isNaN(NaN); // true isNaN(Number.NaN); // true @@ -52,13 +52,13 @@ valueIsNaN(Number.NaN); // true <p>그러나 <code>isNaN()</code>과 <code>Number.isNaN()</code>의 차이를 주의해야 합니다. <code>isNaN</code>은 현재 값이 <code>NaN</code>이거나, 숫자로 변환했을 때 <code>NaN</code>이 되면 참을 반환하지만, <code>Number.isNaN</code>은 현재 값이 <code>NaN</code>이어야만 참을 반환합니다.</p> -<pre class="brush: js notranslate">isNaN('hello world'); // true +<pre class="brush: js ">isNaN('hello world'); // true Number.isNaN('hello world'); // false </pre> <p>덧붙여서, 일부 배열 메서드는 NaN을 찾을 수 없습니다.</p> -<pre class="brush: js notranslate">let arr = [2, 4, NaN, 12]; +<pre class="brush: js ">let arr = [2, 4, NaN, 12]; arr.indexOf(NaN); // -1 (false) arr.includes(NaN); // true arr.findIndex(n => Number.isNaN(n)); // 2</pre> diff --git a/files/ko/web/javascript/reference/global_objects/number/negative_infinity/index.html b/files/ko/web/javascript/reference/global_objects/number/negative_infinity/index.html index d6567e687e..43ae38f357 100644 --- a/files/ko/web/javascript/reference/global_objects/number/negative_infinity/index.html +++ b/files/ko/web/javascript/reference/global_objects/number/negative_infinity/index.html @@ -46,7 +46,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY <p>다음 코드에서 <code>smallNumber</code>는 JavaScript의 최솟값보다 작은 값을 할당받습니다. {{jsxref("Statements/if...else", "if")}} 문이 실행되면, <code>smallNumber</code>의 값이 <code>-Infinity</code>이므로 <code>smallNumber</code>는 계산에 좀 더 적합한 값을 다시 할당합니다.</p> -<pre class="brush: js notranslate">var smallNumber = (-Number.MAX_VALUE) * 2; +<pre class="brush: js ">var smallNumber = (-Number.MAX_VALUE) * 2; if (smallNumber === Number.NEGATIVE_INFINITY) { smallNumber = returnFinite(); diff --git a/files/ko/web/javascript/reference/global_objects/object/entries/index.html b/files/ko/web/javascript/reference/global_objects/object/entries/index.html index 3056d99d31..082e931936 100644 --- a/files/ko/web/javascript/reference/global_objects/object/entries/index.html +++ b/files/ko/web/javascript/reference/global_objects/object/entries/index.html @@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries <h2 id="Syntax">Syntax</h2> -<pre class="syntaxbox notranslate">Object.entries(<var>obj</var>)</pre> +<pre class="syntaxbox ">Object.entries(<var>obj</var>)</pre> <h3 id="Parameters">Parameters</h3> @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries <p>기본적으로 지원하지 않는 이전 환경에서 호환 가능한 <code>Object.entries</code> 지원을 추가하려면 <a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a>에 Object.entries의 데모 구현을 찾을 수 있습니다 (IE에 대한 지원이 필요하지 않은 경우) , <a href="https://github.com/es-shims/Object.entries">es-shims/Object.entries</a> 저장소에있는 polyfill을 사용하거나 아래에 나열된 polyfill을 간단하게 배치 할 수 있습니다.</p> -<pre class="brush: js notranslate">if (!Object.entries) +<pre class="brush: js ">if (!Object.entries) Object.entries = function( obj ){ var ownProps = Object.keys( obj ), i = ownProps.length, @@ -54,7 +54,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries <h2 id="Examples">Examples</h2> -<pre class="brush: js notranslate">const obj = { foo: 'bar', baz: 42 }; +<pre class="brush: js ">const obj = { foo: 'bar', baz: 42 }; console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ] // array like object @@ -94,7 +94,7 @@ console.log(`${key} ${value}`); // "a 5", "b 7", "c 9" -<pre class="brush: js notranslate">const obj = { foo: 'bar', baz: 42 }; +<pre class="brush: js ">const obj = { foo: 'bar', baz: 42 }; const map = new Map(Object.entries(obj)); console.log(map); // Map { foo: "bar", baz: 42 } </pre> @@ -103,7 +103,7 @@ console.log(map); // Map { foo: "bar", baz: 42 } <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Array_destructuring">Array Destructuring</a>을 사용하면 객체를 쉽게 반복 할 수 있습니다.</p> -<pre class="brush: js notranslate">const obj = { foo: 'bar', baz: 42 }; +<pre class="brush: js ">const obj = { foo: 'bar', baz: 42 }; Object.entries(obj).forEach(([key, value]) => console.log(`${key}: ${value}`)); // "foo: bar", "baz: 42" </pre> diff --git a/files/ko/web/javascript/reference/global_objects/object/setprototypeof/index.html b/files/ko/web/javascript/reference/global_objects/object/setprototypeof/index.html index 64f7a89a18..4b01abdf50 100644 --- a/files/ko/web/javascript/reference/global_objects/object/setprototypeof/index.html +++ b/files/ko/web/javascript/reference/global_objects/object/setprototypeof/index.html @@ -14,7 +14,7 @@ browser-compat: javascript.builtins.Object.setPrototypeOf <h2 id="Syntax">Syntax</h2> -<pre class="syntaxbox notranslate"><code>Object.setPrototypeOf(<var>obj</var>, <var>prototype</var>);</code></pre> +<pre class="syntaxbox "><code>Object.setPrototypeOf(<var>obj</var>, <var>prototype</var>);</code></pre> <h3 id="Parameters">Parameters</h3> @@ -37,14 +37,14 @@ browser-compat: javascript.builtins.Object.setPrototypeOf <p>Examples</p> -<pre class="brush: js notranslate">var dict = Object.setPrototypeOf({}, null); +<pre class="brush: js ">var dict = Object.setPrototypeOf({}, null); </pre> <h2 id="Polyfill">Polyfill</h2> <p>예전 버전의 프로퍼티 {{jsxref("Object.prototype.__proto__")}} 를 사용한다면, 우리는 쉽게 Object.setPrototypeOf 가 쉽게 정의 할수 있다.</p> -<pre class="brush: js notranslate">// Only works in Chrome and FireFox, does not work in IE: +<pre class="brush: js ">// Only works in Chrome and FireFox, does not work in IE: Object.setPrototypeOf = Object.setPrototypeOf || function(obj, proto) { obj.__proto__ = proto; return obj; @@ -55,7 +55,7 @@ Object.setPrototypeOf = Object.setPrototypeOf || function(obj, proto) { <p><code>Object.getPrototypeOf()</code> and {{jsxref("Object.proto", "Object.prototype.__proto__")}} 의 결합은 새로운 프로토타입 오브젝트에 전반적인 프로토타입 Chain을 설정하도록 할수 있다.</p> -<pre class="brush: js notranslate">/** +<pre class="brush: js ">/** *** Object.appendChain(@object, @prototype) * * Appends the first non-native prototype of a chain to a new prototype. @@ -103,7 +103,7 @@ Object.appendChain = function(oChain, oProto) { <h4 id="First_example_프로토타입에_Chain_설정하기">First example: 프로토타입에 Chain 설정하기</h4> -<pre class="brush: js notranslate">function Mammal() { +<pre class="brush: js ">function Mammal() { this.isMammal = 'yes'; } @@ -129,7 +129,7 @@ console.log(oCat.breathing); // 'yes' <h4 id="Second_example_객체_Constructor의_인스턴스에_존재하는_원래_값을_변경_및_해당_객체_프로토타입에_Chain_설정하기">Second example: 객체 Constructor의 인스턴스에 존재하는 원래 값을 변경 및 해당 객체 프로토타입에 Chain 설정하기</h4> -<pre class="brush: js notranslate">function MySymbol() { +<pre class="brush: js ">function MySymbol() { this.isSymbol = 'yes'; } @@ -146,7 +146,7 @@ console.log(typeof oPrime); // 'object' <h4 id="Third_example_Function.prototype객체에_Chain을_설정하고_그_Chain에_새로운_함수를_설정하기">Third example: Function.prototype객체에 Chain을 설정하고 그 Chain에 새로운 함수를 설정하기</h4> -<pre class="brush: js notranslate">function Person(sName) { +<pre class="brush: js ">function Person(sName) { this.identity = sName; } diff --git a/files/ko/web/javascript/reference/global_objects/regexp/exec/index.html b/files/ko/web/javascript/reference/global_objects/regexp/exec/index.html index d20573f473..eb02391603 100644 --- a/files/ko/web/javascript/reference/global_objects/regexp/exec/index.html +++ b/files/ko/web/javascript/reference/global_objects/regexp/exec/index.html @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/exec <h2 id="구문">구문</h2> -<pre class="syntaxbox notranslate"><var>regexObj</var>.exec(<var>str</var>)</pre> +<pre class="syntaxbox "><var>regexObj</var>.exec(<var>str</var>)</pre> <h3 id="매개변수">매개변수</h3> @@ -45,7 +45,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/exec <p>다음과 같은 예제를 고려해보세요.</p> -<pre class="brush: js notranslate">// Match "quick brown" followed by "jumps", ignoring characters in between +<pre class="brush: js ">// Match "quick brown" followed by "jumps", ignoring characters in between // Remember "brown" and "jumps" // Ignore case let re = /quick\s(brown).+?(jumps)/ig; @@ -131,7 +131,7 @@ let result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');</pre> <p>If your regular expression uses the "<code>g</code>" flag, you can use the <code>exec()</code> method multiple times to find successive matches in the same string. When you do so, the search starts at the substring of <code>str</code> specified by the regular expression's {{jsxref("RegExp.lastIndex", "lastIndex")}} property ({{jsxref("RegExp.prototype.test()", "test()")}} will also advance the {{jsxref("RegExp.lastIndex", "lastIndex")}} property). For example, assume you have this script:</p> -<pre class="brush: js notranslate">var myRe = /ab*/g; +<pre class="brush: js ">var myRe = /ab*/g; var str = 'abbcdefabh'; var myArray; while ((myArray = myRe.exec(str)) !== null) { @@ -143,7 +143,7 @@ while ((myArray = myRe.exec(str)) !== null) { <p>This script displays the following text:</p> -<pre class="notranslate">Found abb. Next match starts at 3 +<pre >Found abb. Next match starts at 3 Found ab. Next match starts at 9 </pre> @@ -153,7 +153,7 @@ Found ab. Next match starts at 9 <p>You can also use <code>exec()</code> without creating a {{jsxref("RegExp")}} object:</p> -<pre class="brush: js notranslate">var matches = /(hello \S+)/.exec('This is a hello world!'); +<pre class="brush: js ">var matches = /(hello \S+)/.exec('This is a hello world!'); console.log(matches[1]); </pre> diff --git a/files/ko/web/javascript/reference/global_objects/regexp/index.html b/files/ko/web/javascript/reference/global_objects/regexp/index.html index 5675812788..166000e61a 100644 --- a/files/ko/web/javascript/reference/global_objects/regexp/index.html +++ b/files/ko/web/javascript/reference/global_objects/regexp/index.html @@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp <p>다음의 세 표현식은 모두 같은 정규 표현식을 생성합니다.</p> -<pre class="brush: js notranslate">/ab+c/i +<pre class="brush: js ">/ab+c/i new RegExp(/ab+c/, 'i') // 리터럴 new RegExp('ab+c', 'i') // 생성자 </pre> @@ -46,7 +46,7 @@ new RegExp('ab+c', 'i') // 생성자 <p>예를 들어 다음 두 줄은 동일한 정규 표현식을 생성합니다.</p> -<pre class="brush: js notranslate">let re = /\w+/ +<pre class="brush: js ">let re = /\w+/ let re = new RegExp('\\w+')</pre> <h3 id="Perl_형태의_RegExp_속성">Perl 형태의 <code>RegExp</code> 속성</h3> @@ -121,7 +121,7 @@ let re = new RegExp('\\w+')</pre> <p>대치 문자열에는 <code>$1</code>과 <code>$2</code>를 사용하여 정규 표현식 패턴의 각 괄호에 일치한 결과를 받아옵니다.</p> -<pre class="brush: js notranslate">let re = /(\w+)\s(\w+)/ +<pre class="brush: js ">let re = /(\w+)\s(\w+)/ let str = 'John Smith' let newstr = str.replace(re, '$2, $1') console.log(newstr)</pre> @@ -132,7 +132,7 @@ console.log(newstr)</pre> <p>기본 줄 바꿈 문자는 플랫폼(Unix, Windows 등)마다 다릅니다. 아래의 분할 스크립트는 모든 플랫폼의 줄 바꿈을 인식합니다.</p> -<pre class="brush: js notranslate">let text = 'Some text\nAnd some more\r\nAnd yet\rThis is the end' +<pre class="brush: js ">let text = 'Some text\nAnd some more\r\nAnd yet\rThis is the end' let lines = text.split(/\r\n|\r|\n/) console.log(lines) // logs [ 'Some text', 'And some more', 'And yet', 'This is the end' ]</pre> @@ -140,7 +140,7 @@ console.log(lines) // logs [ 'Some text', 'And some more', 'And yet', 'This is t <h3 id="여러_줄에서_정규_표현식_사용하기">여러 줄에서 정규 표현식 사용하기</h3> -<pre class="brush: js notranslate">let s = 'Please yes\nmake my day!' +<pre class="brush: js ">let s = 'Please yes\nmake my day!' s.match(/yes.*day/); // Returns null @@ -152,7 +152,7 @@ s.match(/yes[^]*day/); <p>{{JSxRef("Global_Objects/RegExp/sticky", "sticky")}} 플래그는 해당 정규 표현식이 접착 판별, 즉 {{jsxref("RegExp.prototype.lastIndex")}}에서 시작하는 일치만 확인하도록 할 수 있습니다.</p> -<pre class="brush: js notranslate">let str = '#foo#' +<pre class="brush: js ">let str = '#foo#' let regex = /foo/y regex.lastIndex = 1 @@ -165,7 +165,7 @@ regex.lastIndex // 0 (reset after match failure)</pre> <p>접착 플래그 <code>y</code>의 일치는 정확히 <code>lastIndex</code> 위치에서만 발생할 수 있으나, 전역 플래그 <code>g</code>의 경우 <code>lastIndex</code> 또는 그 이후에서도 발생할 수 있습니다.</p> -<pre class="brush: js notranslate">re = /\d/y; +<pre class="brush: js ">re = /\d/y; while (r = re.exec("123 456")) console.log(r, "AND re.lastIndex", re.lastIndex); // [ '1', index: 0, input: '123 456', groups: undefined ] AND re.lastIndex 1 @@ -181,7 +181,7 @@ while (r = re.exec("123 456")) console.log(r, "AND re.lastIndex", re.lastIndex); <p>러시아어나 히브리어와 같은 다른 언어의 문자까지 일치하려면 <code>\uhhhh</code>(이때 hhhh는 해당 문자의 16진법 Unicode 값) 문법을 사용하세요. 아래 예제에서는 문자열에서 Unicode 문자를 추출합니다.</p> -<pre class="brush: js notranslate">let text = 'Образец text на русском языке' +<pre class="brush: js ">let text = 'Образец text на русском языке' let regex = /[\u0400-\u04FF]+/g let match = regex.exec(text) @@ -198,7 +198,7 @@ console.log(regex.lastIndex) // logs '15' <h3 id="URL에서_서브도메인_추출하기">URL에서 서브도메인 추출하기</h3> -<pre class="brush: js notranslate">let url = 'http://xxx.domain.com' +<pre class="brush: js ">let url = 'http://xxx.domain.com' console.log(/[^.]+/.exec(url)[0].substr(7)) // logs 'xxx'</pre> <div class="blockIndicator note"> diff --git a/files/ko/web/javascript/reference/global_objects/regexp/regexp/index.html b/files/ko/web/javascript/reference/global_objects/regexp/regexp/index.html index 387b5bceff..a5ed17a62c 100644 --- a/files/ko/web/javascript/reference/global_objects/regexp/regexp/index.html +++ b/files/ko/web/javascript/reference/global_objects/regexp/regexp/index.html @@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/RegExp <p>리터럴, 생성자, 팩토리 표기법이 가능합니다.</p> -<pre class="syntaxbox notranslate">/<var>pattern</var>/<var>flags</var> +<pre class="syntaxbox ">/<var>pattern</var>/<var>flags</var> new RegExp(<var>pattern</var>[, <var>flags</var>]) RegExp(<var>pattern</var>[, <var>flags</var>]) </pre> @@ -73,7 +73,7 @@ RegExp(<var>pattern</var>[, <var>flags</var>]) <p>다음의 세 표현식은 모두 같은 정규 표현식을 생성합니다.</p> -<pre class="brush: js notranslate">/ab+c/i +<pre class="brush: js ">/ab+c/i new RegExp(/ab+c/, 'i') // 리터럴 new RegExp('ab+c', 'i') // 생성자 </pre> diff --git a/files/ko/web/javascript/reference/global_objects/regexp/test/index.html b/files/ko/web/javascript/reference/global_objects/regexp/test/index.html index 07569e7eaf..8a4b200e5f 100644 --- a/files/ko/web/javascript/reference/global_objects/regexp/test/index.html +++ b/files/ko/web/javascript/reference/global_objects/regexp/test/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/test <h2 id="구문">구문</h2> -<pre class="syntaxbox notranslate"><var>regexObj</var>.test(<var>str</var>)</pre> +<pre class="syntaxbox "><var>regexObj</var>.test(<var>str</var>)</pre> <h3 id="매개변수">매개변수</h3> @@ -48,7 +48,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/test <p>문자열의 맨 처음에 <code>"hello"</code>가 포함됐는지 알아보는 간단한 예제 코드입니다.</p> -<pre class="brush: js notranslate">const str = 'hello world!'; +<pre class="brush: js ">const str = 'hello world!'; const result = /^hello/.test(str); console.log(result); // true @@ -56,7 +56,7 @@ console.log(result); // true <p>다음은 일치 여부에 따라 다른 메시지를 기록하는 예제입니다.</p> -<pre class="brush: js notranslate">function testInput(re, str) { +<pre class="brush: js ">function testInput(re, str) { let midstring; if (re.test(str)) { midstring = 'contains'; @@ -81,7 +81,7 @@ console.log(result); // true <p>이 행동에 대한 예제가 다음 코드입니다.</p> -<pre class="brush: js notranslate">const regex = /foo/g; // the "global" flag is set +<pre class="brush: js ">const regex = /foo/g; // the "global" flag is set // regex.lastIndex is at 0 regex.test('foo') // true diff --git a/files/ko/web/javascript/reference/global_objects/string/lastindexof/index.html b/files/ko/web/javascript/reference/global_objects/string/lastindexof/index.html index d2244feee5..90aeaf3af0 100644 --- a/files/ko/web/javascript/reference/global_objects/string/lastindexof/index.html +++ b/files/ko/web/javascript/reference/global_objects/string/lastindexof/index.html @@ -19,7 +19,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf <h2 id="구문">구문</h2> -<pre class="syntaxbox notranslate"><var>str</var>.lastIndexOf(<var>searchValue</var>[, <var>fromIndex</var>])</pre> +<pre class="syntaxbox "><var>str</var>.lastIndexOf(<var>searchValue</var>[, <var>fromIndex</var>])</pre> <h3 id="매개변수">매개변수</h3> @@ -38,7 +38,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf <p>문자열의 문자는 왼쪽에서 오른쪽으로 인덱스를 매깁니다. 첫 번째 문자의 인덱스는 <code>0</code>이며, 마지막 문자의 인덱스는 <code>str.length -1</code>입니다.</p> -<pre class="brush: js notranslate">'canal'.lastIndexOf('a'); // 3 반환 +<pre class="brush: js ">'canal'.lastIndexOf('a'); // 3 반환 'canal'.lastIndexOf('a', 2); // 1 반환 'canal'.lastIndexOf('a', 0); // -1 반환 'canal'.lastIndexOf('x'); // -1 반환 @@ -56,7 +56,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf <p><code>lastIndexOf()</code> 메서드는 대소문자를 구분합니다. 예를 들어, 아래 예제는 <code>-1</code>을 반환합니다.</p> -<pre class="brush: js notranslate">'Blue Whale, Killer Whale'.lastIndexOf('blue'); // -1 반환 +<pre class="brush: js ">'Blue Whale, Killer Whale'.lastIndexOf('blue'); // -1 반환 </pre> <h2 id="예제">예제</h2> @@ -65,7 +65,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf <p>아래 예제는 문자열 <code>"Brave new world"</code> 내에서 특정 값의 위치를 확인하기 위해 {{jsxref("String.prototype.indexOf()", "indexOf()")}}와 <code>lastIndexOf()</code>를 사용합니다.</p> -<pre class="brush: js notranslate">let anyString = 'Brave new world'; +<pre class="brush: js ">let anyString = 'Brave new world'; console.log('시작점으로부터 처음 만나는 w의 위치는 ' + anyString.indexOf('w')); // logs 8 diff --git a/files/ko/web/javascript/reference/global_objects/string/slice/index.html b/files/ko/web/javascript/reference/global_objects/string/slice/index.html index 3bd23ace3b..6c0c54a50b 100644 --- a/files/ko/web/javascript/reference/global_objects/string/slice/index.html +++ b/files/ko/web/javascript/reference/global_objects/string/slice/index.html @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/slice <h2 id="문법">문법</h2> -<pre class="syntaxbox notranslate"><code><var>str</var>.slice(<var>beginIndex</var>[, <var>endIndex</var>])</code></pre> +<pre class="syntaxbox "><code><var>str</var>.slice(<var>beginIndex</var>[, <var>endIndex</var>])</code></pre> <h3 id="매개변수">매개변수</h3> @@ -47,7 +47,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/slice <p>아래 예시는 새 문자열을 생성하기 위해 <code>slice()</code>를 사용합니다.</p> -<pre class="brush: js notranslate">var str1 = 'The morning is upon us.', // the length of str1 is 23. +<pre class="brush: js ">var str1 = 'The morning is upon us.', // the length of str1 is 23. str2 = str1.slice(1, 8), str3 = str1.slice(4, -2), str4 = str1.slice(12), @@ -62,7 +62,7 @@ console.log(str5); // OUTPUT: "" <p>아래 예시는 <code>slice()</code>에 음수 인덱스를 사용합니다.</p> -<pre class="brush: js notranslate">var str = 'The morning is upon us.'; +<pre class="brush: js ">var str = 'The morning is upon us.'; str.slice(-3); // returns 'us.' str.slice(-3, -1); // returns 'us' str.slice(0, -1); // returns 'The morning is upon us' @@ -70,16 +70,16 @@ str.slice(0, -1); // returns 'The morning is upon us' <p>아래의 예시는 시작 인덱스를 찾기 위해 문자열의 끝에서부터 역방향으로 <code>11</code>개를 세고 끝 인덱스를 찾기 위해 문자열의 시작에서부터 정방향으로 <code>16</code>개를 셉니다.</p> -<pre class="brush: js notranslate"><code>console.log(str.slice(-11, 16)) // => "is u";</code></pre> +<pre class="brush: js "><code>console.log(str.slice(-11, 16)) // => "is u";</code></pre> <p>아래에서는 시작 인덱스를 찾기 위해 문자열의 처음부터 정방향으로 <code>11</code>개를 세고 끝 인덱스를 찾기 위해 끝에서부터 <code>7</code>개를 셉니다.</p> -<pre class="brush: js notranslate"><code>console.log(str.slice(11, -7)) // => "is u";</code> +<pre class="brush: js "><code>console.log(str.slice(11, -7)) // => "is u";</code> </pre> <p>이 인수는 끝에서부터 5로 역순으로 계산하여 시작 인덱스를 찾은 다음 끝에서부터 1을 거쳐 끝 인덱스를 찾습니다.</p> -<pre class="brush: js notranslate"><code>console.log(str.slice(-5, -1)) // => "n us";</code> +<pre class="brush: js "><code>console.log(str.slice(-5, -1)) // => "n us";</code> </pre> <h2 id="Specifications">Specifications</h2> diff --git a/files/ko/web/javascript/reference/global_objects/undefined/index.html b/files/ko/web/javascript/reference/global_objects/undefined/index.html index ca11856dc0..eb75867c9a 100644 --- a/files/ko/web/javascript/reference/global_objects/undefined/index.html +++ b/files/ko/web/javascript/reference/global_objects/undefined/index.html @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/undefined <h2 id="구문">구문</h2> -<pre class="syntaxbox notranslate">undefined</pre> +<pre class="syntaxbox ">undefined</pre> <h2 id="설명">설명</h2> @@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/undefined <div class="note"> <p><code>undefined</code>는 <a href="/ko/docs/Web/JavaScript/Reference/Reserved_Words">예약어</a>가 아니기 때문에 전역 범위 외에서 {{Glossary("Identifier", "식별자")}}(변수 이름)로 사용할 수 있습니다. 그러나 유지보수와 디버깅 시 어려움을 낳을 수 있으므로 반드시 피해야 합니다.</p> -<pre class="brush: js example-bad notranslate">// DON'T DO THIS +<pre class="brush: js example-bad ">// DON'T DO THIS // logs "foo string" (function() { @@ -49,7 +49,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/undefined <p><code>undefined</code>와 일치, 불일치 연산자를 사용해 변수에 값이 할당됐는지 판별할 수 있습니다. 다음 예제에서 변수 <code>x</code>는 초기화되지 않았으므로 <code>if</code>문은 <code>true</code>로 평가됩니다.</p> -<pre class="brush: js notranslate">var x; +<pre class="brush: js ">var x; if (x === undefined) { // 이 문이 실행됨 } @@ -68,7 +68,7 @@ else { <p>위의 예제 대신 {{jsxref("Operators/typeof", "typeof")}}를 사용할 수도 있습니다.</p> -<pre class="brush: js notranslate">var x; +<pre class="brush: js ">var x; if (typeof x === 'undefined') { // 이 문이 실행됨 } @@ -76,7 +76,7 @@ if (typeof x === 'undefined') { <p><code>typeof</code>를 사용하는 이유 중 하나는 선언하지 않은 변수를 사용해도 오류를 던지지 않기 때문입니다.</p> -<pre class="brush: js notranslate">// x를 선언한 적 없음 +<pre class="brush: js ">// x를 선언한 적 없음 if (typeof x === 'undefined') { // 오류 없이 true로 평가 // 이 문이 실행됨 } @@ -90,7 +90,7 @@ if(x === undefined) { // ReferenceError <p>전역 범위는 {{jsxref("globalThis", "전역 객체", "", 1)}}에 묶여 있으므로, 전역 맥락에서 변수의 존재 유무는 {{jsxref("Operators/in", "in")}} 연산자를 전역 객체 대상으로 실행해 알 수 있습니다. 즉,</p> -<pre class="brush: js notranslate">if ('x' in window) { +<pre class="brush: js ">if ('x' in window) { // x가 전역으로 정의된 경우 이 문이 실행됨 }</pre> @@ -98,7 +98,7 @@ if(x === undefined) { // ReferenceError <p>{{jsxref("Operators/void", "void")}} 연산자를 제 3의 대안으로 사용할 수 있습니다.</p> -<pre class="brush: js notranslate">var x; +<pre class="brush: js ">var x; if (x === void 0) { // 이 문이 실행됨 } diff --git a/files/ko/web/javascript/reference/lexical_grammar/index.html b/files/ko/web/javascript/reference/lexical_grammar/index.html index 1f2349bc1a..c127dcd69c 100644 --- a/files/ko/web/javascript/reference/lexical_grammar/index.html +++ b/files/ko/web/javascript/reference/lexical_grammar/index.html @@ -166,7 +166,7 @@ translation_of: Web/JavaScript/Reference/Lexical_grammar <p>첫 번째, '//'로 첨언하기입니다. 이는 아래의 예시처럼 같은 줄에 있는 모든 코드를 주석으로 바꿉니다.</p> -<pre class="brush: js notranslate">function comment() { +<pre class="brush: js ">function comment() { // 자바스크립트의 각주 한 줄입니다. console.log("Hello world!"); } @@ -177,7 +177,7 @@ comment(); <p>예를 들면, 한 줄에 첨언할 때는 이렇게 쓸 수 있습니다 :</p> -<pre class="brush: js notranslate">function comment() { +<pre class="brush: js ">function comment() { /* 자바스크립트 각주 한 줄입니다. */ console.log("Hello world!"); } @@ -185,7 +185,7 @@ comment();</pre> <p>여러 줄로 첨언할 때는, 이렇게 씁니다 :</p> -<pre class="brush: js notranslate">function comment() { +<pre class="brush: js ">function comment() { /* This comment spans multiple lines. Notice that we don't need to end the comment until we're done. */ console.log("Hello world!"); @@ -196,13 +196,13 @@ comment();</pre> <p>function comment(x) {</p> -<pre class="brush: js notranslate"> console.log("Hello " + x /* insert the value of x */ + " !"); +<pre class="brush: js "> console.log("Hello " + x /* insert the value of x */ + " !"); } comment("world");</pre> <p>게다가, 코드 실행을 막기 위해 코드를 무용화 시키는데도 사용할 수 있습니다. 아래처럼 코드를 코멘트로 감싸는 거죠:</p> -<pre class="brush: js notranslate">function comment() { +<pre class="brush: js ">function comment() { /* console.log("Hello world!"); */ } comment();</pre> @@ -218,7 +218,7 @@ comment();</pre> <p>The hashbang comment specifies the path to a specific JavaScript interpreter<br> that you want to use to execute the script. An example is as follows:</p> -<pre class="brush: js notranslate">#!/usr/bin/env node +<pre class="brush: js ">#!/usr/bin/env node console.log("Hello world"); </pre> @@ -331,14 +331,14 @@ console.log("Hello world"); <p>Reserved words actually only apply to Identifiers (vs. <code>IdentifierNames</code>) . As described in <a href="http://es5.github.com/#A.1">es5.github.com/#A.1</a>, these are all <code>IdentifierNames</code> which do not exclude <code>ReservedWords</code>.</p> -<pre class="brush: js notranslate">a.import +<pre class="brush: js ">a.import a['import'] a = { import: 'test' }. </pre> <p>On the other hand the following is illegal because it's an <code>Identifier</code>, which is an <code>IdentifierName</code> without the reserved words. Identifiers are used for <code>FunctionDeclaration, FunctionExpression, VariableDeclaration</code> and so on. <code>IdentifierNames </code>are used for<code> MemberExpression, CallExpression</code> and so on.</p> -<pre class="brush: js notranslate">function import() {} // Illegal.</pre> +<pre class="brush: js ">function import() {} // Illegal.</pre> <h2 id="리터럴">리터럴</h2> @@ -346,20 +346,20 @@ a = { import: 'test' }. <p>See also <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/null"><code>null</code></a> for more information.</p> -<pre class="brush: js notranslate">null</pre> +<pre class="brush: js ">null</pre> <h3 id="불리언_리터럴">불리언 리터럴</h3> <p>See also <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean"><code>Boolean</code></a> for more information.</p> -<pre class="brush: js notranslate">true +<pre class="brush: js ">true false</pre> <h3 id="숫자_리터럴">숫자 리터럴</h3> <h4 id="10진법">10진법</h4> -<pre class="brush: js notranslate">1234567890 +<pre class="brush: js ">1234567890 42 // Caution when using with a leading zero: @@ -373,7 +373,7 @@ false</pre> <p>The decimal exponential literal is specified by the following format: <code>beN</code>; where <code>b</code> is a base number (integer or floating), followed by <code>e</code> char (which serves as separator or <em>exponent indicator</em>) and<em> </em><code>N</code>, which is <em>exponent</em> or <em>power</em> number – a signed integer (as per 2019 ECMA-262 specs): </p> -<pre class="notranslate">0e-5 // => 0 +<pre >0e-5 // => 0 0e+5 // => 0 5e1 // => 50 175e-2 // => 1.75 @@ -384,7 +384,7 @@ false</pre> <p>Binary number syntax uses a leading zero followed by a lowercase or uppercase Latin letter "B" (<code>0b</code> or <code>0B</code>). Because this syntax is new in ECMAScript 2015, see the browser compatibility table, below. If the digits after the <code>0b</code> are not 0 or 1, the following <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError</a></code> is thrown: "Missing binary digits after 0b".</p> -<pre class="brush: js notranslate">var FLT_SIGNBIT = 0b10000000000000000000000000000000; // 2147483648 +<pre class="brush: js ">var FLT_SIGNBIT = 0b10000000000000000000000000000000; // 2147483648 var FLT_EXPONENT = 0b01111111100000000000000000000000; // 2139095040 var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607</pre> @@ -392,7 +392,7 @@ var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607</pre> <p>Octal number syntax uses a leading zero followed by a lowercase or uppercase Latin letter "O" (<code>0o</code> or <code>0O)</code>. Because this syntax is new in ECMAScript 2015, see the browser compatibility table, below. If the digits after the <code>0o</code> are outside the range (01234567), the following <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError</a></code> is thrown: "Missing octal digits after 0o".</p> -<pre class="brush: js notranslate">var n = 0O755; // 493 +<pre class="brush: js ">var n = 0O755; // 493 var m = 0o644; // 420 // Also possible with just a leading zero (see note about decimals above) @@ -404,7 +404,7 @@ var m = 0o644; // 420 <p>Hexadecimal number syntax uses a leading zero followed by a lowercase or uppercase Latin letter "X" (<code>0x</code> or <code>0X)</code>. If the digits after 0x are outside the range (0123456789ABCDEF), the following <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError</a></code> is thrown: "Identifier starts immediately after numeric literal".</p> -<pre class="brush: js notranslate">0xFFFFFFFFFFFFFFFFF // 295147905179352830000 +<pre class="brush: js ">0xFFFFFFFFFFFFFFFFF // 295147905179352830000 0x123456789ABCDEF // 81985529216486900 0XA // 10 </pre> @@ -413,7 +413,7 @@ var m = 0o644; // 420 <p>The {{jsxref("BigInt")}} type is a numeric primitive in JavaScript that can represent integers with arbitrary precision. BigInt literals are created by appending <code>n</code> to the end of an integer.</p> -<pre class="notranslate">123456789123456789n // 123456789123456789 +<pre >123456789123456789n // 123456789123456789 0o777777777777n // 68719476735 0x123456789ABCDEFn // 81985529216486895 0b11101001010101010101n // 955733 @@ -421,12 +421,12 @@ var m = 0o644; // 420 <p>Note that legacy octal numbers with just a leading zero won't work for <code>BigInt</code>:</p> -<pre class="example-bad notranslate">// 0755n +<pre class="example-bad ">// 0755n // SyntaxError: invalid BigInt syntax</pre> <p>For octal <code>BigInt</code> numbers, always use zero followed by the letter "o" (uppercase or lowercase):</p> -<pre class="example-good notranslate">0o755n</pre> +<pre class="example-good ">0o755n</pre> <p>For more information about <code>BigInt</code>, see also <a href="/en-US/docs/Web/JavaScript/Data_structures#BigInt_type">JavaScript data structures</a>.</p> @@ -434,7 +434,7 @@ var m = 0o644; // 420 <p>To improve readability for numeric literals, underscores (<code>_</code>, <code>U+005F</code>) can be used as separators:</p> -<pre class="notranslate">// separators in decimal numbers +<pre >// separators in decimal numbers 1_000_000_000_000 1_050.95 @@ -453,7 +453,7 @@ var m = 0o644; // 420 <p>Note these limitations:</p> -<pre class="example-bad notranslate">// More than one underscore in a row is not allowed +<pre class="example-bad ">// More than one underscore in a row is not allowed 100__000; // SyntaxError // Not allowed at the end of numeric literals @@ -467,7 +467,7 @@ var m = 0o644; // 420 <p>See also {{jsxref("Object")}} and <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">Object initializer</a> for more information.</p> -<pre class="brush: js notranslate">var o = { a: 'foo', b: 'bar', c: 42 }; +<pre class="brush: js ">var o = { a: 'foo', b: 'bar', c: 42 }; // shorthand notation. New in ES2015 var a = 'foo', b = 'bar', c = 42; @@ -481,7 +481,7 @@ var o = { a: a, b: b, c: c }; <p>See also {{jsxref("Array")}} for more information.</p> -<pre class="brush: js notranslate">[1954, 1974, 1990, 2014]</pre> +<pre class="brush: js ">[1954, 1974, 1990, 2014]</pre> <h3 id="문자열_리터럴">문자열 리터럴</h3> @@ -497,14 +497,14 @@ var o = { a: a, b: b, c: c }; <p>Any code points may appear in the form of an escape sequence. String literals evaluate to ECMAScript String values. When generating these String values Unicode code points are UTF-16 encoded.</p> -<pre class="brush: js notranslate">'foo' +<pre class="brush: js ">'foo' "bar"</pre> <h4 id="16진수_이스케이프_시퀀스">16진수 이스케이프 시퀀스</h4> <p>Hexadecimal escape sequences consist of <code>\x</code> followed by exactly two hexadecimal digits representing a code unit or code point in the range 0x0000 to 0x00FF.</p> -<pre class="brush: js notranslate">'\xA9' // "©" +<pre class="brush: js ">'\xA9' // "©" </pre> <h4 id="유니코드_이스케이프_시퀀스">유니코드 이스케이프 시퀀스</h4> @@ -513,7 +513,7 @@ var o = { a: a, b: b, c: c }; <p>See also {{jsxref("String.fromCharCode()")}} and {{jsxref("String.prototype.charCodeAt()")}}.</p> -<pre class="brush: js notranslate">'\u00A9' // "©" (U+A9)</pre> +<pre class="brush: js ">'\u00A9' // "©" (U+A9)</pre> <h4 id="유니코드_코드_포인트_시퀀스">유니코드 코드 포인트 시퀀스</h4> @@ -521,7 +521,7 @@ var o = { a: a, b: b, c: c }; <p>See also {{jsxref("String.fromCodePoint()")}} and {{jsxref("String.prototype.codePointAt()")}}.</p> -<pre class="brush: js notranslate">'\u{2F804}' // CJK COMPATIBILITY IDEOGRAPH-2F804 (U+2F804) +<pre class="brush: js ">'\u{2F804}' // CJK COMPATIBILITY IDEOGRAPH-2F804 (U+2F804) // the same character represented as a surrogate pair '\uD87E\uDC04'</pre> @@ -530,7 +530,7 @@ var o = { a: a, b: b, c: c }; <p>See also <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp"><code>RegExp</code></a> for more information.</p> -<pre class="brush: js notranslate">/ab+c/g +<pre class="brush: js ">/ab+c/g // An "empty" regular expression literal // The empty non-capturing group is necessary @@ -541,7 +541,7 @@ var o = { a: a, b: b, c: c }; <p>See also <a href="/en-US/docs/Web/JavaScript/Reference/template_strings">template strings</a> for more information.</p> -<pre class="brush: js notranslate">`string text` +<pre class="brush: js ">`string text` `string text line 1 string text line 2` @@ -568,7 +568,7 @@ tag `string text ${expression} string text`</pre> <p>1. A semicolon is inserted before, when a <a href="#Line_terminators">Line terminator</a> or "}" is encountered that is not allowed by the grammar.</p> -<pre class="brush: js notranslate">{ 1 2 } 3 +<pre class="brush: js ">{ 1 2 } 3 // is transformed by ASI into @@ -578,7 +578,7 @@ tag `string text ${expression} string text`</pre> <p>Here <code>++</code> is not treated as a <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment">postfix operator</a> applying to variable <code>b</code>, because a line terminator occurs between <code>b</code> and <code>++</code>.</p> -<pre class="brush: js notranslate">a = b +<pre class="brush: js ">a = b ++c // is transformend by ASI into @@ -598,7 +598,7 @@ a = b; <li><code>module</code></li> </ul> -<pre class="brush: js notranslate">return +<pre class="brush: js ">return a + b // is transformed by ASI into diff --git a/files/ko/web/javascript/reference/operators/await/index.html b/files/ko/web/javascript/reference/operators/await/index.html index 00b5fd3eff..4087edfca7 100644 --- a/files/ko/web/javascript/reference/operators/await/index.html +++ b/files/ko/web/javascript/reference/operators/await/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Operators/await <h2 id="구문">구문</h2> -<pre class="syntaxbox notranslate">[<em>rv</em>] = await <em>expression</em>;</pre> +<pre class="syntaxbox ">[<em>rv</em>] = await <em>expression</em>;</pre> <dl> <dt><code>expression</code></dt> @@ -34,7 +34,7 @@ translation_of: Web/JavaScript/Reference/Operators/await <p>만약 <code>Promise</code>가 <code>await</code>에 넘겨지면, <code>await</code>은 <code>Promise</code>가 fulfill되기를 기다렸다가, 해당 값을 리턴합니다.</p> -<pre class="brush: js notranslate">function resolveAfter2Seconds(x) { +<pre class="brush: js ">function resolveAfter2Seconds(x) { return new Promise(resolve => { setTimeout(() => { resolve(x); @@ -52,7 +52,7 @@ f1(); <p>{{jsxref("Global_Objects/Promise/then", "Thenable objects")}} will be fulfilled just the same.</p> -<pre class="notranslate"><code>async function f2() { +<pre ><code>async function f2() { const thenable = { then: function(resolve, _reject) { resolve('resolved!') @@ -65,7 +65,7 @@ f2();</code></pre> <p>만약 값이 <code>Promise</code>가 아니라면, 해당 값은 <code>resolve</code>된 <code>Promise</code>로 변환되며 이를 기다립니다.</p> -<pre class="brush: js notranslate">async function f2() { +<pre class="brush: js ">async function f2() { var y = await 20; console.log(y); // 20 } @@ -74,7 +74,7 @@ f2(); <p>만약 <code>Promise</code>가 <code>reject</code>되면, <code>reject</code>된 값이 <code>throw</code>됩니다.</p> -<pre class="brush: js notranslate">async function f3() { +<pre class="brush: js ">async function f3() { try { var z = await Promise.reject(30); } catch(e) { @@ -86,7 +86,7 @@ f3(); <p>try블럭 없이 rejected <code>Promise</code>다루기</p> -<pre class="notranslate"><code>var response = await promisedFunction().catch((err) => { console.error(err); }); +<pre ><code>var response = await promisedFunction().catch((err) => { console.error(err); }); // response will be undefined if the promise is rejected</code></pre> <h2 id="Specifications">Specifications</h2> |