var MyClass = class [className] [extends] {
+var MyClass = class [className] [extends] {
// class body
};
@@ -37,7 +37,7 @@ translation_of: Web/JavaScript/Reference/Operators/class
이게 바로 변수 "Foo"를 사용하여 참조할 수 있는 간단한 익명 class 식입니다.
-var Foo = class {
+var Foo = class {
constructor() {}
bar() {
return "Hello World!";
@@ -53,7 +53,7 @@ Foo.name; // ""
당신이 클래스 몸통 내에서 현재 클래스를 참조하고 싶다면, 유명 class 식을 만들 수 있습니다. 이 이름은 오직 class 식 자체 범위에서만 볼 수 있습니다.
-var Foo = class NamedFoo {
+var Foo = class NamedFoo {
constructor() {}
whoIsThere() {
return NamedFoo.name;
diff --git a/files/ko/web/javascript/reference/operators/conditional_operator/index.html b/files/ko/web/javascript/reference/operators/conditional_operator/index.html
index 491b356792..651f9827d0 100644
--- a/files/ko/web/javascript/reference/operators/conditional_operator/index.html
+++ b/files/ko/web/javascript/reference/operators/conditional_operator/index.html
@@ -24,7 +24,7 @@ browser-compat: javascript.operators.conditional
구문
-condition ? exprIfTrue : exprIfFalse
+condition ? exprIfTrue : exprIfFalse
매개변수
diff --git a/files/ko/web/javascript/reference/operators/equality/index.html b/files/ko/web/javascript/reference/operators/equality/index.html
index a31ffca59c..eb323a072d 100644
--- a/files/ko/web/javascript/reference/operators/equality/index.html
+++ b/files/ko/web/javascript/reference/operators/equality/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Operators/Equality
문법
-x == y
+x == y
상세 설명
@@ -43,12 +43,12 @@ translation_of: Web/JavaScript/Reference/Operators/Equality
타입변환 없이 비교
-1 == 1; // true
+1 == 1; // true
"hello" == "hello"; // true
타입변환을 이용한 비교
-"1" == 1; // true
+"1" == 1; // true
1 == "1"; // true
0 == false; // true
0 == null; // false
@@ -64,7 +64,7 @@ number1 == number2; // false
객체들 간의 비교
-const object1 = {"key": "value"}
+const object1 = {"key": "value"}
const object2 = {"key": "value"};
object1 == object2 // false
@@ -74,7 +74,7 @@ object2 == object2 // true
new String() 을 통해 생성된 문자열들은 객체입니다. 이 객체중 하나를 문자열과 비교한다면, String 객체가 문자열로 변환된 후 비교될 것입니다. 그러나 두개의 피연산자 모두 String 객체라면, 객체로써 비교가 이루어지기 때문에 같은 값으로 취급될려면 같은 객체를 참조하고 있어야 합니다:
-const string1 = "hello";
+const string1 = "hello";
const string2 = String("hello");
const string3 = new String("hello");
const string4 = new String("hello");
@@ -87,7 +87,7 @@ console.log(string4 == string4); // true
Comparing Dates and strings
-const d = new Date('December 17, 1995 03:24:00');
+const d = new Date('December 17, 1995 03:24:00');
const s = d.toString(); // for example: "Sun Dec 17 1995 03:24:00 GMT-0800 (Pacific Standard Time)"
console.log(d == s); //true
diff --git a/files/ko/web/javascript/reference/operators/nullish_coalescing_operator/index.html b/files/ko/web/javascript/reference/operators/nullish_coalescing_operator/index.html
index d5a4f69537..d309cd2f3e 100644
--- a/files/ko/web/javascript/reference/operators/nullish_coalescing_operator/index.html
+++ b/files/ko/web/javascript/reference/operators/nullish_coalescing_operator/index.html
@@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Operators/Nullish_coalescing_operator
문법
-leftExpr ?? rightExpr
+leftExpr ?? rightExpr
설명
@@ -26,14 +26,14 @@ translation_of: Web/JavaScript/Reference/Operators/Nullish_coalescing_operator
이전에는 변수에 기본값을 할당하고 싶을 때, 논리 연산자 OR (||)을 사용하는 것이 일반적인 패턴이다:
-let foo;
+let foo;
...
// foo is never assigned any value so it is still undefined
let someDummyText = foo || 'Hello!';
그러나 || boolean 논리 연산자 때문에, 왼쪽 피연산자는 boolean으로 강제로 변환되었고 falsy 한 값(0, '', NaN, null, undefined)은 반환되지 않았다. 이 동작은 만약 0, '' or NaN을 유효한 값으로 생각한 경우 예기치 않는 결과를 초래할 수 있다.
-let count;
+let count;
let text;
...
count = 0;
@@ -47,7 +47,7 @@ console.log(message); // "hi!" and not ""
널 병합 연산자는 첫 번째 연산자가 null 또는 undefined로 평가될 때만, 두 번째 피연산자를 반환함으로써 이러한 위험을 피한다:
-let myText = ''; // An empty string (which is also a falsy value)
+let myText = ''; // An empty string (which is also a falsy value)
let notFalsyText = myText || 'Hello world';
console.log(notFalsyText); // Hello world
@@ -60,7 +60,7 @@ console.log(preservingFalsy); // '' (as myText is neither undefined nor null)
OR과 AND 같은 논리 연산자들과 마찬가지로, 만약 왼쪽이 null 또는 undefined가 아님이 판명되면 오른쪽 표현식은 평가되지 않는다.
-function A() { console.log('A was called'); return undefined;}
+function A() { console.log('A was called'); return undefined;}
function B() { console.log('B was called'); return false;}
function C() { console.log('C was called'); return "foo";}
@@ -78,19 +78,19 @@ console.log( B() ?? C() );
AND (&&) 와 OR 연산자 (||)를 ??와 직접적으로 결합하여 사용하는 것은 불가능하다. 이 경우 SyntaxError가 발생된다.
-null || undefined ?? "foo"; // raises a SyntaxError
+null || undefined ?? "foo"; // raises a SyntaxError
true || undefined ?? "foo"; // raises a SyntaxError
그러나 우선 순위를 명시적으로 나타내기 위해 괄호를 사용하면 가능하다:
-(null || undefined ) ?? "foo"; // returns "foo"
+(null || undefined ) ?? "foo"; // returns "foo"
Optional chaining 연산자(?.)와의 관계
널 병합 연산자는 명확한 값으로 undefined과 null을 처리하고, optional chaining 연산자 (?.)는 null or undefined일 수 있는 객체의 속성에 접근할 때 유용하다.
-let foo = { someFooProp: "hi" };
+let foo = { someFooProp: "hi" };
console.log(foo.someFooProp?.toUpperCase()); // "HI"
console.log(foo.someBarProp?.toUpperCase()); // undefined
@@ -100,7 +100,7 @@ console.log(foo.someBarProp?.toUpperCase()); // undefined
이 예제는 기본 값을 제공하지만 null or undefined 이외의 값을 를 유지한다.
-function getMiscObj(){
+function getMiscObj(){
return {
aNullProperty: null,
emptyText: "", // this is not falsy
diff --git a/files/ko/web/javascript/reference/operators/this/index.html b/files/ko/web/javascript/reference/operators/this/index.html
index e74032c1c6..2ff4b1acc2 100644
--- a/files/ko/web/javascript/reference/operators/this/index.html
+++ b/files/ko/web/javascript/reference/operators/this/index.html
@@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Operators/this
구문
-this
+this
값
@@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Operators/this
전역 실행 맥락에서 this는 엄격 모드 여부에 관계 없이 전역 객체를 참조합니다.
-// 웹 브라우저에서는 window 객체가 전역 객체
+// 웹 브라우저에서는 window 객체가 전역 객체
console.log(this === window); // true
a = 37;
@@ -52,7 +52,7 @@ console.log(b) // "MDN"
다음 예제는 엄격 모드가 아니며 this의 값이 호출에 의해 설정되지 않으므로, 기본값으로 브라우저에서는 {{domxref("Window", "window")}}인 전역 객체를 참조합니다.
-function f1() {
+function f1() {
return this;
}
@@ -64,7 +64,7 @@ f1() === global; // true
반면에 엄격 모드에서 this 값은 실행 문맥에 진입하며 설정되는 값을 유지하므로 다음 예시에서 보여지는 것 처럼 this는 undefined로 남아있습니다.
-function f2(){
+function f2(){
"use strict"; // 엄격 모드 참고
return this;
}
@@ -97,7 +97,7 @@ whatsThis.apply(obj); // this는 'Custom'. 함수 내에서 obj로 설정한다.
예시 2
-function add(c, d) {
+function add(c, d) {
return this.a + this.b + c + d;
}
@@ -114,7 +114,7 @@ add.apply(o, [10, 20]); // 34
비엄격 모드에서 this로 전달된 값이 객체가 아닌 경우, call과 apply는 이를 객체로 변환하기 위한 시도를 합니다. null과 undefined 값은 전역 객체가 됩니다. 7이나 'foo'와 같은 원시값은 관련된 생성자를 사용해 객체로 변환되며, 따라서 원시 숫자 7은 new Number(7)에 의해 객체로 변환되고 문자열 'foo'는 new String('foo')에 의해 객체로 변환됩니다.
-function bar() {
+function bar() {
console.log(Object.prototype.toString.call(this));
}
@@ -127,7 +127,7 @@ bar.call(undefined); // [object global]
ECMAScript 5는 {{jsxref("Function.prototype.bind")}}를 도입했습니다. f.bind(someObject)를 호출하면 f와 같은 본문(코드)과 범위를 가졌지만 this는 원본 함수를 가진 새로운 함수를 생성합니다. 새 함수의 this는 호출 방식과 상관없이 영구적으로bind()의 첫 번째 매개변수로 고정됩니다.
-function f() {
+function f() {
return this.a;
}
@@ -144,7 +144,7 @@ console.log(o.a, o.f(), o.g(), o.h()); // 37, 37, azerty, azerty
화살표 함수에서 this는 자신을 감싼 정적 범위입니다. 전역 코드에서는 전역 객체를 가리킵니다.
-var globalObject = this;
+var globalObject = this;
var foo = (() => this);
console.log(foo() === globalObject); // true
@@ -152,7 +152,7 @@ console.log(foo() === globalObject); // true
참고: 화살표 함수를 call(), bind(), apply()를 사용해 호출할 때 this의 값을 정해주더라도 무시합니다. 사용할 매개변수를 정해주는 건 문제 없지만, 첫 번째 매개변수(thisArg)는 null을 지정해야 합니다.
-// 객체로서 메서드 호출
+// 객체로서 메서드 호출
var obj = {func: foo};
console.log(obj.func() === globalObject); // true
@@ -165,7 +165,7 @@ console.log(foo() === globalObject); // true
어떤 방법을 사용하든 foo의 this는 생성 시점의 것으로 설정됩니다(위 예시에서는 global 객체). 다른 함수 내에서 생성된 화살표 함수에도 동일하게 적용됩니다. this는 싸여진 렉시컬 컨텍스트의 것으로 유지됩니다.
-// this를 반환하는 메소드 bar를 갖는 obj를 생성합니다.
+// this를 반환하는 메소드 bar를 갖는 obj를 생성합니다.
// 반환된 함수는 화살표 함수로 생성되었으므로,
// this는 감싸진 함수의 this로 영구적으로 묶입니다.
// bar의 값은 호출에서 설정될 수 있으며, 이는 반환된 함수의 값을 설정하는 것입니다.
@@ -198,7 +198,7 @@ console.log(fn2()() == window); // true
다음 예제에서 o.f()를 실행할 때 o 객체가 함수 내부의 this와 연결됩니다.
-var o = {
+var o = {
prop: 37,
f: function() {
return this.prop;
@@ -210,7 +210,7 @@ console.log(o.f()); // 37
이 행동이 함수가 정의된 방법이나 위치에 전혀 영향을 받지 않는 것에 유의해라. 이전 예제에서, o 의 정의 중 f 함수를 구성원으로 내부에 정의 하였다. 그러나, 간단하게 함수를 먼저 정의하고 나중에 o.f를 추가할 수 있다. 이렇게 하면 동일한 동작 결과 이다 :
-var o = {prop: 37};
+var o = {prop: 37};
function independent() {
return this.prop;
@@ -225,7 +225,7 @@ console.log(o.f()); // logs 37
마찬가지로, 이 this 바인딩은 가장 즉각으로 멤버 대상에 영향을 받는다. 다음 예제에서, 함수를 실행할 때, 객체 o.b의 메소드 g 로서 호출한다. 이것이 실행되는 동안, 함수 내부의 this는 o.b를 나타낸다. 객체는 그 자신이 o의 멤버 중 하나라는 사실은 중요하지 않다. 가장 즉각적인 참조가 중요한 것이다.
-o.b = {g: independent, prop: 42};
+o.b = {g: independent, prop: 42};
console.log(o.b.g()); // logs 42
@@ -233,7 +233,7 @@ console.log(o.b.g()); // logs 42
같은 개념으로 객체의 프로토타입 체인 어딘가에 정의한 메서드도 마찬가지입니다. 메서드가 어떤 객체의 프로토타입 체인 위에 존재하면, this의 값은 그 객체가 메서드를 가진 것 마냥 설정됩니다.
-var o = {
+var o = {
f:function() { return this.a + this.b; }
};
var p = Object.create(o);
@@ -249,7 +249,7 @@ console.log(p.f()); // 5
다시 한 번 같은 개념으로, 함수를 접근자와 설정자에서 호출하더라도 동일합니다. 접근자나 설정자로 사용하는 함수의 this는 접근하거나 설정하는 속성을 가진 객체로 묶입니다.
-function sum() {
+function sum() {
return this.a + this.b + this.c;
}
@@ -276,7 +276,7 @@ console.log(o.average, o.sum); // 2, 6
While the default for a constructor is to return the object referenced by this, it can instead return some other object (if the return value isn't an object, then the this object is returned).
-/*
+/*
* Constructors work like this:
*
* function MyConstructor(){
@@ -316,7 +316,7 @@ console.log(o.a); // 38
함수를 이벤트 처리기로 사용하면 this는 이벤트를 발사한 요소로 설정됩니다. 일부 브라우저는 {{domxref("EventTarget.addEventListener()", "addEventListener()")}} 외의 다른 방법으로 추가한 처리기에 대해선 이 규칙을 따르지 않습니다.
-// 처리기로 호출하면 관련 객체를 파랗게 만듦
+// 처리기로 호출하면 관련 객체를 파랗게 만듦
function bluify(e) {
// 언제나 true
console.log(this === e.currentTarget);
@@ -338,13 +338,13 @@ for (var i = 0; i < elements.length; i++) {
코드를 인라인 이벤트 처리기로 사용하면 this는 처리기를 배치한 DOM 요소로 설정됩니다.
-<button onclick="alert(this.tagName.toLowerCase());">
+<button onclick="alert(this.tagName.toLowerCase());">
this 표시
</button>
위의 경고창은 button을 보여줍니다. 다만 바깥쪽 코드만 this를 이런 방식으로 설정합니다.
-<button onclick="alert((function() { return this; })());">
+<button onclick="alert((function() { return this; })());">
내부 this 표시
</button>
diff --git a/files/ko/web/javascript/reference/statements/async_function/index.html b/files/ko/web/javascript/reference/statements/async_function/index.html
index c1827af8e2..a2dd584d1f 100644
--- a/files/ko/web/javascript/reference/statements/async_function/index.html
+++ b/files/ko/web/javascript/reference/statements/async_function/index.html
@@ -19,7 +19,7 @@ translation_of: Web/JavaScript/Reference/Statements/async_function
Syntax
-async function name([param[, param[, ... param]]]) {
+async function name([param[, param[, ... param]]]) {
statements
}
@@ -63,13 +63,13 @@ translation_of: Web/JavaScript/Reference/Statements/async_function
예를 들어
-async function foo() {
+async function foo() {
return 1
}
위 코드는 아래와 같습니다.
-function foo() {
+function foo() {
return Promise.resolve(1)
}
@@ -77,13 +77,13 @@ translation_of: Web/JavaScript/Reference/Statements/async_function
예를 들어
-async function foo() {
+async function foo() {
await 1
}
위 코드는 아래와 같습니다.
-function foo() {
+function foo() {
return Promise.resolve(1).then(() => undefined)
}
@@ -92,7 +92,7 @@ translation_of: Web/JavaScript/Reference/Statements/async_function
Simple example
-var resolveAfter2Seconds = function() {
+var resolveAfter2Seconds = function() {
console.log("starting slow promise");
return new Promise(resolve => {
setTimeout(function() {
@@ -169,7 +169,7 @@ setTimeout(parallel, 10000); // trully parallel: after 1 second, logs "fast", th
{{jsxref("Promise")}} 를 반환하는 API는 promise chain을 만들며 여러 파트의 함수로 나뉜다.
아래 코드를 보자.
-function getProcessedData(url) {
+function getProcessedData(url) {
return downloadData(url) // returns a promise
.catch(e => {
return downloadFallbackData(url) // returns a promise
@@ -182,7 +182,7 @@ setTimeout(parallel, 10000); // trully parallel: after 1 second, logs "fast", th
위의 코드는 하나의 async함수로 아래와 같이 쓰여질 수도 있다.
-async function getProcessedData(url) {
+async function getProcessedData(url) {
let v;
try {
v = await downloadData(url);
diff --git a/files/ko/web/javascript/reference/statements/do...while/index.html b/files/ko/web/javascript/reference/statements/do...while/index.html
index 9cd6ed0e5c..5b869ddb82 100644
--- a/files/ko/web/javascript/reference/statements/do...while/index.html
+++ b/files/ko/web/javascript/reference/statements/do...while/index.html
@@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Statements/do...while
문법
-do구문
+do구문
while (조건식);
@@ -36,7 +36,7 @@ while (조건식);
예제에서 do...while 문은 적어도 한번 반복되고 i 변수가 5 보다 작을 때까지 실행됩니다.
-var result = '';
+var result = '';
var i = 0;
do {
i += 1;
diff --git a/files/ko/web/javascript/reference/statements/for...in/index.html b/files/ko/web/javascript/reference/statements/for...in/index.html
index f5e54dcac2..5748e2f097 100644
--- a/files/ko/web/javascript/reference/statements/for...in/index.html
+++ b/files/ko/web/javascript/reference/statements/for...in/index.html
@@ -14,7 +14,7 @@ translation_of: Web/JavaScript/Reference/Statements/for...in
문법
-for (variable in object) { ... }
+for (variable in object) { ... }
파라미터
@@ -64,7 +64,7 @@ translation_of: Web/JavaScript/Reference/Statements/for...in
아래의 예는 열거 가능한 non-Symbol속성들을 반복해서 속성의 이름과 그 값을 기록합니다.
-var obj = {a: 1, b: 2, c: 3};
+var obj = {a: 1, b: 2, c: 3};
for (const prop in obj) {
console.log(`obj.${prop} = ${obj[prop]}`);
@@ -79,7 +79,7 @@ for (const prop in obj) {
아래는 {{jsxref("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} 를 사용하는 예를 보여주고 있습니다. 상속된 속성은 표시되지 않습니다.
-var triangle = {a:1, b:2, c:3};
+var triangle = {a:1, b:2, c:3};
function ColoredTriangle() {
this.color = "red";
@@ -148,7 +148,7 @@ alert(show_own_props(o, "o")); /* alerts: o.color = red */
Prior to SpiderMonkey 40 {{geckoRelease(40)}}, it was possible to use an initializer expression (i=0) in a for...in loop:
-var obj = {a: 1, b: 2, c: 3};
+var obj = {a: 1, b: 2, c: 3};
for (var i = 0 in obj) {
console.log(obj[i]);
}
diff --git a/files/ko/web/javascript/reference/statements/try...catch/index.html b/files/ko/web/javascript/reference/statements/try...catch/index.html
index a96c81e1a5..889fa2e7bb 100644
--- a/files/ko/web/javascript/reference/statements/try...catch/index.html
+++ b/files/ko/web/javascript/reference/statements/try...catch/index.html
@@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Statements/try...catch
문법
-try {
+try {
try_statements
}
[catch (exception_var) {
@@ -67,7 +67,7 @@ translation_of: Web/JavaScript/Reference/Statements/try...catch
-try {
+try {
throw "myException"; // generates an exception
}
catch (e) {
@@ -82,7 +82,7 @@ catch (e) {
-try {
+try {
myroutine(); // may throw three types of exceptions
} catch (e) {
if (e instanceof TypeError) {
@@ -102,7 +102,7 @@ catch (e) {
이에 대한 일반적인 사용 사례는 예상 오류의 작은 하위 집합 만 포착 (및 침묵) 한 다음 다른 경우에 오류를 다시 발생시키는 것입니다.
-try {
+try {
myRoutine();
} catch (e) {
if (e instanceof RangeError) {
@@ -118,7 +118,7 @@ catch (e) {
-function isValidJSON(text) {
+function isValidJSON(text) {
try {
JSON.parse(text);
return true;
@@ -135,7 +135,7 @@ catch (e) {
The following example shows one use case for the finally-block. The code opens a file and then executes statements that use the file; the finally-block makes sure the file always closes after it is used even if an exception was thrown.
-openMyFile();
+openMyFile();
try {
// tie up a resource
writeMyFile(theData);
@@ -150,7 +150,7 @@ finally {
First, let's see what happens with this:
-try {
+try {
try {
throw new Error('oops');
}
@@ -169,7 +169,7 @@ catch (ex) {
Now, if we already caught the exception in the inner try-block by adding a catch-block
-try {
+try {
try {
throw new Error('oops');
}
@@ -191,7 +191,7 @@ catch (ex) {
And now, let's rethrow the error.
-try {
+try {
try {
throw new Error('oops');
}
@@ -219,7 +219,7 @@ catch (ex) {
If the finally-block returns a value, this value becomes the return value of the entire try-catch-finally statement, regardless of any return statements in the try and catch-blocks. This includes exceptions thrown inside of the catch-block:
-(function() {
+(function() {
try {
try {
throw new Error('oops');
diff --git a/files/ko/web/javascript/reference/strict_mode/index.html b/files/ko/web/javascript/reference/strict_mode/index.html
index 9fc6a1afe8..5cffa86224 100644
--- a/files/ko/web/javascript/reference/strict_mode/index.html
+++ b/files/ko/web/javascript/reference/strict_mode/index.html
@@ -33,7 +33,7 @@ translation_of: Web/JavaScript/Reference/Strict_mode
엄격모드를 전체 스크립트에 적용하기 위해, 정확한 구문 "use strict";(또는 'use strict';) 을 다른 구문 작성 전에 삽입합니다.
-// 전체 스크립트 엄격 모드 구문
+// 전체 스크립트 엄격 모드 구문
'use strict';
var v = "Hi! I'm a strict mode script!";
@@ -46,7 +46,7 @@ var v = "Hi! I'm a strict mode script!";
마찬가지로, 함수에 strict mode를 적용하기 위해, 함수 본문 처음에 다음의 구문을 넣습니다. "use strict"; (또는 'use strict';).
-function strict() {
+function strict() {
// 함수-레벨 strict mode 문법
'use strict';
function nested() { return "And so am I!"; }
@@ -59,7 +59,7 @@ function notStrict() { return "I'm not strict."; }
ECMAScript 2015 는 JavaScript 모듈을 소개했습니다. 따라서, 이는 엄격 모드를 적용할 수 있는 3번 째 방법입니다. JavaScript 모듈의 전체 컨텐츠는 엄격 모드 시작을 위한 구문 없이도 자동으로 엄격모드입니다.
-function strict() {
+function strict() {
// 모듈이기때문에 기본적으로 엄격합니다
}
export default strict;
@@ -76,14 +76,14 @@ export default strict;
첫째로, 엄격모드는 실수로 글로벌 변수를 생성하는 것을 불가능하게 만듭니다. 일반적인 JavaScript에서 변수를 잘못 입력하면 전역 객체에 대한 새 속성이 만들어지고 그대로 "동작" (미래의 오류가 발생할 수 있음: modern 자바 스크립트처럼) 합니다. 전역 변수를 생성하는 할당은 엄격 모드에선 오류를 발생시킵니다.
-"use strict";
+"use strict";
// 전역 변수 mistypedVariable 이 존재한다고 가정
mistypedVaraible = 17; // 변수의 오타때문에 이 라인에서 ReferenceError 를 발생시킴
둘째로, 엄격모드는 예외를 발생시키는 실패를 조용히 넘어가는 대신 작업을 만듭니다. 예를 들어, NaN 은 쓸 수 없는 전역 변수입니다. NaN 에 할당하는 일반적인 코드는 아무 것도 하지 않습니다. 개발자도 아무런 실패 피드백을 받지 않습니다. 엄격 모드에서 NaN 에 할당하는 것은 예외를 발생시킵니다. 일반 코드에서 조용히 넘어가는 모든 실패에 대해 (쓸 수 없는 전역 또는 프로퍼티에 할당, getter-only 프로퍼티에 할당, 확장 불가 객체에 새 프로퍼티 할당) 엄격 모드에서는 예외를 발생시킵니다.
-"use strict";
+"use strict";
// 쓸 수 없는 프로퍼티에 할당
var undefined = 5; // TypeError 발생
@@ -106,7 +106,7 @@ fixed.newProp = "ohai"; // TypeError 발생
셋째로, 엄격 모드는 삭제할 수 없는 프로퍼티를 삭제하려할 때 예외를 발생시킵니다(시도가 어떤 효과도 없을 때).
-"use strict";
+"use strict";
delete Object.prototype; // TypeError 발생
@@ -116,13 +116,13 @@ delete Object.prototype; // TypeError 발생
ECMAScript 2015부터는 에러가 아닙니다. ({{bug(1041128)}}).
-"use strict";
+"use strict";
var o = { p: 1, p: 2 }; // !!! 구문 에러
다섯째로, 엄격모드는 유니크한 함수 파라미터 이름을 요구합니다. 일반 코드에서는 마지막으로 중복된 인수가 이전에 지정된 인수를 숨깁니다. 이러한 이전의 인수들은 arguments[i] 를 통해 여전히 남아 있을 수 있으므로, 완전히 접근 불가한 것이 아닙니다. 여전히, 이런 숨김 처리는 이치에 맞지 않으며 원했던 것이 아닐 수 있습니다(예를 들면 오타를 숨길 수도 있습니다). 따라서 엄격 모드에서는 중복 인수명은 구문 에러입니다.
-function sum(a, a, c){ // !!! 구문 에러
+function sum(a, a, c){ // !!! 구문 에러
"use strict";
return a + b + c; // 코드가 실행되면 잘못된 것임
}
@@ -130,11 +130,11 @@ var o = { p: 1, p: 2 }; // !!! 구문 에러
여섯째로, ECMAScript 5 에서의 엄격 모드는 8진 구문을 금지합니다. 8진 구문은 ES5의 문법이 아니지만, 모든 브라우저에서 앞에 0을 붙여 지원됩니다(0644 === 420 와 "\045" === "%"). ECMAScript 2015 에서는 접두사 "0o"를 붙여 8진수를 지원합니다.
-var a = 0o10; // ES6: 8진수
+var a = 0o10; // ES6: 8진수
초보 개발자들은 가끔 앞에 붙은 0 이 무의미하다고 생각하여, 이를 정렬용으로 사용합니다 — 하지만 이는 숫자의 의미를 바꿔버립니다! 이 8진수 문법은 거의 무용하며 잘못 사용될 수 있으므로 엄격모드에서 이 구문은 에러입니다.
-"use strict";
+"use strict";
var sum = 015 + // !!! 구문 에러
197 +
142;
@@ -142,7 +142,7 @@ var sum = 015 + // !!! 구문 에러
일곱째로, ECMAScript 6 의 엄격모드는 {{Glossary("primitive")}} 값에 프로퍼티를 설정하는 것을 금지합니다. 엄격모드가 아닐 때에는 프로퍼티 설정이 간단하게 무시되지만(no-op), 엄격모드에서는 {{jsxref("TypeError")}} 를 발생시킵니다.
-(function() {
+(function() {
"use strict";
false.true = ""; // TypeError
@@ -157,7 +157,7 @@ false.true = ""; // TypeError
첫째로, 엄격모드는 with 를 사용하지 못하게합니다. with 사용의 문제는 런타임중에 블록안의 모든 이름이 전달된 객체의 프로퍼티나 인근 (또는 심지어 전역) 스코프 내의 변수로 매핑될 수도 있다는 것입니다. 이는 사전에 아는 것이 불가합니다. 엄격 모드는 with 를 구문 에러로 만들어, with 의 이름이 런타임에 알 수 없는 위치를 참조하지 않도록합니다.
-"use strict";
+"use strict";
var x = 17;
with (obj) // !!! 구문 에러
{
@@ -173,7 +173,7 @@ with (obj) // !!! 구문 에러
둘째로, 엄격모드 코드의 eval 은 새로운 변수를 주위 스코프에 추가하지 않습니다. 일반적인 코드에서 eval("var x;") 는 변수 x 를 주위 함수나 전역 스코프에 추가합니다. 이는, 일반적으로 eval 호출을 포함하는 함수에서 인수나 지역 변수를 참조하지 않는 모든 이름은 런타임에 특정 정의에 반드시 매핑되어야 함을 의미합니다(eval 이 외부 변수를 숨기는 새로운 변수를 추가했기 때문입니다). 엄격모드에서 eval 은 evaluated 된 코드에서만 변수를 생성하므로, 외부 변수나 일부 로컬 변수에 참조하는지에 영향을 주지 않습니다.
-var x = 17;
+var x = 17;
var evalX = eval("'use strict'; var x = 42; x");
console.assert(x === 17);
console.assert(evalX === 42);
@@ -181,7 +181,7 @@ console.assert(evalX === 42);
이와 관련해서, eval 함수가 엄격모드 코드 내에서 eval(...) 형태의 표현으로 적용되었다면, 코드는 엄격모드 코드로 evaluated 됩니다. 코드는 명시적으로 엄격모드를 적용할 수 있지만, 필수적인 것은 아닙니다.
-function strict1(str){
+function strict1(str){
"use strict";
return eval(str); // str 은 엄격모드 코드로 다뤄짐
}
@@ -206,7 +206,7 @@ nonstrict("'use strict'; '엄격모드 코드!'");
셋째로, 엄격모드는 일반 이름을 제거하는 것을 금지합니다. 엄격 모드에서 delete name 은 구문 에러입니다.
-"use strict";
+"use strict";
var x;
delete x; // !!! 구문 에러
@@ -219,7 +219,7 @@ eval("var y; delete y;"); // !!! syntax error
첫째로, 변수명 eval 과 arguments 는 언어 문법에 바운드되거나 할당될 수 없습니다. 다음 시도들은 모두 구문 에러입니다.
-"use strict";
+"use strict";
eval = 17;
arguments++;
++eval;
@@ -234,7 +234,7 @@ var f = new Function("arguments", "'use strict'; return 17;");
둘째로, 엄격모드 코드는 arguments 객체가 생성한 프로퍼티를 앨리어스하지 않습니다. 함수의 첫 번째 인수가 arg 인 일반 코드에서는 arg 를 설정하는 것은 arguments[0] 를 설정하기도 하며, 그 반대도 그렇습니다(인수가 제공되지 않거나, arguments[0] 이 삭제된 경우는 제외). 엄격모드 함수의 arguments 객체는 함수가 호출될 때 원본 인수들을 저장합니다. arguments[i] 는 명명된 인수에 해당하는 값을 추적하지 않으며, 명명된 인수도 arguments[i] 에 해당하는 값을 추적하지 않습니다.
-function f(a){
+function f(a){
"use strict";
a = 42;
return [a, arguments[0]];
@@ -246,7 +246,7 @@ console.assert(pair[1] === 17);
셋째로, arguments.callee 는 더 이상 지원되지 않습니다. 일반 코드의 arguments.callee 는 바깥 함수를 참조합니다. 이런 유즈 케이스는 중요하지 않습니다. 간단히 바깥 함수의 이름을 사용하면됩니다. 더욱이, arguments.callee 는 인라인 함수와 같은 최적화를 상당히 방해하므로, arguments.callee 가 접근하는 함수는 인라인이 아닌 함수를 참조하도록 제공해야 했습니다. 엄격모드 함수의 arguments.callee 는 삭제할 수 없는 프로퍼티이며, 설정이나 반환할때 에러를 발생합니다.
-"use strict";
+"use strict";
var f = function() { return arguments.callee; };
f(); // TypeError
@@ -257,7 +257,7 @@ f(); // TypeError
첫째, 엄격모드에서는 this 로 함수에 전달된 값은 강제로 객체가 되지 않습니다 (a.k.a. "boxed"). 보통 함수의 경우, this 는 언제나 객체입니다: 객체값 this 와 함께 호출된 경우 제공된 객체이거나 ; 부울값, 문자 또는 숫자 this 로 호출된 경우 그 값은 Boxed 입니다; 또는 undefined 또는 null this 로 호출되면 전역객체입니다. (특정된 this 명세를 위해서는 call, apply, 또는 bind 를 사용하십시요) 자동 박싱은 성능 비용뿐 아니라 전역 객체가 브라우저에 노출되는것은 보안상 위험합니다. 전역객체들은 자바스크립트 환경의 "보안" 기능에 접근하는것을 제공하기때문에 제한되어야 합니다. 따라서 엄격모드의 함수는, 정의된 this 는 박스드 객체가 되지 않으며, 정의되지 않은경우 this 는 undefined 가 됩니다:
-"use strict";
+"use strict";
function fun() { return this; }
console.assert(fun() === undefined);
console.assert(fun.call(2) === 2);
@@ -270,7 +270,7 @@ console.assert(fun.bind(true)() === true);
둘째로, 엄격모드에서는 ECMAScript의 일반적으로 구현된 확장을 통해 자바스크립트 스택을 "걷는"것이 불가능합니다. 이러한 일반적인 확장 코드는, 함수 fun 이 호출되는 중간에, fun.caller 는 가장 최근에 fun 을 호출한 함수이고 fun.arguments 는 fun을 호출하기 위한 인수입니다. "권한있는"함수와 (잠재적으로 보안되지 않은) 인수에 접근을 허용하기때문에 두가지 확장 모두 자바스크립트의 "보안" 문제가 됩니다. fun 이 엄격모드인경우, both fun.caller 와 fun.arguments 모두 설정 또는 검색될때 삭제 불가능한 속성이 됩니다.
-function restricted()
+function restricted()
{
"use strict";
restricted.caller; // throws a TypeError
@@ -285,7 +285,7 @@ privilegedInvoker();
셋째, 엄격모드의 인수 는 더이상 해당 함수의 호출 변수에 대한 접근을 제공하지 않습니다. 일부 이전 ECMAScript에서 arguments.caller 해당 함수에 별명이 지정된 객체였습니다. 이것은 함수의 추상화를 통해 권한이 있는 값을 숨길수 있는 기능을 차단하여 보안의 위협이 됩니다; 이것은 또한 대부분의 최적화를 배제시킵니다. 이러한 이유로 최신 브라우저들은 이를 구현하지 않습니다. 하지만 이것들의 이전 기능들 때문에, 엄격모드함수에서 arguments.caller 설정이나 검색시 삭제 불가능한 요소가 됩니다:
-"use strict";
+"use strict";
function fun(a, b)
{
"use strict";
@@ -301,7 +301,7 @@ fun(1, 2); // doesn't expose v (or a or b)
첫번째로, 엄격 모드에서의 식별자 후보들은 예약어가 됩니다. 이 예약어들은 implements, interface, let, package, private, protected, public, static, yield입니다. 그럼, 엄격 모드에서는 이 예약어와 똑같은 이름을 사용하거나, 변수명 또는 아규먼트명으로도 사용할 수 없습니다.
-function package(protected){ // !!!
+function package(protected){ // !!!
"use strict";
var implements; // !!!
@@ -320,7 +320,7 @@ function fun(static) { 'use strict'; } // !!!
다음은, 엄격 모드는 스크립트나 함수의 탑 레벨이 아닌 곳에서의 함수 내용 정의를 제한합니다. (strict mode prohibits function statements not at the top level of a script or function). 브라우저에서 일반적인 코드는 함수 내용 정의가 "어디에서든" 허용됩니다. 이것은 ES5의 부분이 아닙니다!(심지어 ES3도 아니다.) 이건 다른 브라우저에서 공존할 수 없는 시멘틱의 확장입니다. 앞으로의 ECMAScript 에디션은 바라건대, 스크립트나 함수의 탑 레벨이 아닌 곳에서의 함수 내용 정의를 위해, 새로운 시멘틱을 명시할 것입니다. 엄격 모드에서 이러한 함수 정의를 금지하는 것(Prohibiting such function statements in strict mode)은 앞으로 출시될 ECMAScript의 사양을 위한 "준비"입니다. :
-"use strict";
+"use strict";
if (true){
function f() { } // !!! syntax error
f();
diff --git a/files/ko/web/javascript/reference/template_literals/index.html b/files/ko/web/javascript/reference/template_literals/index.html
index 882dfc07a1..78ed6fa5a9 100644
--- a/files/ko/web/javascript/reference/template_literals/index.html
+++ b/files/ko/web/javascript/reference/template_literals/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Template_literals
Syntax
-`string text`
+`string text`
`string text line 1
string text line 2`
@@ -25,7 +25,7 @@ tag `string text ${expression} string text`
템플릿 리터럴은 이중 따옴표 나 작은 따옴표 대신 백틱(` `) (grave accent) 을 이용합니다. 템플릿 리터럴은 또한 플레이스 홀더를 이용하여 표현식을 넣을 수 있는데, 이는 $와 중괄호( $ {expression} ) 로 표기할 수 있습니다. 플레이스 홀더 안에서의 표현식과 그 사이의 텍스트는 함께 함수로 전달됩니다. 기본 함수는 단순히 해당 부분을 단일 문자열로 연결시켜 줍니다. 템플릿 리터럴 앞에 어떠한 표현식이 있다면(여기에서는 태그), 템플릿 리터럴은 "태그가 지정된 템플릿"이라고 불리게 됩니다. 이 때, 태그 표현식 (주로 함수)이 처리된 템플릿 리터럴과 함께 호출되면, 출력하기 전에 조작할 수 있습니다. 템플릿 리터럴 안에서 백틱 문자를 사용하려면 백틱 앞에 백슬러쉬(\)를 넣으십시오.
-`\`` === "`" // --> true
+`\`` === "`" // --> true
Multi-line strings
@@ -33,14 +33,14 @@ tag `string text ${expression} string text`
일반 string 들을 사용하여, multi-line strings 들을 얻기 위해서는 아래와 같은 문법을 사용해야 할 것입니다.
-console.log("string text line 1\n"+
+console.log("string text line 1\n"+
"string text line 2");
// "string text line 1
// string text line 2"
같은 효과를 template literal을 통해 얻기 위해서는, 아래와 같이 적을 수 있습니다.
-console.log(`string text line 1
+console.log(`string text line 1
string text line 2`);
// "string text line 1
// string text line 2"
@@ -49,7 +49,7 @@ string text line 2`);
표현식(expression)을 일반 문자열(normal strings)에 삽입하기 위해서, 당신은 다음의 문법을 사용할 수 있을 것입니다.
-var a = 5;
+var a = 5;
var b = 10;
console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
// "Fifteen is 15 and
@@ -57,7 +57,7 @@ console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
template literals을 이용하면, 이를 더욱 읽기 쉽도록 다음과 같은 문법 설탕(syntactic sugar) 을 활용할 수 있습니다.
-var a = 5;
+var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and
not ${2 * a + b}.`);
@@ -72,19 +72,19 @@ not ${2 * a + b}.`);
In ES5:
-var classes = 'header'
+var classes = 'header'
classes += (isLargeScreen() ?
'' : item.isCollapsed ?
' icon-expander' : ' icon-collapser');
ES2015에서 중첩(nesting)없이 템플릿 리터럴 사용한 경우:
-const classes = `header ${ isLargeScreen() ? '' :
+const classes = `header ${ isLargeScreen() ? '' :
(item.isCollapsed ? 'icon-expander' : 'icon-collapser') }`;
ES2015에서 중첩된(nested) 템플릿 리터럴을 사용한 경우:
-const classes = `header ${ isLargeScreen() ? '' :
+const classes = `header ${ isLargeScreen() ? '' :
`icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;
@@ -93,7 +93,7 @@ classes += (isLargeScreen() ?
template literals 의 더욱 발전된 한 형태는 tagged templates 입니다. 태그를 사용하면 템플릿 리터럴을 함수로 파싱 할 수 있습니다. 태그 함수의 첫 번째 인수는 문자열 값의 배열을 포함합니다. 나머지 인수는 표현식과 관련됩니다. 결국 함수는 조작 된 문자열을 반환 할 수 있습니다 (또는 다음 예제에서 설명하는 것과 완전히 다른 결과를 반환 할 수 있습니다). function 이름은 원하는 어떤 것이든 가능합니다.
-var person = 'Mike';
+var person = 'Mike';
var age = 28;
function myTag(strings, personExp, ageExp) {
@@ -126,7 +126,7 @@ console.log(output);
다음 예시에서 보여지듯이, Tag function 들은 string 을 반환할 필요는 없습니다.
-function template(strings, ...keys) {
+function template(strings, ...keys) {
return (function(...values) {
var dict = values[values.length - 1] || {};
var result = [strings[0]];
@@ -148,7 +148,7 @@ t2Closure('Hello', {foo: 'World'}); // "Hello World!"
태그 지정된 템플릿의 첫 번째 함수 인수에서 사용할 수있는 특별한 raw property을 사용하면 escape sequences 처리하지 않고 원시 문자열을 입력 한대로 액세스 할 수 있습니다.
-function tag(strings) {
+function tag(strings) {
console.log(strings.raw[0]);
}
@@ -158,7 +158,7 @@ tag`string text line 1 \n string text line 2`;
추가로, default template function 과 string 병합으로 생성될 것 같은 raw string 을 생성하기 위한 {{jsxref("String.raw()")}} method가 존재합니다.
-var str = String.raw`Hi\n${2+3}!`;
+var str = String.raw`Hi\n${2+3}!`;
// "Hi\n5!"
str.length;
@@ -184,7 +184,7 @@ str.split('').join(',');
이는 다음과 같은 tagged template이 문제가 된다는 것을 의미하는데, ECMAScript문법에 따라, parser는 유효한 유니 코드 탈출 시퀀스가 있는지 확인하지만 형식이 잘못되었기 때문에 오류가 발생합니다.
-latex`\unicode`
+latex`\unicode`
// Throws in older ECMAScript versions (ES2016 and earlier)
// SyntaxError: malformed Unicode character escape sequence
@@ -194,7 +194,7 @@ str.split('').join(',');
그러나 illegal escape sequences는 여전히 "cooked"라고 표현되어야합니다. "cooked"배열의 {{jsxref ( "undefined")}} 요소로 나타납니다 :
-function latex(str) {
+function latex(str) {
return { "cooked": str[0], "raw": str.raw[0] }
}
diff --git a/files/ko/web/javascript/reference/trailing_commas/index.html b/files/ko/web/javascript/reference/trailing_commas/index.html
index 020febe480..faf27b091a 100644
--- a/files/ko/web/javascript/reference/trailing_commas/index.html
+++ b/files/ko/web/javascript/reference/trailing_commas/index.html
@@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Trailing_commas
JavaScript는 배열에 나타나는 trailing comma를 무시합니다.
-var arr = [
+var arr = [
1,
2,
3,
@@ -41,7 +41,7 @@ arr.length; // 3
trailing comma가 여러 개 있을 경우 빈 슬롯("구멍")이 생깁니다. 구멍이 있는 배열을 성기다(sparse)고 합니다(조밀한(dense) 배열에는 구멍이 없습니다). {{jsxref("Array.prototype.forEach()")}}나 {{jsxref("Array.prototype.map()")}}을 이용해 배열을 순회할 때는 빈 슬롯을 무시합니다.
-var arr = [1, 2, 3,,,];
+var arr = [1, 2, 3,,,];
arr.length; // 5
@@ -49,7 +49,7 @@ arr.length; // 5
ECMAScript 5부터는 객체 리터럴에도 trailing comma를 사용할 수 있습니다.
-var object = {
+var object = {
foo: "bar",
baz: "qwerty",
age: 42,
@@ -63,7 +63,7 @@ arr.length; // 5
아래의 두 함수 정의는 모두 유효하며, 서로 같습니다. Trailing comma는 함수 정의의 length 속성이나 arguments 객체에 영향을 주지 않습니다.
-function f(p) {}
+function f(p) {}
function f(p,) {}
(p) => {};
@@ -72,7 +72,7 @@ function f(p,) {}
Trailing comma는 클래스나 객체의 메소드 정의에도 사용할 수 있습니다.
-class C {
+class C {
one(a,) {},
two(a, b,) {},
}
@@ -87,7 +87,7 @@ var obj = {
아래의 두 함수 호출은 모두 유효하며, 서로 같습니다.
-f(p);
+f(p);
f(p,);
Math.max(10, 20);
@@ -98,7 +98,7 @@ Math.max(10, 20,);
함수의 매개변수 정의나 호출에 쉼표만 있을 경우 {{Jsxref("SyntaxError")}}가 발생합니다. 또한, rest 매개변수를 사용할 때는 trailing comma를 사용할 수 없습니다.
-function f(,) {} // SyntaxError: missing formal parameter
+function f(,) {} // SyntaxError: missing formal parameter
(,) => {}; // SyntaxError: expected expression, got ','
f(,) // SyntaxError: expected expression, got ','
@@ -110,7 +110,7 @@ function f(...p,) {} // SyntaxError: parameter after rest parameter
구조 분해 할당의 좌변에도 trailing comma를 사용할 수 있습니다.
-// Trailing comma가 있는 배열 구조 분해
+// Trailing comma가 있는 배열 구조 분해
[a, b,] = [1, 2];
// Trailing comma가 있는 객체 구조 분해
@@ -123,7 +123,7 @@ var {p, q,} = o;
Rest 원소가 있을 경우 역시 {{jsxref("SyntaxError")}}가 발생합니다.
-var [a, ...b,] = [1, 2, 3];
+var [a, ...b,] = [1, 2, 3];
// SyntaxError: rest element may not have a trailing comma
JSON에서의 trailing comma
@@ -132,7 +132,7 @@ var {p, q,} = o;
아래의 두 줄 모두 SyntaxError를 발생합니다.
-JSON.parse('[1, 2, 3, 4, ]');
+JSON.parse('[1, 2, 3, 4, ]');
JSON.parse('{"foo" : 1, }');
// SyntaxError JSON.parse: unexpected character
// at line 1 column 14 of the JSON data
@@ -140,7 +140,7 @@ JSON.parse('{"foo" : 1, }');
JSON을 올바르게 파싱하려면 trailing comma를 제거해야 합니다.
-JSON.parse('[1, 2, 3, 4 ]');
+JSON.parse('[1, 2, 3, 4 ]');
JSON.parse('{"foo" : 1 }');
명세
--
cgit v1.2.3-54-g00ecf