diff options
Diffstat (limited to 'files/ko/web/javascript')
74 files changed, 1038 insertions, 6318 deletions
diff --git a/files/ko/web/javascript/a_re-introduction_to_javascript/index.html b/files/ko/web/javascript/a_re-introduction_to_javascript/index.html new file mode 100644 index 0000000000..7206716138 --- /dev/null +++ b/files/ko/web/javascript/a_re-introduction_to_javascript/index.html @@ -0,0 +1,1038 @@ +--- +title: JavaScript 재입문하기 (JS 튜토리얼) +slug: A_re-introduction_to_JavaScript +tags: + - CodingScripting + - Intermediate + - Intro + - JavaScript + - Learn + - Tutorial +translation_of: Web/JavaScript/A_re-introduction_to_JavaScript +--- +<div>{{jsSidebar}}</div> + +<p>어째서 재입문일까요? 왜냐하면, <a href="/ko/docs/Glossary/JavaScript">JavaScript</a>는 <a class="external" href="http://javascript.crockford.com/javascript.html">세계에서 가장 오해받고 있는 프로그래밍 언어</a>로 악명이 높기 때문입니다. 종종 장난감같다고 조롱당하기도했지만, 이 거짓말같은 단순함 아래에는 몇 가지의 강력한 언어 기능이 숨어 있습니다. Javascript는 현재 엄청나게 많은, 요즘 가장 뜨고있는 애플리케이션들에 사용되고 있어서, 웹 또는 모바일 개발자 누구에게라도 이 기술에 대한 깊은 지식이 중요한 기량이 된다는 것을 보여주고 있습니다.</p> + +<p>이 이야기를 이해하는데는 이 언어의 역사를 먼저 보는 것이 도움이 됩니다. JavaScript는 1995년 Netscape의 엔지니어 Brendan Eich에 의해 만들어졌고, 1996년 초에 Netscape 2와 함께 처음 릴리즈 되었습니다. 이것은 원래 LiveScript로 불리기로 되어 있었습니다만 Sun Microsystem의 Java 언어의 성공에 편승해보려고 -두 언어 사이의 공통점이 매우 적음에도 불구하고- 불행이 예견된 마케팅 결정에 따라 이름이 바뀌게 됩니다. 이 결정은 역사상 유래가 없는 혼란의 근원이 되어버립니다.</p> + +<p>몇 달 후, Microsoft는 IE3와 함께 JScript를 발표했습니다. 이 JScript는 Javascript를 정말 닮았고 호환성이 좋았습니다. 몇 달 뒤에, Netscape는 1997년에 <a href="/ko/docs/Glossary/ECMAScript">ECMAScript</a> 표준의 첫번째 판이 되는 JavaScript를 유럽 표준화 단체인 <a class="external" href="http://www.ecma-international.org/">Ecma International</a>에 보냅니다. 이 표준은 1999년에 <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript edition 3</a>에 따라 큰 규모의 개정을 거친 후, 유례없이 아주 안정된 상태로 계속 유지되고 있습니다. <span style="line-height: 16.7999992370605px;">4번째 판은 중도 포기되었는데, 언어의 복잡성 증가에 관련한 정치적 문제 때문이었습니다. 이 4번째 판의 많은 파트들은 ECMAScript edition 5 (2009년 12월에 출간)와 6번째 개정판 규격(2015년에 출간)의 근간을 형성하고 있습니다. </span></p> + +<div class="note"> +<p> 이제부터는 ECMAScript를 우리에게 좀 더 친근한 말인 <span style="line-height: 16.7999992370605px;"> "</span>JavaScript"라고 부르겠습니다.</p> +</div> + +<p>대부분의 프로그래밍 언어와는 달리, JavaScript 언어는 입출력 개념이 없습니다. 이 언어는 호스트 환경 아래에서 스크립트 언어로서 동작하도록 디자인 되어있고, 따라서 외부 세계와 통신하기위해 호스트 환경이 제공하는 메커니즘에 의존합니다. 대부분의 경우 일반적인 호스트 환경은 브라우저이지만 JavaScript 인터프리터는 Adobe Acrobat, Photoshop, SVG images, Yahoo! 위젯 엔진 등의 제품에서도 발견할 수 있고, <a href="http://nodejs.org/">node.js</a> 와 같은 서버 측 환경에서도 찾을 수 있습니다. 하지만 JavaScript가 사용되는 분야는 계속 더 넓혀지고 있습니다. NoSQL 데이터베이스, <a href="http://couchdb.apache.org/">Apache CouchDB</a>, 임베디드 컴퓨터, GNU/Linux OS의 가장 유명한 GUI 인 <a href="http://www.gnome.org/">GNOME</a> 과 같은 데스크톱 환경에서도 JavaScript가 사용됩니다.</p> + +<h2 id=".EA.B0.9C.EC.9A.94" name=".EA.B0.9C.EC.9A.94">개요</h2> + +<p>JavaScript는 유형 및 연산자, 표준 내장 객체 및 메소드가 있는 다중 패러다임, 동적 언어입니다. 구문은 Java 및 C 언어를 기반으로합니다. 이러한 언어의 많은 구조가 JavaScript에도 적용됩니다. JavaScript는 클래스 대신 객체 프로토 타입을 사용하여 객체 지향 프로그래밍을 지원합니다 (<a href="/ko//docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">프로토 타입 상속</a> 및 ES2015 {{jsxref("Classes")}}). JavaScript는 함수형 프로그래밍도 지원합니다. 함수는 객체이며, 함수는 실행 가능한 코드를 유지하고 다른 객체와 마찬가지로 전달 될 수 있습니다.</p> + +<p>어떤 언어에서라도 기초가 되는 부분인 타입을 살펴보는 것부터 시작해봅시다. JavaScript 프로그램은 값을 다루고 해당 값은 모두 타입을 가지고 있습니다. JavaScript의 타입은 다음과 같습니다:</p> + +<ul> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Number">수 (Number)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/String">문자열 (String)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Boolean">부울 (Boolean)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Function">함수 (Function)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Object">객체 (Object)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Symbol">기호 (Symbol)</a> (ES2015에 새롭게 추가)</li> +</ul> + +<p>... 오, 그리고 약간 특별한 타입인 정의되지 않음(Undefined) 과 널(Null) 이 있습니다. 또한 객체의 특별한 종류인 <a href="ko/Web/JavaScript/Reference/Global_Objects/Array">배열(Array) 객체</a>. 그리고 자유롭게 사용할 수 있는 <a href="ko/Web/JavaScript/Reference/Global_Objects/Date">날짜(Date) 객체</a> 와 <a href="ko/Web/JavaScript/Reference/Global_Objects/RegExp">정규식(RegExp) 객체</a>가 있습니다. 그리고 기술적으로 정확히 말해 함수(Function)는 단지 객체의 특별한 타입으로 취급됩니다. 따라서 타입 구조도를 정리해보면 다음과 같습니다:</p> + +<ul> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Number">수 (Number)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/String">문자열 (String)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Boolean">부울 (Boolean)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Symbol">기호 (Symbol)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Object">객체 (Object)</a> + <ul> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Function">함수 (Function)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Array">배열 (Array)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/Date">날짜 (Date)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/RegExp">정규식 (RegExp)</a></li> + </ul> + </li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/null">널 (Null)</a></li> + <li><a href="ko/Web/JavaScript/Reference/Global_Objects/undefined">정의되지 않음 (Undefined)</a></li> +</ul> + +<p>그리고 또 몇 가지 <a href="ko/Web/JavaScript/Reference/Global_Objects/Error">오류</a> 타입이 내장되어 있습니다. 그렇지만 처음 구조도를 기억하고만 있으면 다른 것들도 아주 쉽게 이해할 수 있을 것입니다.</p> + +<h2 id=".EC.88.98_.28Numbers.29" name=".EC.88.98_.28Numbers.29">수 (Numbers)</h2> + +<p>설계 명세서에 의하면 JavaScript에서 수는 "이중정밀도 64비트 형식 IEEE 754 값"으로 정의됩니다. 이것은 몇가지 흥미로운 결과를 가져옵니다. JavaScript에는 <strong>정수와 같은 것이 존재하지 않으므로 </strong>({{jsxref("BigInt")}} 제외), 조금 조심해야 합니다. 이 예제를 보세요:</p> + +<pre class="syntaxbox notranslate">console.log(3 / 2); // 1이 아닌, 1.5 +console.log(Math.floor(3 / 2)); // 1</pre> + +<p><em>명백한 정수</em>는 사실 <em>암묵적으로 실수</em>입니다.</p> + +<p>또한, 다음과 같은 것들을 주의하세요:</p> + +<pre class="brush: js notranslate">0.1 + 0.2 = 0.30000000000000004 +</pre> + +<p>실제로 정수 값은 32 비트 정수로 처리되며 일부 구현은 32 비트 정수가 아닌 숫자에 유효한 명령어를 수행 할 때까지 이러한 방식으로 저장합니다. 이는 비트 단위 작업에 중요 할 수 있습니다.</p> + +<p>덧셈, 뺄셈, 계수 (또는 나머지) 연산을 포함하는 표준 <a href="ko/Core_JavaScript_1.5_Reference/Operators/Arithmetic_Operators">산술 연산자</a>가 지원됩니다. 또한 앞에서 언급하는 것을 깜박 잊은 고급 수학 함수와 상수를 다루기 위한 <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Math">수학(Math)</a>으로 불리는 내장 객체가 있습니다:</p> + +<pre class="brush: js notranslate">Math.sin(3.5); +var circumference = 2 * Math.PI * r;</pre> + +<p>내장 <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Functions/parseInt">parseInt()</a></code> 함수를 사용하여 문자열을 정수로 변환할 수 있습니다. 이는 다음과 같이 옵션으로 주어지는 두번째 매개변수를 밑으로 하여 수행할 수 있습니다:</p> + +<pre class="brush: js notranslate">parseInt('123', 10); // 123 +parseInt('010', 10); // 10</pre> + +<p>구형 브라우저에서 "0"으로 시작하는 문자열은 8 진수 (기수 8)로 가정되지만, 2013 년 이후에는 그렇지 않습니다. 문자열 형식이 확실하지 않으면 이전 브라우저에서 놀라운 결과를 얻을 수 있습니다.</p> + +<pre class="brush: js notranslate">parseInt('010'); // 8 +parseInt('0x10'); // 16</pre> + +<p>이 같은 결과는 <code>{{jsxref("Global_Objects/parseInt", "parseInt()")}}</code> 함수가 0으로 시작되는 문자열을 8진수로, "0x"로 시작하는 문자열은 16진수로 취급하기 때문에 발생합니다. 16진수 표기법이 그대로 유지됩니다. 8진수는 제거되었습니다.</p> + +<p>만약 이진수를 정수로 변환하고 싶다면, 밑을 바꾸기만하면 됩니다:</p> + +<pre class="brush: js notranslate">parseInt('11', 2); // 3 +</pre> + +<p>이와 비슷하게, 내장 함수 {{jsxref("Global_Objects/parseFloat", "parseFloat()")}}를 사용하여 부동 소수점 숫자를 파싱 할 수 있습니다. {{jsxref("Global_Objects/parseInt", "parseInt()")}}과 달리 parseFloat()는 항상 10진수를 사용합니다.</p> + +<p>단항 연산자 + 를 사용하여 값을 숫자로 변환 할 수도 있습니다:</p> + +<pre class="brush: js notranslate">+ '42'; // 42 ++ '010'; // 10 ++ '0x10'; // 16</pre> + +<p>문자열이 수가 아닌 경우 <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Properties/NaN">NaN</a></code> ("Not a Number" (수가 아님)을 줄인 약자)로 불리는 특별한 값을 돌려줍니다:</p> + +<pre class="brush: js notranslate">parseInt('hello', 10); // NaN +</pre> + +<p><code>NaN</code> 는 독성을 가지고 있습니다: 어떤 수학 연산의 입력값으로써 주어지면 그 결과는 역시 <code>NaN</code>가 되기 때문입니다:</p> + +<pre class="brush: js notranslate">NaN + 5; // NaN +</pre> + +<p>내장 <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Functions/isNaN">isNaN()</a></code> 함수를 사용해서 <code>NaN</code> 인지 여부를 검사할 수 있습니다:</p> + +<pre class="brush: js notranslate">isNaN(NaN); // true +</pre> + +<p>JavaScript는 또 특별한 값 <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Properties/Infinity">Infinity</a></code>와 <code>-Infinity</code>를 가지고 있습니다:</p> + +<pre class="brush: js notranslate"> 1 / 0; // Infinity +-1 / 0; // -Infinity</pre> + +<p>내장 함수 {{jsxref("Global_Objects/isFinite", "isFinite()")}}를 사용하여 Infinity, -Infinity 및 NaN 값을 테스트 할 수 있습니다.</p> + +<pre class="brush: js notranslate">isFinite(1 / 0); // false +isFinite(-Infinity); // false +isFinite(NaN); // false</pre> + +<div class="note"> +<p>{{jsxref("Global_Objects/parseInt", "parseInt()")}} 와 {{jsxref("Global_Objects/parseFloat", "parseFloat()")}} 함수는 숫자로 아닌 문자가 나올때까지 문자열을 파싱하고, 그 지점까지 파싱된 숫자를 반환합니다. 그런데 "+"연산자는 중간에 유효하지 않은 문자가 있으면 그대로 문자열을 <code>NaN</code> 으로 그냥 변환해버립니다. console에서 "10.2abc"를 파싱해보면 어떤점이 다른지 더 쉽게 이해할 수 있습니다.</p> +</div> + +<h2 id=".EB.AC.B8.EC.9E.90.EC.97.B4_.28Strings.29" name=".EB.AC.B8.EC.9E.90.EC.97.B4_.28Strings.29">문자열 (Strings)</h2> + +<p>JavaScript에서 문자열은 <a href="ko/Core_JavaScript_1.5_Guide/Unicode">유니코드 문자들</a>이 연결되어 만들어진 것입니다. 이는 국제화(i18n, internationalization) 하려하는 누구에게라도 환영받을만한 소식입니다. 좀 더 정확히 말하자면, 각각이 16비트 숫자로 표현된 UTF-16 코드 유닛이 길게 이어져있는 것입니다. 각 유니코드 문자는 1개나 2개의 코드 유닛으로 표현됩니다.</p> + +<p>한 개의 문자를 나타내려면 길이가 1인 문자열을 사용하면 됩니다.</p> + +<p>문자열의 길이를 알고싶다면, 해당 문자열의 <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/String/length">length</a></code> 속성(해당 객체가 소유하고 있는 성질을 나타내는 값)에 접근하면 됩니다:</p> + +<pre class="brush: js notranslate">'hello'.length; // 5 +</pre> + +<p>우리의 첫 JavaScript 객체입니다! 문자열도 역시 객체로 취급된다고 언급했던적이 있죠? 다음과 같이 <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/String#Methods">메소드</a>까지 있는 확실한 녀석입니다:</p> + +<pre class="brush: js notranslate">'hello'.charAt(0); // "h" +'hello, world'.replace('hello', 'goodbye'); // "goodbye, world" +'hello'.toUpperCase(); // "HELLO"</pre> + +<h2 id=".EC.9D.B4.EC.99.B8.EC.9D.98_.ED.83.80.EC.9E.85.EB.93.A4" name=".EC.9D.B4.EC.99.B8.EC.9D.98_.ED.83.80.EC.9E.85.EB.93.A4">이외의 타입들</h2> + +<p>JavaScript는 의도적으로 값이 없음을 가리키는 '객체' 타입의 객체인 <code>null</code>과 초기화되지 않은 값 — 아직 어떤 값도 주어지않은(할당되지않은) 변수임을 가리키는 '정의되지 않음' 타입의 객체인 <code>undefined</code>로 구분됩니다. 값에 대해서 나중에 언급할 것이지만 JavaScript에서 변수에 값을 주지않고 선언하는 것이 가능합니다. 이럴 경우, 변수의 타입은 <code>undefined</code>이 되는 것입니다.</p> + +<p>JavaScript는 <code>true</code> 와 <code>false</code> 값 (둘은 모두 키워드로 예약되어있는 값)을 가질 수 있는 부울 타입을 가지고 있습니다. 다음과 같은 규칙에 따라 어떤 임의의 값을 부울값으로 변환할 수 있습니다:</p> + +<ol> + <li><code>false</code>, <code>0</code>, 빈 문자열 (<code>""</code>), 수가 아님을 뜻하는 <code>NaN</code>, <code>null</code>, 와 <code>undefined</code>은 모두 <code>false</code>가 됩니다.</li> + <li>다른 모든 값은 <code>true</code>가 됩니다.</li> +</ol> + +<p>이 변환은 <code>Boolean()</code> 함수를 써서 명시적으로 이 작업을 수행하실 수 있습니다:</p> + +<pre class="brush: js notranslate">Boolean(''); // false +Boolean(234); // true</pre> + +<p>하지만 반드시 이렇게 할 필요는 거의 없습니다. JavaScript는 이러한 변환 작업을 <code>if</code> 문 (아래를 보세요)과 같이 부울값이 필요한 경우를 만나게되면 자동으로 사용자가 모르는 사이에 처리해버리기 때문입니다. 이러한 이유로 인해 우리는 가끔 부울 타입으로 변환되었을 때, <code>true</code>와 <code>false</code>이 됨을 의미하는 값들을 각각 "참 값"과 "거짓 값"으로 부를 것입니다. 또는 각각 "참으로 취급되다"와 "거짓으로 취급되다"라는 식으로 불릴 수도 있습니다.</p> + +<p>부울 연산자는 <code>&&</code> (논리적<em>와, 그리고</em> ), <code>||</code> (논리적<em>또는</em> ), 그리고 <code>!</code> (논리적<em>부정</em> )이 지원됩니다. 아래에서 다시 언급하겠습니다.</p> + +<h2 id=".EB.B3.80.EC.88.98_.28Variables.29" name=".EB.B3.80.EC.88.98_.28Variables.29">변수 (Variables)</h2> + +<p>JavaScript에서 새로운 변수는 <code><a href="/ko/docs/Web/JavaScript/Reference/Statements/let">let</a></code>, <code><a href="/ko/docs/Web/JavaScript/Reference/Statements/const">const</a></code>, <code><a href="/ko/docs/Web/HTML/Element/var">var</a></code> 키워드로 선언됩니다.</p> + +<p><code>let</code>을 사용하면 블록 유효 범위 변수를 선언 할 수 있습니다. 선언 된 변수는 <em>변수가 포함 된 함수 블록</em>에서 사용할 수 있습니다.</p> + +<pre class="brush: js notranslate">let a; +let name = 'Simon';</pre> + +<p>아래는 let으로 선언한 변수가 가지는 유효 범위의 예제입니다. </p> + +<pre class="brush: js notranslate">// myLetVariable는 여기에서 보이지 *않습니다* + +for (let myLetVariable = 0; myLetVariable < 5; myLetVariable++) { + // myLetVariable는 여기에서 유효합니다 +} + +// myLetVariable는 여기에서 보이지 *않습니다*</pre> + +<p><code>const</code>는 값이 변경되지 않는 변수를 선언 할 수 있게 합니다. 변수는 <em>변수가 선언 된 함수 블록</em>에서 사용할 수 있습니다.</p> + +<pre class="brush: js notranslate">const Pi = 3.14; // 변수 Pi 설정 +Pi = 1; // 상수로 설정된 변수는 변경 할 수 없기 때문에 애러 발생.</pre> + +<p><code>var</code>은 가장 일반적인 변수 선언 키워드입니다. <code>let</code>, <code>const</code> 키워드가 가지는 제한을 <code>var</code>은 갖지 않습니다. 이는 자바스크립트에서 변수를 선언하는 전통적인 유일한 방법이었기 때문입니다. <code>var</code> 키워드로 선언 된 변수는 <em>변수가 선언 된 함수 블록</em>에서 사용 할 수 있습니다.</p> + +<pre class="brush: js notranslate">var a; +var name = 'Simon';</pre> + +<p>var로 선언한 변수의 유효 범위 예제입니다.</p> + +<pre class="brush: js notranslate">// myVarVariable는 여기에서 사용 할 수 *있습니다* + +for (var myVarVariable = 0; myVarVariable < 5; myVarVariable++) { + // myVarVariable는 함수 전체에서 사용 할 수 있습니다. +} + +// myVarVariable는 여기에서 사용 할 수 *있습니다*</pre> + +<p>변수에 값을 지정하지 않고 변수를 선언하면, 타입은 <code>undefined</code>로 지정 됩니다.</p> + +<p>자바스크립트와 자바 같은 다른 언어 사이의 중요한 차이점은 자바스크립트는 블록에 범위가 없다는 것입니다. 함수에만 범위가 있습니다. 변수가 복합 문에서 (예를 들어 <code>if</code> 제어 구조 내에서) var를 사용하여 정의 된 경우 전체 함수에서 볼 수 있습니다. 그러나 ECMAScript 2015부터 <code><a href="/ko/docs/Web/JavaScript/Reference/Statements/let">let</a></code> 및 <code><a href="/ko/docs/Web/JavaScript/Reference/Statements/const">const</a></code> 선언을 사용하면 블록 범위 변수를 만들 수 있습니다.</p> + +<h2 id=".EC.97.B0.EC.82.B0.EC.9E.90_.28Operators.29" name=".EC.97.B0.EC.82.B0.EC.9E.90_.28Operators.29">연산자 (Operators)</h2> + +<p>JavaScript의 산술 연산자로는 <code>+</code>, <code>-</code>, <code>*</code>, <code>/</code>, <code>%</code>(나머지 연산자)가 있습니다. 값은 <code>=</code> 연산자로 할당할 수 있고, <code>+=</code> 와 <code>-=</code>처럼 다른 연산자를 같이사용해서 할당할 수 있습니다. 이렇게 쓰인 연산자는 <code>x = x<em>연산자</em> y</code>와 같은 결과를 나타냅니다.</p> + +<pre class="brush: js notranslate">x += 5; +x = x + 5; +</pre> + +<p><code>++</code> 와 <code>--</code> 를 각각 점진적인 증가와 감소에 사용할 수 있습니다. 이들은 또한 전처리 또는 후처리 연산자로 사용될 수 있습니다.</p> + +<p><a href="ko/Core_JavaScript_1.5_Reference/Operators/String_Operators"><code>+</code> 연산자</a>는 문자열 이어붙이기도 합니다:</p> + +<pre class="brush: js notranslate">'hello' + ' world'; // "hello world" +</pre> + +<p>문자열에 어떤 수 (또는 다른 값)를 더하면 일단 모두 문자열로 바뀌게 됩니다. 다음 예를 보시면 무슨 말씀인지 아실 수 있을겁니다:</p> + +<pre class="brush: js notranslate">'3' + 4 + 5; // "345" + 3 + 4 + '5'; // "75"</pre> + +<p>빈 문자열에 어떤 값을 더하는 것은 해당 값을 문자열로 바꾸는 요령입니다.</p> + +<p>JavaScript에서 <a href="ko/Core_JavaScript_1.5_Reference/Operators/Comparison_Operators">비교</a>는 <code><</code>, <code>></code>, <code><=</code> 와 <code>>=</code> 를 통해 가능합니다. 이 연산자들은 문자열과 수 양쪽 모두에서 동작합니다. 상동은 약간 직관성이 떨어지는데 이중 등호 (<code>==</code>) 연산자는 서로 다른 타입을 줄 경우 타입 강제 변환을 수행하기 때문에 다음과 같이 때때로 기대하지 않은 결과를 내보내기 때문입니다:</p> + +<pre class="brush: js notranslate">123 == '123'; // true +1 == true; // true +</pre> + +<p>타입 강제 변환을 하지 않게 하려면, 삼중 등호 연산자 (<code>===</code>)를 사용해야합니다:</p> + +<pre class="brush: js notranslate">123 === '123'; // false +1 === true; // false +</pre> + +<p>이와 비슷하게 <code>!=</code> 와 <code>!==</code> 연산자가 있습니다.</p> + +<p>JavaScript는 값을 <a href="ko/Core_JavaScript_1.5_Reference/Operators/Bitwise_Operators">비트로 취급하는 연산자</a>도 가지고 있습니다. 사용하고 싶을 때 언제라도 사용할 수 있도록 말이죠.</p> + +<h2 id=".EC.A0.9C.EC.96.B4_.EA.B5.AC.EC.A1.B0" name=".EC.A0.9C.EC.96.B4_.EA.B5.AC.EC.A1.B0">제어 구조</h2> + +<p>JavaScript는 C 계열의 다른 언어들과 비슷한 제어 구조를 가지고 있습니다. 조건문은 <code>if</code> 와 <code>else</code>를 지원하는데, 원하시는대로 얼마든지 중첩 시켜서 사용할 수 있습니다:</p> + +<pre class="brush: js notranslate">var name = 'kittens'; +if (name == 'puppies') { + name += ' woof'; +} else if (name == 'kittens') { + name += ' meow'; +} else { + name += '!'; +} +name == 'kittens meow'; +</pre> + +<p>JavaScript는 <code>while</code> 반복문과 <code>do-while</code> 반복문도 사용할 수 있습니다. 첫번째 것은 단순 반복에 유용하게 사용할 수 있고, 두번째 것은 반복문이 반드시 적어도 한번이상 실행 되도록 하고 싶을 때 사용할 수 있습니다:</p> + +<pre class="brush: js notranslate">while (true) { + // 무한루프! +} + +var input; +do { + input = get_input(); +} while (inputIsNotValid(input)); +</pre> + +<p>JavaScript의 <code>for</code> 반복문은 C 와 Java의 반복문과 같습니다. 말하자면, 반복문에 필요한 제어 정보를 한 줄에 표현할 수 있다는 이야기지요.</p> + +<pre class="brush: js notranslate">for (var i = 0; i < 5; i++) { + // 내부 동작을 5번 반복합니다 +} +</pre> + +<p>JavaScript에는 두개의 중요한 for 반복문 또한 포함됩니다. 첫번째로 <a href="/ko/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a> 입니다.</p> + +<pre class="brush: js notranslate">for (let value of array) { + // value로 작업을 실행합니다 +} +</pre> + +<p>그리고 <a href="/ko/docs/Web/JavaScript/Reference/Statements/for...in">for ... in</a> 입니다.</p> + +<pre class="brush: js notranslate">for (let property in object) { + // object의 항목(property)으로 작업을 실행합니다 +} +</pre> + +<p><code>&&</code> 와 <code>||</code> 연산자는 첫번째 식을 평가한 결과에 따라서 두번째 식을 평가를 실행하는 단축평가(short-circuit) 논리를 사용합니다. 이는 다음과 같이 객체에 접근하기 전에 null 객체인지, 아닌지를 검사하는데 유용하게 사용될 수 있습니다:</p> + +<pre class="brush: js notranslate">var name = o && o.getName(); +</pre> + +<p>또는 (틀린값이 유효하지 않은 값일때) 캐싱 값에 대해서도 사용합니다.:</p> + +<pre class="brush: js notranslate">var name = cachedName || (cachedName = getName()); +</pre> + +<p>JavaScript는 한줄로 조건문을 쓸 수 있게 해주는 삼중 연산자도 가지고 있습니다:</p> + +<pre class="brush: js notranslate">var allowed = (age > 18) ? "yes" : "no"; +</pre> + +<p><code>switch</code> 문은 숫자나 문자열을 기반으로 다중 분기되는 문장을 작성하는데 사용될 수 있습니다:</p> + +<pre class="brush: js notranslate">switch(action) { + case 'draw': + drawIt(); + break; + case 'eat': + eatIt(); + break; + default: + doNothing(); +} +</pre> + +<p><code>break</code> 문장을 추가하지 않았다면, 다음 단계로 "넘어가서" 실행합니다. 이렇게 되는 것을 기대하는 것은 매우 드문경우 입니다. 실은 디버깅하는데 용이하도록 하기위해 주석으로서 일부러 붙여놓은 넘어가기 이름표 입니다:</p> + +<pre class="brush: js notranslate">switch(a) { + case 1: // fallthrough + case 2: + eatIt(); + break; + default: + doNothing(); +} +</pre> + +<p>default 구문의 적용은 선택사항입니다. switch와 case 부분에서 둘다 표현식을 사용할 수도 있습니다. switch부분과 case 부분의 표현식은 <code>===</code> 연산자로 비교됩니다.</p> + +<pre class="brush: js notranslate">switch(1 + 3){ + case 2 + 2: + yay(); + break; + default: + neverhappens(); +} +</pre> + +<h2 id=".EA.B0.9D.EC.B2.B4_.28Objects.29" name=".EA.B0.9D.EC.B2.B4_.28Objects.29">객체 (Objects)</h2> + +<p>JavaScript 객체는 간단히 이름-값 쌍(name-value pairs)의 모임입니다. 그렇기 때문에, JavaScript의 객체의 모임은 다음과 비슷하다고 할 수 있습니다:</p> + +<ul> + <li>Python의 Dictionaries</li> + <li>Perl 과 Ruby의 Hashes</li> + <li>C 와 C++ 의 Hash tables</li> + <li>Java 의 HashMaps</li> + <li>PHP의 Associative arrays</li> +</ul> + +<p>이 데이터 구조가 매우 광범위하게 사용된다는 사실은 활용 방도가 다양함을 입증합니다. JavaScript내 모든 것 (코어 타입들은 제외)은 객체로 취급되기 때문에 어떤 JavaScript 프로그램도 기본적으로 해쉬 테이블을 검색하는데 필요한 출중한 성능을 가지고 있습니다. 매우 빠르기 때문에 장점이 됩니다!</p> + +<p>값은 객체를 포함하여 아무 JavaScript 값이 될 수 있는 반면, "이름" 부분은 JavaScript 문자열 입니다. 이는 무작위적인 복잡성을 가지는 데이터 구조를 만들 수 있도록 해줍니다.</p> + +<p>빈 객체를 생성하는데 두가지 방법이 있습니다:</p> + +<pre class="brush: js notranslate">var obj = new Object(); +</pre> + +<p>와:</p> + +<pre class="brush: js notranslate">var obj = {}; +</pre> + +<p>이들은 의미적으로 동치입니다. 두번째 방법은 객체 리터럴 구문이라고 부르며 더 편리합니다. 객체 리터럴 구문은 JSON 구문의 핵심이며 이 방법을 사용한 코드를 더 많이 볼 수 있습니다.</p> + +<p>객체 리터럴 구문으로 객체의 전체적인 구조를 초기화 할 수 있습니다:</p> + +<pre class="brush: js notranslate">var obj = { + name: "Carrot", + "for": "Max", + details: { + color: "orange", + size: 12 + } +} +</pre> + +<p>속성에 연속적으로 접근할 수 있습니다:</p> + +<pre class="brush: js notranslate">obj.details.color; // orange +obj["details"]["size"]; // 12 +</pre> + +<p>아래 예제는 객체 프로토타입(<code>Person</code>)과 프로토타입의 인스턴스(<code>you</code>)를 생성합니다.</p> + +<pre class="brush: js notranslate">function Person(name, age) { + this.name = name; + this.age = age; +} + +// 객체를 정의한다 +var you = new Person('You', 24); +// "You"라는 이름의 24세인 새로운 사람을 생성중이다. +</pre> + +<p><strong>일단 생성되면</strong>, 객체의 속성에 다음의 두가지 방법들 중 한가지로 접근할 수 있습니다:</p> + +<pre class="brush: js notranslate">// dot 표기법 +obj.name = "Simon" +var name = obj.name; +</pre> + +<p>그리고...</p> + +<pre class="brush: js notranslate">// bracket 표기법 +obj["name"] = "Simon"; +var name = obj["name"]; +// key를 정의하기 위해 변수도 쓸수 있습니다. +var user = prompt('what is your key?') +obj[user] = prompt('what is its value?') +</pre> + +<p>이들은 의미적으로 역시 같습니다. 두번째 방법은 속성의 이름이 실행시간(run-time)에 계산될 수 있는 문자열로 주어집니다. 하지만 이방법을 사용하면 일부 JavaScript엔진과 압축기 최적화(minifier optimizations)를 적용할수 없습니다.또한 <a href="ko/Core_JavaScript_1.5_Reference/Reserved_Words">예약된 단어(키워드)</a>로 되어있는 이름으로 객체의 속성을 설정하거나 얻어낼 수 있습니다:</p> + +<pre class="brush: js notranslate">obj.for = "Simon"; // 구문 오류, for 가 예약된 단어(키워드)이기 때문에 +obj["for"] = "Simon"; // 정상 동작 +</pre> + +<div class="blockIndicator note"> +<p>ECMAScript 5 이래로, 예약어는 객체 항목의 이름으로 "덧붙임없이" 사용할수도 있습니다. 이말은 객체 리터럴을 정의할때 따옴표로 "둘러쌀" 필요가 없다는 의미입니다. ES5 <a href="http://es5.github.io/#x7.6.1">Spec</a>을 참고해 보십시오.</p> +</div> + +<p>객체나 프로토타입에 대한 좀더 상세한 내용은 <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype">Object.prototype</a> 을 참조하십시오. 객체 프로토타입과 객체 프로토타입 체인에 대한 설명은 <a href="/ko/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">상속과 프로토타입 체인</a> 을 참조하십시오.</p> + +<div class="blockIndicator note"> +<p>ECMAScript 2015 이래로, 객체의 key는 생성시의 대괄호 표기법(bracket notation)으로 정의될수 있습니다. 그냥 <code>var userPhone = {}; userPhone[phoneType] = 12345</code>. 처럼 표기하는 방법 대신 <code>{[phoneType]: 12345}</code> 와 같은 사용법도 가능합니다.</p> +</div> + +<h2 id=".EB.B0.B0.EC.97.B4_.28Arrays.29" name=".EB.B0.B0.EC.97.B4_.28Arrays.29">배열 (Arrays)</h2> + +<p>JavaScript에서 배열은 실제로는 특별한 타입의 객체입니다. (숫자로 나타낸 속성은 자연스럽게 [] 구문만을 사용해서 접근하게 되므로) 일반 객체와 많이 비슷하게 동작하지만, 이 객체는 '<code>length</code>'라는 한가지 마법적인 속성을 가집니다. 이는 항상 배열에서 가장 큰 인덱스보다 하나 더 큰 값으로 존재합니다.</p> + +<p>배열을 생성하는 예전 방법은 다음과 같습니다:</p> + +<pre class="brush: js notranslate">var a = new Array(); +a[0] = "dog"; +a[1] = "cat"; +a[2] = "hen"; +a.length // 3 +</pre> + +<p>한가지 더 편리한 배열 표현 방법은 배열 리터럴을 사용하는 것입니다:</p> + +<pre class="brush: js notranslate">> var a = ["dog", "cat", "hen"]; +> a.length +3 +</pre> + +<p>배열 리터럴 끝에 콤마(",")를 꼬리로 남겨두는 것은 브라우저마다 다르게 처리하므로 그렇게 하지는 마시기 바랍니다.</p> + +<p><code>array.length</code> 는 배열에 들어있는 항목의 수를 반드시 반영하지는 않는다는 점을 주의하시기 바랍니다. 다음과 같은 경우를 고려해보겠습니다:</p> + +<pre class="brush: js notranslate">> var a = ["dog", "cat", "hen"]; +> a[100] = "fox"; +> a.length +101 +</pre> + +<p>기억해두세요 - 배열의 length 속성은 최대 인덱스에 하나를 더한 값일 뿐입니다.</p> + +<p>존재하지 않는 배열 인덱스를 참조하려고하면 다음과 같이 <code>undefined</code> 을 얻게됩니다:</p> + +<pre class="brush: js notranslate">> typeof(a[90]) +undefined +</pre> + +<p><code>[]</code> 와 <code>length</code>에 관한 위의 사항들을 감안하면 배열을 <code>for</code> 반복문으로 처리할 때 다음과 같은 방법으로 처리하실 수 있을 것입니다:</p> + +<pre class="brush: js notranslate">for (var i = 0; i < a.length; i++) { + // a[i] 로 뭔가를 수행 +} +</pre> + +<p>ES2015는 배열과 같은 이터러블 객체를 위해 좀더 간결한 for...of 루프를 소개했습니다.</p> + +<pre class="brush: js notranslate">for (const currentValue of a) { + // currentValue 로 뭔가를 수행 +}</pre> + +<p>또한 for...in 루프를 이용하여 배열에 루프를 돌릴수도 있지만, 이 방법은 배열 요소를 반복하는게 아니라 배열 인덱스를 반복합니다. 뿐만 아니라, 누군가 <code>Array.prototype</code>에 새로운 속성을 추가하면, 그 속성들 또한 이런 루프로 반복됩니다. 따라서 이런 반복 형태는 배열에는 추천되지 않습니다.</p> + +<p>배열에 대한 또다른 반복방법은 ECMAScript 5에 추가된 <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach">forEach()</a> 입니다:</p> + +<pre class="brush: js notranslate">['dog', 'cat', 'hen'].forEach(function(currentValue, index, array) { + // currentValue나 array[index]로 뭔가를 수행 +} +</pre> + +<p>배열에 항목 하나를 추가하길 원한다면 이렇게 하면 됩니다:</p> + +<pre class="brush: js notranslate">a.push(item);</pre> + +<p>배열은 몇가지 메서드가 제공됩니다. <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Array">배열 메서드에 대한 전체 문서</a>를 참조하십시오.</p> + +<table> + <thead> + <tr> + <th scope="col">메서드 이름</th> + <th scope="col">설명</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>a.toString()</code></td> + <td>각 항목에 대한 <code>toString()</code>의 출력이 콤마로 구분된 한개의 문자열을 반환합니다.</td> + </tr> + <tr> + <td><code>a.toLocaleString()</code></td> + <td>각 항목에 대한 <code>toLocaleString()</code>의 출력이 콤마로 구분된 한개의 문자열을 반환합니다.</td> + </tr> + <tr> + <td><code>a.concat(item1[, item2[, ...[, itemN]]])</code></td> + <td>item들이 덧붙여진 한개의 배열을 반환합니다.</td> + </tr> + <tr> + <td><code>a.join(sep)</code></td> + <td>배열의 값들을 <code>sep</code> 인자로 구분하여 합친 한개의 문자열로 변환합니다.</td> + </tr> + <tr> + <td><code>a.pop()</code></td> + <td>배열의 마지막 항목을 반환하면서 제거합니다.</td> + </tr> + <tr> + <td><code>a.push(item1, ..., itemN)</code></td> + <td>배열의 끝에 item들을 덧붙입니다.</td> + </tr> + <tr> + <td><code>a.shift()</code></td> + <td>배열의 첫번째 항목을 반환하면서 제거합니다.</td> + </tr> + <tr> + <td><code>a.unshift(item1[, item2[, ...[, itemN]]])</code></td> + <td>배열의 앞쪽에 item들을 덧붙입니다.</td> + </tr> + <tr> + <td><code>a.slice(start[, end])</code></td> + <td>배열의 일부분을 새배열로 반환합니다.</td> + </tr> + <tr> + <td><code>a.sort([cmpfn])</code></td> + <td>옵션으로 비교용도의 함수를 입력받습니다.</td> + </tr> + <tr> + <td><code>a.splice(start, delcount[, item1[, ...[, itemN]]])</code></td> + <td>배열의 일부분을 제거하고 다른 항목으로 대체하여 배열을 변경합니다..</td> + </tr> + <tr> + <td><code>a.reverse()</code></td> + <td>배열의 순서를 거꾸로 배열합니다.</td> + </tr> + </tbody> +</table> + +<h2 id=".ED.95.A8.EC.88.98_.28Functions.29" name=".ED.95.A8.EC.88.98_.28Functions.29">함수 (Functions)</h2> + +<p>객체와 마찬가지로, 함수는 JavaScript를 이해하는데 핵심이 되는 컴포넌트입니다. 가장 기본적인 함수의 예는 다음과 같습니다:</p> + +<pre class="brush: js notranslate">function add(x, y) { + var total = x + y; + return total; +} +</pre> + +<p>이 예는 기본 함수에 대해 알아야 할 모든 것을 보여주고 있습니다. JavaScript 함수는 0 이상의 이름이 있는 매개변수를 가질 수 있습니다. 함수의 본체는 갯수 제한없이 구문을 포함할 수 있고 해당 함수에 지역적으로 변수를 보유하도록 선언할 수 있습니다. <code>return</code> 문은 언제나 값을 돌려주고 함수의 실행을 끝내는데 사용될 수 있습니다. 리턴 문이 없으면 (혹은 값이 없는 리턴이 사용되면), JavaScript는 <code>undefined</code>을 돌려줍니다.</p> + +<p>이름 붙여진 매개변수들은 다른 어떤 것보다도 해당 함수가 어떤 함수인지 설명해주는 좋은 역할을 할 수 있습니다. 해당 함수가 원하는 매개변수를 주지않고 함수를 호출할 수 있지만 그럴 경우 해당 변수들은 <code>undefined</code>로 설정됩니다.</p> + +<pre class="brush: js notranslate">add(); //NaN +// undefined에 대해 덧셈을 수행할 수 없습니다 +</pre> + +<p>함수가 기대하는 원래의 매개변수보다 많은 매개변수를 넘겨줄 수도 있습니다:</p> + +<pre class="brush: js notranslate">add(2, 3, 4); // 5 +// 처음의 두 수가 더해집니다. 4는 무시됨 +</pre> + +<p>이 예는 조금 어리석어 보이지만, 함수는 추가적으로 주어진 매개변수를 함수 내부에서 접근할수 있습니다. 이 객체는 <a href="ko/Core_JavaScript_1.5_Reference/Functions/arguments"><code>arguments</code></a>라고 하며, 해당 함수에 매개변수로 넘겨진 모든 값을 가지고 있는 배열과 비슷한 객체입니다. 우리가 원하는만큼 값을 취하는 add 함수를 다시 써보겠습니다:</p> + +<pre class="brush: js notranslate">function add() { + var sum = 0; + for (var i = 0, j = arguments.length; i < j; i++) { + sum += arguments[i]; + } + return sum; +} + +add(2, 3, 4, 5); // 14 +</pre> + +<p>확실히 <code>2 + 3 + 4 + 5</code>를 직접쓰는 것보다 유용한 함수는아닙니다. 평균계산 함수를 만들어 보겠습니다:</p> + +<pre class="brush: js notranslate">function avg() { + var sum = 0; + for (var i = 0, j = arguments.length; i < j; i++) { + sum += arguments[i]; + } + return sum / arguments.length; +} + +avg(2, 3, 4, 5); // 3.5 +</pre> + +<p>이건 매우 유용합니다만, 좀 번잡해보입니다. 코드 크기를 다소 줄이기 위해, arguments 배열의 사용을 <a href="/ko/docs/Web/JavaScript/Reference/Functions/rest_parameters">Rest 파라미터 문법</a>으로 대체해볼 필요가 있습니다. 이 방법으로, 코드 크기는 최소한으로 유지 하면서, 갯수 제한없이 함수로 인자를 전달할수 있습니다. <strong>Rest 파라미터 연산자</strong>는 다음과 같은 포맷(<strong>...variable</strong>)으로 함수 파라미터 목록에 사용됩니다. 이 varaible 인자는 함수가 호출될때 전달되는 모든 인자를 포함합니다. variable 인자에서 반환되는 값을 사용하기 위해 위 코드에서 <strong>for</strong> 루프를 <strong>for..of</strong> 루프로 변경합니다.</p> + +<pre class="brush: js notranslate">function avg(...args) { + var sum = 0; + for (let value of args) { + sum += value; + } + return sum / arr.length; +} + +avg(2, 3, 4, 5); // 3.5 +</pre> + +<div class="blockIndicator note"> +<p>위 코드에서,변수 <strong>args</strong> 는 함수로 전달된 모든 값을 가지고 있습니다.<br> + <br> + rest 파라미터 연산자가 함수 선언의 어느곳에 위치하든 선언 위치<em> 이후</em>에 모든 인자를 저장하는것이며, 이전이 아니라는 것이 중요합니다. 즉 ,<em> function</em> <em>avg(</em><strong>firstValue, </strong><em>...args)</em><strong> </strong>에서 함수로 전달된 첫번째 값은 <strong>firstValue </strong>변수에 저장되며, 남은 변수들은 <strong>args</strong>에 저장됩니다.</p> +</div> + +<p>이건 또다른 유용한 언어 특성입니다만 우리를 새로운 문제점으로 인도합니다. <code>avg()</code> 함수는 콤마로 구분된 인자목록을 받지만, 배열의 평균을 알고싶은 경우라면요? 함수를 다음과 같이 재작성 하면 됩니다 :</p> + +<pre class="notranslate">function avgArray(arr) { + var sum = 0; + for (var i = 0, j = arr.length; i < j; i++) { + sum += arr[i]; + } + return sum / arr.length; +} + +avgArray([2, 3, 4, 5]); // 3.5</pre> + +<p>하지만 우리가 이미 만든 함수를 다시 사용할 수 있다면 좋을 것입니다. 운이 좋게도 JavaScript는 함수 객체라면 모두 가지게 되는 <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Function/apply"><code>apply()</code></a> 메소드를 사용해서 임의의 매개변수 배열을 함수에 넘겨줄 수 있습니다.</p> + +<pre class="brush: js notranslate">> avg.apply(null, [2, 3, 4, 5]) +3.5 +</pre> + +<p><code>apply()의 </code>두번째 매개변수는 '매개변수들'로 사용하고자 하는 배열입니다. 첫번째 매개변수는 나중에 설명하도록 하겠습니다. 이는 함수가 역시 객체임을 명확히 해주는 사실입니다.</p> + +<div class="blockIndicator note"> +<p>함수 호출시 <a href="/ko/docs/Web/JavaScript/Reference/Operators/Spread_operator">전개 연산자(spread operator)</a> 를 이용하여 똑같은 결과를 얻을수 있습니다.</p> + +<p>예를 들면: <code>avg(...numbers)</code></p> +</div> + +<p>JavaScript는 익명의 함수를 만들 수 있도록 허용하고 있습니다.</p> + +<pre class="brush: js notranslate">var avg = function() { + var sum = 0; + for (var i = 0, j = arguments.length; i < j; i++) { + sum += arguments[i]; + } + return sum / arguments.length; +} +</pre> + +<p>이것은 의미적으로 <code>function avg()</code> 형식과 같습니다. 이 특징은 매우 강력한데, 일반적인 표현식(expression)을 사용할 수있는 어디에서나 완전한 함수 정의를 넣을 수 있도록 허용하는 것이기 때문입니다. 이 특징은 다양한 요령을 부릴 수 있게합니다. 다음 예는 C에서 블록 유효 범위를 적용 시킨 것 처럼 지역 변수를 "숨기는" 요령을 보여줍니다:</p> + +<pre class="brush: js notranslate">var a = 1; +var b = 2; + +(function() { + var b = 3; + a += b; +})(); + +a; // 4 +b; // 2 +</pre> + +<p>JavaScript는 재귀적으로 함수를 부를 수 있습니다. 이는 브라우저 DOM 등에서 볼수 있는 트리 구조를 다루는데 유용합니다.</p> + +<pre class="brush: js notranslate">function countChars(elm) { + if (elm.nodeType == 3) { // TEXT_NODE + return elm.nodeValue.length; + } + var count = 0; + for (var i = 0, child; child = elm.childNodes[i]; i++) { + count += countChars(child); + } + return count; +} +</pre> + +<p>다음의 예는 익명 함수를 사용함에 있어 잠재적인 문제점을 보여줍니다: 이름이 없으면 어떻게 재귀적으로 부를 수 있을까요? JavaScript는 함수 표현식을 이렇게 이름붙이도록 지원합니다. 이름붙은 IIFEs (Immediately Invoked Function Expressions: 즉시 실행 함수 표현) 를 다음과 같이 사용할 수 있습니다:</p> + +<pre class="brush: js notranslate">var charsInBody = (function counter(elm) { + if (elm.nodeType == 3) { // TEXT_NODE + return elm.nodeValue.length; + } + var count = 0; + for (var i = 0, child; child = elm.childNodes[i]; i++) { + count += counter(child); + } + return count; +})(document.body); +</pre> + +<p>위와 같이 함수 표현식에 제공된 이름은 함수 자체 범위에서만 유효합니다. 이 특징은 엔진에 의한 최적화뿐만 아니라 코드 가독성을 높이는데 도움을 줍니다. 이 이름은 디버거와 스택 추적에서도 나타나므로 디버깅시간을 줄일수 있게합니다.</p> + +<p>JavaScript 함수는 - JavsScript 내의 다른 모든 것들과 마찬가지로 - 그 자체가 객체이며, 객체 섹션에서 이미 확인한 것처럼, 속성을 추가하거나 변경할수 있다는 점을 명심하십시오</p> + +<h2 id=".EC.82.AC.EC.9A.A9.EC.9E.90_.EC.A0.95.EC.9D.98_.EA.B0.9D.EC.B2.B4" name=".EC.82.AC.EC.9A.A9.EC.9E.90_.EC.A0.95.EC.9D.98_.EA.B0.9D.EC.B2.B4">사용자 정의 객체</h2> + +<div class="blockIndicator note"> +<p>JavaScript에서 객체 지향 프로그래밍에 대한 더 자세한 논의는 <a href="/ko/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">객체 지향 JavaScript 소개</a>를 참조하십시오.</p> +</div> + +<p>고전 객체지향 프로그래밍에서 객체는 데이터와 해당 데이터들을 다루는 메소드의 집합이었습니다. JavaScript는 프로토타입 기반 언어로, C++ 이나 Java에서 발견할 수 있는 class 구문이 없습니다(이런 이유로 class 구문에 익숙한 프로그래머들이 때때로 혼란을 경험합니다). 그 대신, JavaScrip는 function을 class로 사용합니다. 이름과 성을 필드로 가지고 있는 'person' 객체를 고려해보도록 합시다. 이름을 표시하는 두가지 방법이 있을 수 있습니다. 예를 들어, "이름 성" 또는 "성, 이름" 이런 식으로 말이죠. 이전에 다룬 함수와 객체를 사용해서 이를 표현하면 다음과 같습니다:</p> + +<pre class="brush: js notranslate">function makePerson(first, last) { + return { + first: first, + last: last + } +} +function personFullName(person) { + return person.first + ' ' + person.last; +} +function personFullNameReversed(person) { + return person.last + ', ' + person.first +} + +var s = makePerson("Simon", "Willison"); +personFullName(s); // "Simon Willison" +personFullNameReversed(s); // "Willison, Simon" +</pre> + +<p>이렇게 하면 작동하긴 하지만, 보기 안좋습니다. 이런 방법이라면 전역 이름공간(global namespace)에 관련 함수가 너무 많아집니다. 정말 우리에게 필요한 것은 객체에 함수를 붙여놓는 것입니다. 함수는 객체이기 때문에 이건 별로 어렵지 않습니다.</p> + +<pre class="brush: js notranslate">function makePerson(first, last) { + return { + first: first, + last: last, + fullName: function() { + return this.first + ' ' + this.last; + }, + fullNameReversed: function() { + return this.last + ', ' + this.first; + } + }; +} + +var s = makePerson('Simon', 'Willison'); +s.fullName(); // "Simon Willison" +s.fullNameReversed(); // "Willison, Simon" +</pre> + +<p><code><a href="ko/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator">this</a></code> 키워드에 주목해 주십시오. 함수 안쪽에서 사용되면서, <code>this</code>는 현재 객체를 참조합니다. 그것이 실제로 의미하는 바는 당신이 부른 바로 그 함수를 지정하는 것입니다. 객체에서 <a href="ko/Core_JavaScript_1.5_Reference/Operators/Member_Operators">dot 표기법이나 bracket 표기법</a>을 사용해서 부른 경우, 해당 객체는 <code>this</code>가 됩니다. 해당 호출에서 dot 표기법을 사용하지 않은 경우, <code>this</code>는 전역 객체를 참조하게 됩니다.</p> + +<p><code>this</code>가 실수의 잦은 원인이 된다는 것을 명심하십시오 . 예를 들면:</p> + +<pre class="brush: js notranslate">var s = makePerson('Simon', 'Willison'); +var fullName = s.fullName; +fullName(); // undefined undefined +</pre> + +<p><code>s.fullName()</code>을 이용하지 않고 <code>fullName()</code>을 단독으로 호출하면, '<code>this</code>'는 전역 객체로 묶이게(bind) 됩니다. <code>first</code> 또는 <code>last</code> 로 명명된 전역 변수가 없기 때문에, 각각에 대해 <code>undefined</code> 결과를 얻게됩니다.</p> + +<p><code>makePerson</code> 함수를 개선하는데 '<code>this</code>' 키워드의 이점을 취할 수 있습니다:</p> + +<pre class="brush: js notranslate">function Person(first, last) { + this.first = first; + this.last = last; + this.fullName = function() { + return this.first + ' ' + this.last; + }; + this.fullNameReversed = function() { + return this.last + ', ' + this.first; + }; +} +var s = new Person('Simon', 'Willison'); +</pre> + +<p>여기서 <code><a href="ko/Core_JavaScript_1.5_Reference/Operators/Special_Operators/new_Operator">new</a></code>라는 또다른 키워드를 도입했습니다. <code>new</code>는 <code>this</code>와 깊게 연관되어 있습니다. 새로운 빈 객체를 만든 다음 지정된 함수를 불러 새로운 객체를 <code>this</code> 에 설정합니다. <code>this</code>로 지정된 함수는 값을 반환하지 않고 단지 <code>this</code> 객체를 수정한다는 것을 명심하세요. <code>this</code> 객체를 호출하는 곳으로 반환하는 것은 <code>new</code> 입니다. '<code>new</code>' 에 의해 호출되도록 설계된 함수는 컨스트럭터 함수라고 불립니다. 일반적으로 이러한 함수의 첫자를 대문자로 써서 <code>new</code>로 불릴 컨스트럭터 함수임을 나타냅니다.</p> + +<p>개선된 함수는 여전히 <code>fullName()</code> 을 단독으로 호출할 때의 함정이 존재합니다.</p> + +<p>우리의 person 객체가 점점 개선되고 있지만, 아직 좀 보기 안좋은 면이 있습니다. 매번 person 계열의 객체를 만들 때마다 내부에서 2개의 새로운 함수 객체를 만들고 있습니다. 이 코드가 객체간에 공유된다면 더 낫지 않을까요?</p> + +<pre class="brush: js notranslate">function personFullName() { + return this.first + ' ' + this.last; +} +function personFullNameReversed() { + return this.last + ', ' + this.first; +} +function Person(first, last) { + this.first = first; + this.last = last; + this.fullName = personFullName; + this.fullNameReversed = personFullNameReversed; +} +</pre> + +<p>더 좋아 보이네요: 메소드 함수를 한번만 만들고, 컨스트럭터 내에 해당 메소드들을 참조하도록 할당합니다. 이보다 더 개선 할 수 있을까요? 네, 그렇게 할 수 있습니다:</p> + +<pre class="brush: js notranslate">function Person(first, last) { + this.first = first; + this.last = last; +} +Person.prototype.fullName = function() { + return this.first + ' ' + this.last; +}; +Person.prototype.fullNameReversed = function() { + return this.last + ', ' + this.first; +}; +</pre> + +<p><code>Person.prototype</code>은 모든 <code>Person</code> 인스턴스들간에 공유되는 객체입니다. 이는 lookup(찾아보기) 체인의 한 부분을 이룹니다. (이건 "prototype chain"이라는 특수한 이름을 따로 가지고 있습니다) 다시 말해, <code>Person</code> 객체의 설정되지 않은 속성에 접근을 시도할 때마다, 그것의 대체용도로 JavaScript는 <code>Person.prototype</code>에 그 속성이 존재하는지 살펴봅니다.그 결과, <code>Person.prototype</code>에 할당된 모든 것은 <code>this</code> 객체를 통해 해당 컨스트럭터에 속한 모든 인스턴스들간에 사용 가능하게 됩니다.</p> + +<p>이것은 정말 강력한 도구입니다. JavaScript에서는 임의의 prototype을 프로그램 내에서 언제든 변형할 수 있습니다. 이미 존재하는 객체에 추가적인 메소드를 실시간으로 추가가할 수 있다는 이야기입니다:</p> + +<pre class="brush: js notranslate">var s = new Person("Simon", "Willison"); +s.firstNameCaps(); //TypeError on line 1: s.firstNameCaps is not a function + +Person.prototype.firstNameCaps = function() { + return this.first.toUpperCase() +}; +s.firstNameCaps(); // "SIMON" +</pre> + +<p>흥미롭게도, JavaScript의 빌트인 객체의 prototype에도 뭔가를 더 추가할 수 있습니다. <code>String</code> 객체에 문자열 순서를 거꾸로 배열하여 돌려주는 메소드를 추가해 봅시다.</p> + +<pre class="brush: js notranslate">var s = "Simon"; +s.reversed(); // TypeError on line 1: s.reversed is not a function + +String.prototype.reversed = function() { + var r = ""; + for (var i = this.length - 1; i >= 0; i--) { + r += this[i]; + } + return r; +}; + +s.reversed(); // nomiS +</pre> + +<p>우리가 추가한 새로운 메소드는 심지어 문자열 상수에서도 동작합니다!</p> + +<pre class="brush: js notranslate">"This can now be reversed".reversed(); // desrever eb won nac sihT +</pre> + +<p>기존에 언급한 바와같이, prototype은 체인의 한 부분을 이룹니다. 해당 체인의 루트는 <code>Object.prototype</code> 이며 <code>toString()</code> 메소드를 포함합니다. 이 메소드는 객체를 문자열로 나타내려할 때 호출됩니다. 이 메소드는 우리의 <code>Person</code> 객체의 디버깅에 유용합니다:</p> + +<pre class="brush: js notranslate">var s = new Person("Simon", "Willison"); +s.toString(); // [object Object] + +Person.prototype.toString = function() { + return '<Person: ' + this.fullName() + '>'; +} + +s.toString(); // "<Person: Simon Willison>" +</pre> + +<p><code>avg.apply()</code>의 첫번째 매개변수가 null 이었던걸 기억해봅시다. <code>apply()</code>에 적용되는 첫번째 인자는 당연히 `<code>this</code>'로 간주되는 객체입니다. 여기에 <code>new</code> 의 간단한 구현을 보시죠:</p> + +<pre class="brush: js notranslate">function trivialNew(constructor, ...args) { + var o = {}; // 빈 객체를 생성 + constructor.apply(o, args); + return o; +} +</pre> + +<p>이것은 prototype 체인을 설정하지 않으므로 <code>new</code>의 완벽한 대체물이 될 수 없습니다.(이 부분은 설명하기 어렵습니다). 이 내용은 자주 사용하지는 않겠지만 알아두면 좋습니다. 이 부분에서 <code>...args</code> (생략 부호를 포함해서)는 "<a href="/ko/docs/Web/JavaScript/Reference/Functions/rest_parameters">rest arguments</a>" 라고 불립니다. 이름이 암시하는 것처럼 매개변수의 나머지를 포함합니다.</p> + +<p>그러므로 이렇게 호출하는 것은</p> + +<pre class="notranslate">var bill = trivialNew(Person, 'William', 'Orange');</pre> + +<p>아래와 거의 동일합니다.</p> + +<pre class="notranslate">var bill = new Person('William', 'Orange');</pre> + +<p><code>apply()</code> 와 비슷하게 <code>this</code>를 다시 설정할 수 있게 하는, <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/call"><code>call</code></a>이라는 이름의 자매 함수가 있는데, 인자로 단일 배열이 아니라 확장된 인자 목록을 입력받습니다.</p> + +<pre class="brush: js notranslate">function lastNameCaps() { + return this.last.toUpperCase(); +} +var s = new Person('Simon', 'Willison'); +lastNameCaps.call(s); +// 위의 구문은 다음과 같습니다: +s.lastNameCaps = lastNameCaps; +s.lastNameCaps(); +</pre> + +<h3 id=".EB.82.B4.EC.9E.A5_.ED.95.A8.EC.88.98" name=".EB.82.B4.EC.9E.A5_.ED.95.A8.EC.88.98">내장 함수 (Inner functions)</h3> + +<p>다른 함수의 내부에서 JavaScript 함수를 선언할 수 있습니다. 우리는 <code>makePerson()</code> 함수 초기 버전에서 이것을 한번 본적이 있습니다. JavaScript에서 중첩 함수(nested functions)의 중요한 세부사항은 부모 함수 범위의 변수에 접근할 수 있다는 사실입니다:</p> + +<pre class="brush: js notranslate">function parentFunc() { + var a = 1; + + function nestedFunc() { + var b = 4; // parentFunc은 사용할 수 없는 변수 + return a + b; + } + return nestedFunc(); // 5 +} +</pre> + +<p>좀 더 유지관리가 쉬운 코드를 작성하고자 할때 이 특성이 굉장히 유용합니다. 한개 혹은 두개의 정도의 함수에서만 호출되며 전체 코드중 다른 부분에서는 사용처가 없는 함수라면 그 함수내에 해당 함수를 중첩시키는 것이 좋습니다. 이렇게 전역 범위 함수의 갯수를 늘리지 않도록 하는 것은 언제나 좋은 습관입니다.</p> + +<p>이것은 또한 전역 변수에 대한 유혹을 뿌리칠 수 있는 좋은 대안이 됩니다. 복잡한 코드를 쓸 때, 다양한 함수들간에 값을 공유할 수 있도록 전역 변수를 사용하고 싶어집니다 - 전역 변수는 코드 유지 보수를 어렵게 만듭니다. 중첩 함수는 그 부모 함수의 범위에서 변수를 공유할 수 있으므로, 이 방법을 사용하면 전역 변수 이름공간을 건드리지 않고도 적절한 경우에 함수들을 연동시킬수 있습니다. - '지역 전역'이라고 불러도 괜찮겠네요. 이 기술을 사용할 때는 주의를 요하겠지만, 반드시 알아둬야할 유용한 기술입니다.</p> + +<h2 id=".ED.8F.90.ED.8F.AC_.28Closures.29" name=".ED.8F.90.ED.8F.AC_.28Closures.29">클로져 (Closures)</h2> + +<p>클로져 (역자주: 글자 그대로 한국어로 해석하면 닫힌 주머니)는 JavaScript가 제공해야만 하는 가장 막강한 추상 개념으로 우리를 이끕니다 - 하지만 동시에 잠재적으로 가장 혼란스럽기도 합니다. 다음 함수는 무엇을 하는 걸까요?</p> + +<pre class="brush: js notranslate">function makeAdder(a) { + return function(b) { + return a + b; + }; +} +var add5 = makeAdder(5); +var add20 = makeAdder(20); +add5(6); // ? +add20(7); // ? +</pre> + +<p><code>makeAdder</code> 함수의 이름은 다음과 같은 과정을 거쳐 반드시 없어집니다: 해당 함수가 한 매개변수를 받아 호출됐을 때, 생성될 때 주어진 매개변수를 더하는 새 'adder' 함수를 생성합니다.</p> + +<p>여기서 일어나는 일은 다른 함수의 내에 정의된 어떤 함수가 외부 함수의 변수에 액세스한다는 점에서 앞에 언급한 내장 함수에서 일어나는 일과 매우 비슷합니다. 한가지 다른 점은 외부 함수가 리턴 된다는 점인데, 상식적으로 그것에 들어 있는 변수는 사라진다고 볼 수 있습니다. 하지만 그들은 여전히<em>존재합니다</em> - 그렇지 않으면 adder 함수는 동작하지 않겠지요. 게다가, <code>makeAdder</code> 지역 변수의 서로 다른 두 "복사본"이 존재합니다 - 하나의 <code>a</code>는 5이고, 다른 하나의 <code>a</code>는 20이죠. 따라서 해당 함수를 부른 결과는 다음과 같습니다:</p> + +<pre class="brush: js notranslate">x(6) // 11을 돌려줌 +y(7) // 27을 돌려줌 +</pre> + +<p>이건 실제로 일어나는 일입니다. JavaScript 함수가 실행될 때는 언제나, '범위' 객체가 생성되어 해당 함수내에서 생성된 지역 변수를 여기에 저장하고 있습니다. 함수 매개변수로서 넘겨진 어떤 변수라도 여기에 초기값으로 저장하고 있습니다. 이것은 모든 전역 변수와 함수가 들어있는 전역 객체와 비슷하지만, 두가지 중요한 차이점이 있습니다. 첫번째로, 함수가 실행될 때마다 새로운 범위 객체가 생성된다는 점과, 두번째로, (브라우저에서 window로 접근가능한) 전역 객체와 달리 범위 객체는 JavaScript 코드에서 직접적으로 액세스할 수 없다는 점입니다. 예를 들자면 현재 범위 객체의 속성에 반복 접근할 수 있는 수단이 없습니다.</p> + +<p>따라서 <code>makeAdder</code> 가 호출되면, 범위 객체는 <code>makeAdder</code> 함수에 매개변수로 넘겨진 하나의 속성 <code>a</code>를 가진 상태로 생성됩니다. 일반적으로 JavaScript의 가비지 컬렉터가 이때 <code>makeAdder</code>에 의해 생성된 범위 객체를 청소해야겠지만, 리턴된 함수가 여전히 범위 객체를 참조하고 있습니다. 결과적으로 범위 객체는 <code>makeAdder</code>에 의해 리턴된 함수 객체가 더는 참조되지 않을 때까지 가비지 컬렉터에 의해 정리되지 않게됩니다.</p> + +<p>범위 객체는 JavaScript 객체 체계에서 사용되는 prototype 사슬과 비슷한 범위 사슬이라고 불리는 사슬을 형성합니다.</p> + +<p>클로져는 함수와 함수에 의해 생성되는 범위 객체를 함께 지칭하는 용어입니다.</p> + +<p>또한 클로져는 상태를 저장할 수 있도록 허용합니다 - 그렇기 때문에, 객체의 내부에서 자주 사용될 수 있는 것입니다.</p> + +<h3 id=".EB.A9.94.EB.AA.A8.EB.A6.AC_.EB.88.84.EC.B6.9C" name=".EB.A9.94.EB.AA.A8.EB.A6.AC_.EB.88.84.EC.B6.9C">메모리 누출</h3> + +<p>클로져의 부작용은 Internet Explorer에서 심각하지는 않지만 쉽게 메모리 누출이 된다는 것입니다. JavaScript는 가비지 컬렉트를 하는 언어 입니다. 객체가 생성됨에 따라서 메모리가 할당되고, 사용하고난 메모리는 더 참조하는 다른 객체가 없을 때 되돌아가는 방식으로 동작하는 언어란 말이죠. 호스트 환경에서 제공되는 객체들은 해당 환경에 의해 다뤄집니다.</p> + +<p>브라우저 호스트는 HTML 페이지에 <a href="ko/DOM">DOM</a> 객체로서 표현되어있는 많은 수의 객체를 다뤄야 합니다. 이 객체들을 어떻게 할당하고 다시 거둬들일지는 브라우저 책임이죠.</p> + +<p>Internet Explorer는 이를 위해 자신만의 고유한, JavaScript의 그것과는 다른 가비지 컬렉션 방식을 사용합니다. 두 언어간에 상호작용이 일어날 수 있고 이 과정에서 메모리 누출이 발생할 수 있습니다.</p> + +<p>IE에서 메모리 누출은 JavaScript 객체와 고유 객체간에 참조하는 중 자기 자신을 참조 (circular reference, 순환 참조)하게 되는 일이 발생할 경우라면 언제든지 발생하게 됩니다. 다음을 고려해 보도록 합시다:</p> + +<pre class="brush: js notranslate">function leakMemory() { + var el = document.getElementById('el'); + var o = { 'el': el }; + el.o = o; +} +</pre> + +<p>위의 코드는 순환 참조로서 메모리 누출을 일으킵니다. IE는 완전히 다시 시작되기 전까지는 <code>el</code>와 <code>o</code>에 의해 사용되는 메모리를 반환하지 못합니다.</p> + +<p>위의 경우는 알아채지 못하고 지나갈 확률이 높습니다. 메모리 누출은 사실 오랫동안 실행되거나 큰 데이터 구조나 반복, 순환에 의해 누출된는 메모리 양이 많은 경우에서 실질적으로 고려할만한 가치가 생깁니다.</p> + +<p>누출이 이처럼 명확한 경우는 드뭅니다. 누출을 일으키는 데이터 구조는 수차례에 걸친 참조 구조를 가지고 있어서 순환 참조를 하고있는지 명확하지 않은 경우가 더 많습니다.</p> + +<p>클로져는 그렇게 되도록 하지않아도 간단하게 메모리 누출을 일으킬 수 있습니다. 다음을 고려해 봅시다:</p> + +<pre class="brush: js notranslate">function addHandler() { + var el = document.getElementById('el'); + el.onclick = function() { + this.style.backgroundColor = 'red'; + } +} +</pre> + +<p>위의 코드는 클릭했을때 배경색이 빨강으로 바뀌는 엘레멘트를 설정합니다. 그리고 메모리 누출도 일으킵니다. 어째서냐고요? <code>el</code>을 참조하면 의도와는 달리 익명 내부 함수 때문에 생성된 클로져 내에 붙잡혀 있게 되기 때문입니다. 이는 JavaScript 객체 (내부 함수)와 원시 객체 (<code>el</code>)간에 순환 참조를 만듭니다.</p> + +<p>이 문제를 피할 수 있는 많은 방법이 있습니다. 가장 간단한 건 이겁니다:</p> + +<pre class="brush: js notranslate">function addHandler() { + var el = document.getElementById('el'); + el.onclick = function() { + this.style.backgroundColor = 'red'; + } + el = null; +} +</pre> + +<p>이렇게 하면 순환 참조 고리를 끊을 수 있습니다.</p> + +<p>놀랍게도, 클로져에 의해 발생된 순환 참조를 고리를 끊기 위한 한 요령은 또다른 클로져를 추가하는 것입니다:</p> + +<pre class="brush: js notranslate">function addHandler() { + var clickHandler = function() { + this.style.backgroundColor = 'red'; + } + (function() { + var el = document.getElementById('el'); + el.onclick = clickHandler; + })(); +} +</pre> + +<p>내부 함수는 실행되고 바로 사라지므로서, <code>clickHandler</code>와 함께 생성된 클로져로부터 그 내용을 숨깁니다.</p> + +<p>클로져를 피할 수 있는 또다른 좋은 요령은 <code>window.onunload</code> 이벤트가 발생하는 동안 순환 참조를 끊는 것입니다. 많은 이벤트 라이브러리가 이렇게 동작합니다. 주의할 것은 그렇게 하도록하면 <a href="ko/Using_Firefox_1.5_caching">Firefox 1.5의 bfcache</a>를 비활성화 하게 되므로, 별 다른 이유가 없다면 Firefox에서 <code>unload</code> listener를 등록해서는 안 된다는 것입니다.</p> + +<div class="originaldocinfo"> +<h2 id=".EC.9B.90.EB.B3.B8_.EB.AC.B8.EC.84.9C_.EC.A0.95.EB.B3.B4" name=".EC.9B.90.EB.B3.B8_.EB.AC.B8.EC.84.9C_.EC.A0.95.EB.B3.B4">원본 문서 정보</h2> + +<ul> + <li>저자: <a class="external" href="http://simon.incutio.com/">Simon Willison</a></li> + <li>최근 갱신 날짜: March 7, 2006</li> + <li>저작권: © 2006 Simon Willison, contributed under the Creative Commons: Attribute-Sharealike 2.0 license.</li> + <li>추가 정보: For more information about this tutorial (and for links to the original talk's slides), see Simon's <a class="external" href="http://simon.incutio.com/archive/2006/03/07/etech">Etech weblog post</a>.</li> +</ul> +</div> + +<div class="noinclude"></div> + +<p>{{ languages( { "en": "en/A_re-introduction_to_JavaScript", "fr": "fr/Une_reintroduction_a_JavaScript", "it": "it/Una_re-introduzione_a_Javascript", "ja": "ja/A_re-introduction_to_JavaScript", "pl": "pl/JavaScript/Na_pocz?tek", "zh-cn": "cn/A_re-introduction_to_JavaScript" } ) }}</p> diff --git a/files/ko/web/javascript/about/index.html b/files/ko/web/javascript/about_javascript/index.html index c7ec0f9f28..c7ec0f9f28 100644 --- a/files/ko/web/javascript/about/index.html +++ b/files/ko/web/javascript/about_javascript/index.html diff --git a/files/ko/web/javascript/guide/closures/index.html b/files/ko/web/javascript/closures/index.html index b56d843b2b..b56d843b2b 100644 --- a/files/ko/web/javascript/guide/closures/index.html +++ b/files/ko/web/javascript/closures/index.html diff --git a/files/ko/web/javascript/differential_inheritance_in_javascript/index.html b/files/ko/web/javascript/differential_inheritance_in_javascript/index.html deleted file mode 100644 index 70fd4256c3..0000000000 --- a/files/ko/web/javascript/differential_inheritance_in_javascript/index.html +++ /dev/null @@ -1,63 +0,0 @@ ---- -title: Differential inheritance in JavaScript -slug: Web/JavaScript/Differential_inheritance_in_JavaScript -translation_of: Web/JavaScript/Differential_inheritance_in_JavaScript ---- -<h2 id="Introduction">Introduction</h2> - -<p>차등 상속(Differential Inheritance)은 자바 스크립트와 같은 프로토 타입 기반 프로그래밍 언어에서 사용되는 일반적인 상속 모델입니다. 대부분의 객체는 다른 일반적인 객체에서 파생되고 몇 가지 작은 측면에서만 차이가 있다는 원칙에 따라 동작합니다. 일반적으로 객체가 다른 다른 객체에 대한 포인터 목록을 내부적으로 유지합니다.</p> - -<h2 id="Example">Example</h2> - - - -<p>다음 코드는 개체를 "상속"하는 간단한 메서드 예제입니다.</p> - -<pre class="brush: js notranslate">Object.prototype.inherit = function(){ - // Create a new object with this as its prototype - var p = Object.create(this); - - /* actually not necessary: - // Apply the constructor on the new object - this.constructor.apply(p, arguments); - */ - - return p; -}; -</pre> - -<p>상속(<font face="Consolas, Liberation Mono, Courier, monospace">inherit)</font>을 사용하면 일반 프로토 타입에서보다 구체적인 개체를 간단히 파생시킬 수 있습니다. 다음은 상속 방법 및 차등 상속을 사용하여 점점 더 구체적인 객체를 구성하는 간단한 예입니다.</p> - -<pre class="brush: js notranslate">var root = {}; // Could be any object with any prototype object - -var record = root.inherit(); -record.toString = function(){ return "a Record"; }; - -var person = root.inherit(); -person.firstName = false; -person.lastName = false; -person.toString = function(){ - if (this.firstName) { - if (this.lastName) { - return this.firstName + " " + this.lastName; - } else { - return this.firstName; - } - } else if (this.lastName) { - return this.lastName; - } else { - return "a Person"; - } -}; - -JoePerson = person.inherit(); -JoePerson.firstName = "Joe"; -alert( JoePerson.toString() ); -</pre> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en/JavaScript/Reference/Global_Objects/Object/create" title="create">Object.create</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">inheritance and the prototype chain</a></li> -</ul> diff --git a/files/ko/web/javascript/guide/객체_모델의_세부사항/index.html b/files/ko/web/javascript/guide/details_of_the_object_model/index.html index 230d5cb9e1..230d5cb9e1 100644 --- a/files/ko/web/javascript/guide/객체_모델의_세부사항/index.html +++ b/files/ko/web/javascript/guide/details_of_the_object_model/index.html diff --git a/files/ko/web/javascript/guide/함수/index.html b/files/ko/web/javascript/guide/functions/index.html index cf9d928eb3..cf9d928eb3 100644 --- a/files/ko/web/javascript/guide/함수/index.html +++ b/files/ko/web/javascript/guide/functions/index.html diff --git a/files/ko/web/javascript/guide/values,_variables,_and_literals/index.html b/files/ko/web/javascript/guide/grammar_and_types/index.html index 629cbd069a..629cbd069a 100644 --- a/files/ko/web/javascript/guide/values,_variables,_and_literals/index.html +++ b/files/ko/web/javascript/guide/grammar_and_types/index.html diff --git a/files/ko/web/javascript/guide/소개/index.html b/files/ko/web/javascript/guide/introduction/index.html index cac0779ee0..cac0779ee0 100644 --- a/files/ko/web/javascript/guide/소개/index.html +++ b/files/ko/web/javascript/guide/introduction/index.html diff --git a/files/ko/web/javascript/guide/메타_프로그래밍/index.html b/files/ko/web/javascript/guide/meta_programming/index.html index fe4fa13f83..fe4fa13f83 100644 --- a/files/ko/web/javascript/guide/메타_프로그래밍/index.html +++ b/files/ko/web/javascript/guide/meta_programming/index.html diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/about/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/about/index.html deleted file mode 100644 index 05deb2017f..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/about/index.html +++ /dev/null @@ -1,109 +0,0 @@ ---- -title: About -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/About ---- -<h3 id=".EC.9D.B4.EB.B2.88_.EB.A6.B4.EB.A6.AC.EC.A6.88.EC.9D.98_.EC.83.88_.EA.B8.B0.EB.8A.A5" name=".EC.9D.B4.EB.B2.88_.EB.A6.B4.EB.A6.AC.EC.A6.88.EC.9D.98_.EC.83.88_.EA.B8.B0.EB.8A.A5"> 이번 릴리즈의 새 기능 </h3> -<p>JavaScript 버전 1.5는 다음과 같은 개선과 새 기능을 제공합니다: -</p><p><b>런타임 오류</b><br> -런타임 오류가 예외로서 보고됩니다. -</p><p><b>숫자 표현 서식 개선</b><br> -숫자를 표현하는 서식이 Number.prototype.toExponential, Number.prototype.toFixed, Number.prototype.toPrecision 메소드를 포함함으로서 개선되었습니다. <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Number_Object">Number 개체</a> 페이지를 보십시오. -</p><p><b>정규 표현식 개선</b><br> -정규표현식이 다음과 같이 개선되었습니다: -</p> -<ul><li> 한정자 — +, *, ?, {} — 뒤에 ?를 붙여서 greedy하지 않도록 할 수 있습니다. <a href="ko/Core_JavaScript_1.5_Guide/Writing_a_Regular_Expression_Pattern#Using_Special_Characters">정규 표현식 패턴 쓰기</a> 페이지에서 ?에 대한 항목을 보십시오. -</li><li> Non-capturing parentheses, (?:x) can be used instead of capturing parentheses(x). When non-capturing parentheses are used, matched subexpressions are not available as back-references. See the entry for (?:x) on page <a href="ko/Core_JavaScript_1.5_Guide/Writing_a_Regular_Expression_Pattern#Using_Special_Characters">Writing a Regular Expression Pattern</a>. -</li><li> Positive and negative lookahead assertions are supported. Both assert a match depending on what follows the string being matched. See the entries for x(?=y) and x(?!y) on page <a href="ko/Core_JavaScript_1.5_Guide/Writing_a_Regular_Expression_Pattern#Using_Special_Characters">Writing a Regular Expression Pattern</a>. -</li><li> The m flag has been added to specify that the regular expression should match over multiple lines. See the <a href="ko/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Executing_a_Global_Search%2c_Ignoring_Case%2c_and_Considering_Multiline_Input">Executing a Global Search, Ignoring Case, and Considering Multiline Input</a> page. -</li></ul> -<p><b>조건부 함수 선언</b><br> -함수를 if 조건안에서 선언할 수 있습니다. <a href="ko/Core_JavaScript_1.5_Guide/Defining_Functions">함수 정의</a> 페이지를 참고하세요. -</p><p><b>함수 표현식</b> <br> -함수를 표현식 안에서 선언할 수 있습니다. <a href="ko/Core_JavaScript_1.5_Guide/Defining_Functions">함수 정의</a> 페이지를 참고하세요. -</p><p><b>Multiple catch clauses</b><br> -Multiple catch clauses in a try...catch statement are supported. See <a href="ko/Core_JavaScript_1.5_Guide/Exception_Handling_Statements/try...catch_Statement#The_catch_Block">The catch Block</a> page. -</p><p><b>Getters와 Setters</b><br> -JavaScript writers can now add getters and setters to their objects. This feature is available only in the C implementation of JavaScript. See the <a href="ko/Core_JavaScript_1.5_Guide/Creating_New_Objects/Defining_Getters_and_Setters">Defining Getters and Setters</a> page. -</p><p><b>상수</b> <br> -읽기전용의 상수가 지원됩니다. This feature is available only in the C implementation of JavaScript. See the <a href="ko/Core_JavaScript_1.5_Guide/Constants">Constants</a> page. -</p> -<h3 id=".EB.AF.B8.EB.A6.AC_.EC.95.8C.EA.B3.A0_.EC.9E.88.EC.96.B4.EC.95.BC_.ED.95.A0_.EA.B2.83" name=".EB.AF.B8.EB.A6.AC_.EC.95.8C.EA.B3.A0_.EC.9E.88.EC.96.B4.EC.95.BC_.ED.95.A0_.EA.B2.83"> 미리 알고 있어야 할 것 </h3> -<p>이 안내서는 당신이 다음과 같은 배경지식을 지녔다고 가정합니다: -</p> -<ul><li> 인터넷과 World Wide Web (WWW)에 대한 상식적인 이해 -</li><li> HyperText Markup Language (HTML)에 대한 충분한 지식<br> -</li></ul> -<p>C 혹은 Visual Basic에 대한 프로그래밍 경험이 있으면 좋지만, 필수사항은 아닙니다. -</p> -<h3 id="JavaScript_.EB.B2.84.EC.A0.84" name="JavaScript_.EB.B2.84.EC.A0.84"> JavaScript 버전 </h3> -<table class="fullwidth-table"> -<tbody><tr> -<th>JavaScript 버전</th> -<th>Navigator 버전</th> -</tr> -<tr> -<td>JavaScript 1.0</td> -<td>Navigator 2.0</td> -</tr> -<tr> -<td>JavaScript 1.1</td> -<td>Navigator 3.0</td> -</tr> -<tr> -<td>JavaScript 1.2</td> -<td>Navigator 4.0-4.05</td> -</tr> -<tr> -<td>JavaScript 1.3</td> -<td>Navigator 4.06-4.7x</td> -</tr> -<tr> -<td>JavaScript 1.4</td> -<td> </td> -</tr> -<tr> -<td>JavaScript 1.5</td> -<td>Navigator 6.0<br>모질라 (오픈소스 브라우저)</td> -</tr> -</tbody></table> -<p><small><b>표1: JavaScript와 Navigator 버전</b></small><br> -<br> -Each version of the Netscape Enterprise Server also supports a different version of JavaScript. To help you write scripts that are compatible with multiple versions of the Enterprise Server, this manual uses an abbreviation to indicate the server version in which each feature was implemented. -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>Abbreviation</th> -<th>Enterprise Server version</th> -</tr> -<tr> -<td>NES 2.0</td> -<td>Netscape Enterprise Server 2.0</td> -</tr> -<tr> -<td>NES 3.0</td> -<td>Netscape Enterprise Server 3.0</td> -</tr> -</tbody></table> -<p><small><b>Table 2: Abbreviations of Netscape Enterprise Server versions</b></small> -</p> -<h3 id="JavaScript_.EC.A0.95.EB.B3.B4.EB.A5.BC_.EC.B0.BE.EC.9D.84_.EC.88.98_.EC.9E.88.EB.8A.94_.EA.B3.B3" name="JavaScript_.EC.A0.95.EB.B3.B4.EB.A5.BC_.EC.B0.BE.EC.9D.84_.EC.88.98_.EC.9E.88.EB.8A.94_.EA.B3.B3"> JavaScript 정보를 찾을 수 있는 곳 </h3> -<p>The core JavaScript documentation includes the following books: -</p> -<ul><li> <a href="ko/Core_JavaScript_1.5_Guide">The Core JavaScript Guide</a> (this guide) provides information about the core JavaScript language and its objects. -</li><li> <a href="ko/Core_JavaScript_1.5_Reference">The Core JavaScript Reference</a> provides reference material for the core JavaScript language. -</li></ul> -<p>If you are new to JavaScript, start with the <a href="ko/Core_JavaScript_1.5_Guide">Core JavaScript Guide</a>. Once you have a firm grasp of the fundamentals, you can use the <a href="ko/Core_JavaScript_1.5_Reference">Core JavaScript Reference</a> to get more details on individual objects and statements. -</p> -<h3 id=".EB.AC.B8.EC.84.9C_.EA.B7.9C.EC.95.BD" name=".EB.AC.B8.EC.84.9C_.EA.B7.9C.EC.95.BD"> 문서 규약 </h3> -<p>JavaScript 응용프로그램은 많은 운영체제에서 실행됩니다. 이 책에 있는 정보는 모든 운영체제에 적용됩니다. 파일과 디렉토리 경로는 Windows 형식(디렉토리 이름을 구분하는데 역슬래시를 사용)으로 썼습니다. Unix에서는 역슬래시를 슬래시로 바꾸어 사용하면 됩니다. -</p><p>이 안내서에서 URL은 다음과 같은 형태로 씁니다. -</p><p><code><span class="nowiki">http://server.domain/path/file.html</span></code> -</p><p>이 URL에서 "server"는 우리가 응용프로그램을 실행하는 서버 이름(research1이나 www 등)이고, "domain"은 인터넷 도메인 이름(netscape.com이나 uiuc.edu 등)입니다. "path"는 서버의 디렉토리 구조를 나타내고, "file.html"은 파일 이름입니다. 일반적으로 URL에서 이탤릭체로 쓴 부분은 알맞은 내용으로 바꿔써야 할 내용(placeholder)이고, 평범한 고정폭 글꼴은 그대로 쓰면 되는 내용입니다. Secure Socket Layer(SSL)을 사용하는 서버라면 http 대신 https를 쓰면 됩니다. -</p><p>이 안내서는 다음과 같은 관례를 따릅니다. -</p> -<ul><li> <code>고정폭 글꼴</code>은 샘플 코드, API, 언어 요소(메소드 이름, 속성 이름 등), 파일 이름, 경로, 디렉토리 이름, HTML 태그, 화면에 입력해야 할 텍스트를 나타내는 데 쓰입니다. (고정폭 이탤릭체는 코드 내용 중에서 적당히 알맞은 내용으로 바꿔써야 할 부분을 나타내는 데 씁니다.) -</li><li> <i>이탤릭체</i>는 책 제목, 강조, 변수, 뜻 그대로 쓰인 단어(words in the literal sense)에 씁니다. -</li><li> <b>굵은 글씨</b>는 용어에 씁니다. -</li></ul> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide", "Core_JavaScript_1.5_Guide:JavaScript_Overview") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/About", "fr": "fr/Guide_JavaScript_1.5/\u00c0_propos", "ja": "ja/Core_JavaScript_1.5_Guide/About", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/O" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/class-based_vs._prototype-based_languages/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/class-based_vs._prototype-based_languages/index.html deleted file mode 100644 index 20601a0e81..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/class-based_vs._prototype-based_languages/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Class-Based vs. Prototype-Based Languages -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages ---- -<h3 id=".E3.82.AF.E3.83.A9.E3.82.B9.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E.E3.81.A8.E3.83.97.E3.83.AD.E3.83.88.E3.82.BF.E3.82.A4.E3.83.97.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E" name=".E3.82.AF.E3.83.A9.E3.82.B9.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E.E3.81.A8.E3.83.97.E3.83.AD.E3.83.88.E3.82.BF.E3.82.A4.E3.83.97.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E">클래스 기반언어와 프로토타입 기반언어</h3> -<p>Java와 C++이라는 클래스 기반의 객체지향언어는 클래스와 인스턴스라는 2개의 다른 실체가 있다는 개념에 기초하고 있습니다.</p> -<ul> <li>클래스는 어떤 객체의 집합을 특징짓는 모든 속성(Java에서는 메소드와 필드를, C++에서는 멤버를 프로퍼티로 간주)을 정의합니다. 클래스란 그것이 나타내는 객체집합의 특정멤버가 아닌, 추상적인것입니다. 예를들어, Employee클래스는 모든 종업원의 집합을 나타냅니다.</li> <li>한편, 인스턴스는 클래스를 실례로 한것입니다. 즉, 그 멤버중 하나인것입니다. 예를들어, Victoria는 Employee클래스의 인스턴스가 될 수 있습니다. 이 클래스는 특정 개인을 종업원으로서 표현하고 있는것입니다. 인스턴스는 그 부모클래스의 속성을 정확하게 유지하고 있습니다.</li> -</ul> -<p>JavaScript のようなプロトタイプベース言語はこの区別がありません。単にオブジェクトがあるだけです。プロトタイプベース言語には原型的なオブジェクトという概念があります。このオブジェクトは新しいオブジェクトの初期プロパティを取得する元になるテンプレートとして使用されます。どのオブジェクトもそれ独自のプロパティを指定できます。オブジェクト作成時にも実行時にも可能です。さらに、どのオブジェクトも別のオブジェクトに対するプロトタイプとして関連付けることができます。2 つ目のオブジェクトが 1 つ目のオブジェクトのプロトタイプを共有するということもできます。</p> -<h4 id=".E3.82.AF.E3.83.A9.E3.82.B9.E3.81.AE.E5.AE.9A.E7.BE.A9" name=".E3.82.AF.E3.83.A9.E3.82.B9.E3.81.AE.E5.AE.9A.E7.BE.A9">クラスの定義</h4> -<p>クラスベース言語ではクラス定義ごとにクラスを定義します。定義では特殊なメソッドを指定してそのクラスのインスタンスを作成することができます。そのようなメソッドはコンストラクタと呼びます。コンストラクタメソッドはインスタンスのプロパティに対する初期値を指定することができます。また、作成時に他の適当な処理を実行することもできます。new 演算子をコンストラクタメソッドと一緒に用いることでクラスのインスタンスを作成できます。</p> -<p>JavaScript は同様のモデルに従っていますが、コンストラクタと別になっているクラス定義がありません。その代わりに、プロパティと値からなる特定の初期的なセットを持つオブジェクトを作成するコンストラクタ関数を定義します。どの JavaScript 関数もコンストラクタとして使用できます。new 演算子をコンストラクタ関数とともに使用することで新しいオブジェクトを作成します。</p> -<h4 id=".E3.82.B5.E3.83.96.E3.82.AF.E3.83.A9.E3.82.B9.E3.81.A8.E7.B6.99.E6.89.BF" name=".E3.82.B5.E3.83.96.E3.82.AF.E3.83.A9.E3.82.B9.E3.81.A8.E7.B6.99.E6.89.BF">サブクラスと継承</h4> -<p>クラスベース言語ではクラス定義を通じてクラスの階層を作ります。クラス定義では新しいクラスがある既存のクラスのサブクラスになるように指定することができます。サブクラスはスーパークラスの全プロパティを継承します。さらに新しくプロパティを追加したり継承したものを変更することもできます。例えば、Employee クラスが name および dept プロパティのみを含んでおり、Manager は reports プロパティを追加する Employee のサブクラスであるとします。この場合、Manager クラスのインスタンスは name、dept、reports という 3 つのプロパティをすべて持つことになります。</p> -<p>JavaScript では、原型的なオブジェクトをどのコンストラクタ関数にも結びつけることができるようにして継承を実装しています。そのため、全く同じような Employee と Manager の例を作成することができますが、使用する用語が若干異なります。まず、Employee コンストラクタ関数を定義します。これは name および dept プロパティを指定します。次に Manager コンストラクタ関数を定義します。これは reports プロパティを指定します。最後に新しい Employee オブジェクトを Manager コンストラクタ関数に対するプロトタイプとして代入します。そして新しい Manager を作成すると、このオブジェクトは Employee オブジェクトから name および dept プロパティを継承します。</p> -<h4 id=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E8.BF.BD.E5.8A.A0.E3.81.A8.E5.89.8A.E9.99.A4" name=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E8.BF.BD.E5.8A.A0.E3.81.A8.E5.89.8A.E9.99.A4">プロパティの追加と削除</h4> -<p>クラスベース言語では一般的にクラスをコンパイル時に生成し、コンパイル時または実行時にクラスのインスタンスを作成します。クラス定義後にそのクラスのプロパティの数や型を変更することはできません。しかし、JavaScript ではどんなオブジェクトでも実行時にプロパティを追加したり削除したりすることができます。あるオブジェクトのセットでプロトタイプとして使用されているオブジェクトにプロパティを追加すると、そのプロトタイプの使用元であるオブジェクトにも新しいプロパティが追加されます。</p> -<h4 id=".E9.81.95.E3.81.84.E3.81.AE.E6.A6.82.E8.A6.81" name=".E9.81.95.E3.81.84.E3.81.AE.E6.A6.82.E8.A6.81">違いの概要</h4> -<p>次の表でこれらの違いをいくつか短くまとめてみます。この章の残りで、JavaScript のコンストラクタとプロトタイプを用いてオブジェクト階層を作成することについての詳細を説明していきます。また、この方法が Java ではどう変わるかという比較もします。</p> -<table class="fullwidth-table"> <tbody> <tr> <th>クラスベース (Java)</th> <th>プロトタイプベース (JavaScript)</th> </tr> <tr> <td>クラスとインスタンスは異なる実体である。</td> <td>すべてのオブジェクトはインスタンスである。</td> </tr> <tr> <td>クラス定義を用いてクラスを定義する。また、コンストラクタメソッドを用いてクラスをインスタンス化する。</td> <td>コンストラクタ関数を用いてオブジェクトのセットを定義し、作成する。</td> </tr> <tr> <td><code>new</code> 演算子を用いて単一のオブジェクトを作成する。</td> <td>同じ。</td> </tr> <tr> <td>既存のクラスのサブクラスを定義するクラス定義を用いてオブジェクト階層を構築する。</td> <td>コンストラクタ関数に結びつけられたプロトタイプとしてオブジェクトを代入することでオブジェクト階層を構築する。</td> </tr> <tr> <td>クラスチェーンに従ってプロパティを継承する。</td> <td>プロトタイプチェーンに従ってプロパティを継承する。</td> </tr> <tr> <td>クラス定義がクラスの全インスタンスの全プロパティを指定する。実行時に動的にプロパティを追加することはできない。</td> <td>コンストラクタ関数またはプロトタイプがプロパティの初期セットを指定する。個々のオブジェクトやオブジェクトの全体のセットに動的にプロパティを追加したり、それらからプロパティを除去したりできる。</td> </tr> </tbody> -</table> -<div class="noinclude"> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Predefined_Core_Objects:String_Object", "Core_JavaScript_1.5_Guide:The_Employee_Example") }}</p> -</div> -<p>{{ languages( { "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/以類別為基礎的語言_vs._以原型為基礎的語言", "en": "en/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "es": "es/Gu\u00eda_JavaScript_1.5/Lenguajes_basados_en_clases_frente_a_basados_en_prototipos", "fr": "fr/Guide_JavaScript_1.5/Langages_bas\u00e9s_sur_les_classes_et_langages_bas\u00e9s_sur_les_prototypes", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/J\u0119zyki_oparte_na_klasach_vs._oparte_na_prototypach", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages" } ) }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/constants/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/constants/index.html deleted file mode 100644 index 7b5f5c577c..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/constants/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: Constants -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Constants -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Constants ---- -<h3 id=".EC.83.81.EC.88.98" name=".EC.83.81.EC.88.98"> 상수 </h3> -<p><code><a href="ko/Core_JavaScript_1.5_Reference/Statements/const">const</a></code> 키워드를 이용하면 읽기 전용의 이름 있는 상수를 만들 수 있습니다. 상수 식별자(const identifier)는 변수의 식별자와 동일합니다. 문자나 밑줄로 시작해야 하고, 알파벳, 숫자, 밑줄 문자를 사용할 수 있습니다. -</p> -<pre class="eval">const prefix = '212'; -</pre> -<p>상수는 스크립트 실행 중에 값을 대입하거나 다시 선언하여 값을 바꿀 수 없습니다. -</p><p>전역 상수인 경우에도 항상 <code>const</code> 키워드를 붙여야 한다는 점만 제외하면, 상수의 범위 규칙은 변수의 경우와 동일합니다. const 키워드가 없으면 변수라고 판정됩니다. -</p><p>같은 범위에 있는 함수나 변수의 이름과 같은 이름으로 상수를 만들 수 없습니다. 예를 들어, -</p> -<pre>//이 코드는 에러를 낼 것입니다 -function f() {}; - const f = 5; - -//이 코드 또한 에러를 냅니다. -function f() { - const g = 5; - var g; - - //그 외 코드... - -}</pre> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Variables", "Core_JavaScript_1.5_Guide:Literals") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Constants", "fr": "fr/Guide_JavaScript_1.5/Constantes", "ja": "ja/Core_JavaScript_1.5_Guide/Constants", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Sta\u0142e" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_a_regular_expression/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_a_regular_expression/index.html deleted file mode 100644 index d969b378f4..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_a_regular_expression/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: Creating a Regular Expression -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_a_Regular_Expression ---- -<h3 id=".EC.A0.95.EA.B7.9C.ED.91.9C.ED.98.84.EC.8B.9D_.EB.A7.8C.EB.93.A4.EA.B8.B0" name=".EC.A0.95.EA.B7.9C.ED.91.9C.ED.98.84.EC.8B.9D_.EB.A7.8C.EB.93.A4.EA.B8.B0">정규표현식 만들기</h3> -<p>정규표현식은 다음의 두 가지 방법으로 만들 수 있습니다.</p> -<ul> - <li>정규표현식 상수값을 이용하여 만들기</li> -</ul> -<pre> re = /ab+c/; </pre> -<dl> - <dd> - <dl> - <dd> - 정규표현식 상수값은 스크립트가 실행될 때 컴파일됩니다. 따라서 정규표현식의 값이 변하지 않을 경우, 이 방법을 사용하면 좀 더 나은 성능을 얻을 수 있습니다.</dd> - </dl> - </dd> -</dl> -<ul> - <li><a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/RegExp">RegExp</a> 객체의 생성자를 호출하여 만들기</li> -</ul> -<pre> re = new RegExp("ab+c"); </pre> -<dl> - <dd> - <dl> - <dd> - 생성자를 이용하면 실행 시간에 정규표현식이 컴파일됩니다. 정규표현식 패턴이 바뀔 것을 알고 있거나, 또는 패턴을 사용자의 입력 등을 통해 외부에서 가져오려고 할 때 이 방법을 사용하십시오.</dd> - </dl> - </dd> -</dl> -<div class="noinclude"> - <p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators:Special_Operators", "Core_JavaScript_1.5_Guide:Writing_a_Regular_Expression_Pattern") }}</p> -</div> -<p> </p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_getters_and_setters/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_getters_and_setters/index.html deleted file mode 100644 index 3238e19b0f..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_getters_and_setters/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: Defining Getters and Setters -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Defining_Getters_and_Setters ---- -<h3 id="getter.2Fsetter_.EC.A0.95.EC.9D.98.ED.95.98.EA.B8.B0" name="getter.2Fsetter_.EC.A0.95.EC.9D.98.ED.95.98.EA.B8.B0">getter/setter 정의하기</h3> - -<p>getter는 속성의 값을 얻어오는 메소드이고, setter는 속성의 값을 설정하는 메소드입니다. 우리는 언어에서 미리 정의한 핵심 개체들과 사용자 정의 개체에 getter/setter를 정의할 수 있습니다. getter와 setter를 정의할 때 쓰이는 문법은 개체 상수값 문법입니다.</p> - -<p>다음의 JS 쉘 세션은 사용자가 정의한 개체 o에 대해서 getter와 setter가 어떻게 동작하는지 보여줍니다. JS 쉘은 JavaScript를 한 번에 실행(batch)하거나 대화식으로(interactively) 실행할 수 있게 해주는 응용프로그램입니다.</p> - -<p><code>o</code> 개체에는 이런 속성이 있습니다.</p> - -<ul> - <li>o.a - 수</li> - <li>o.b - o.a 더하기 1을 반환하는 getter</li> - <li>o.c - 받은 값을 2로 나누어서 o.a에 설정하는 setter</li> -</ul> - -<pre>js> o = new Object; -[object Object] -js> o = {a:7, get b() {return this.a+1; }, set c(x) {this.a = x/2}}; -[object Object] -js> o.a -7 -js> o.b -8 -js> o.c = 50 -js> o.a -25 -js> -</pre> - -<p>다음 JavaScript 쉘 세션은 이미 정의된 <code>Date</code> 모든 인스턴스에 year 속성을 추가하기 위해서 getter/setter가 어떻게 Date 프로토타입을 확장하는지 보여줍니다. 이 세션에서는 year 속성의 getter와 setter를 지원하기 위해서 <code>Date</code>에 있는 <code>getFullYear</code> 메소드와 <code>setFullYear</code> 메소드를 사용하고 있습니다.</p> - -<p>이 문장들은 year 속성에 대한 getter와 setter를 정의합니다.</p> - -<pre>js> var d = Date.prototype; -js> d.__defineGetter__("year", function() { return this.getFullYear(); }); -js> d.__defineSetter__("year", function(y) { this.setFullYear(y); }); -</pre> - -<p>이 문장들은 <code>Date</code>의 getter/setter를 사용합니다.</p> - -<pre>js> var now = new Date; -js> print(now.year); -2000 -js> now.year=2001; -987617605170 -js> print(now); -Wed Apr 18 11:13:25 GMT-0700 (Pacific Daylight Time) 2001 -</pre> - -<div class="note">JavaScript 1.5를 개발하는 동안 이미 존재하는 개체에 getter/setter를 추가할 때 <code>getter =</code>, <code>setter =</code>이라는 식의 문법을 사용하던 때가 잠깐 있었습니다. 이 문법은 이제 사용하지 말아야 합니다. 현재의 JS 1.5 엔진에서는 경고를 발생시키고, 더 나중의 버전에서는 문법 에러를 발생시키게 될 것입니다.</div> - -<p> </p> - -<h3 id=".EC.9A.94.EC.95.BD" name=".EC.9A.94.EC.95.BD">요약</h3> - -<p>getter/setter를</p> - -<ul> - <li><a href="ko/Core_JavaScript_1.5_Guide/Creating_New_Objects/Using_Object_Initializers">개체 초기화 지정자</a>를 이용해서 정의하거나,</li> - <li>개체가 만들어진 이후에 getter/setter 추가 메소드를 이용해서 언제든지 추가할 수 있습니다.</li> -</ul> - -<p><a href="ko/Core_JavaScript_1.5_Guide/Creating_New_Objects/Using_Object_Initializers">개체 초기화 지정자</a>를 이용할 때는 단순히 getter 메소드 앞에는 <code>get</code>을 써주고 setter 메소드 앞에는 <code>set</code>을 써주기만 하면됩니다. 물론 getter 메소드에는 매개변수가 없어야 하고 setter에는 정확히 하나만 있어야 합니다. 다음 예제에서와 같이 말입니다.</p> - -<pre class="eval">o = { - a:7, - <strong>get</strong> b() { return this.a+1; }, - <strong>set</strong> c(x) { this.a = x/2; } -}; -</pre> - -<p>개체가 생성된 이후에 어느 때라도 <code>__defineGetter__</code>와 <code>__defineSetter__</code>라는 메소드를 이용하면 getter/setter를 정의할 수 있습니다. 두 메소드 모두 첫 번째 매개변수에 getter/setter 이름을 나타내는 문자열을 받습니다. 두 번째 매개변수는 getter/setter로서 호출될 함수를 받습니다. 예제를 보십시오.</p> - -<pre class="eval">o.__defineGetter__("b", function() { return this.a+1; }); -o.__defineSetter__("c", function(x) { this.a = x/2; }); -</pre> - -<p>두 가지 중에서 어떤 방식을 택할지는 프로그래밍 스타일이나 해야할 작업에 달려있습니다. 프로토타입을 정의하는데 이미 개체 초기화 지정자를 사용하고 있다면 거의 첫 번째 방식을 사용할 것입니다. 첫 번째가 좀 더 단순하고 자연스러운 방식입니다. 그러나 우리가 직접 프로토토입을 만들거나 개체를 생성할 수 없어서 나중에 getter/setter를 추가해야 하는 상황이라면 두 번째 방식을 사용할 수 밖에 없습니다. 두 번째 방식은 JavaScript의 동적인 특성을 잘 보여주는 방식입니다. 하지만 코드를 읽고 이해하기 어렵게 만들 수도 있습니다.</p> - -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Using_this_for_Object_References", "Core_JavaScript_1.5_Guide:Creating_New_Objects:Deleting_Properties") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_methods/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_methods/index.html deleted file mode 100644 index 8e91a2007f..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_methods/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: Defining Methods -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Defining_Methods ---- -<h3 id=".EB.A9.94.EC.86.8C.EB.93.9C_.EC.A0.95.EC.9D.98" name=".EB.A9.94.EC.86.8C.EB.93.9C_.EC.A0.95.EC.9D.98">메소드 정의</h3> -<p> - <i> - 메소드</i> - 는 개체와 연관되어 있는 함수입니다. 일반적인 함수를 정의하는 것과 같은 방법으로 메소드를 정의합니다. 그 후에, 존재하는 개체와 함수를 연관시키기 위해서 다음과 같은 문법을 사용합니다.</p> -<pre>object.methodname = function_name -</pre> -<p><code>object</code>는 존재하는 개체중에 하나이고, <code>methodname</code>은 지금 추가하려는 메소드 이름이며, <code>function_name</code>은 함수 이름입니다.</p> -<p>이제 우리는 개체의 메소드를 호출할 때 다음과 같이 할 수 있습니다.</p> -<pre>object.methodname(params); -</pre> -<p>개체 생성자 함수에 메소드 정의를 포함시켜서 개체 타입에 대한 메소드를 정의할 수 있습니다. 예를 들어, 미리 정의된 car 개체의 속성을 출력해주는 함수를 정의할 수 있습니다.</p> -<pre>function displayCar() { - var result = "A Beautiful " + this.year + " " + this.make - + " " + this.model; - pretty_print(result); -} -</pre> -<p><code>pretty_print</code>는 가로선과 문자열을 출력하는 함수입니다. 이 메소드가 포함된 개체를 참조하기 위해서 <code>this</code>를 사용하고 있다는 것을 주의해서 보십시오.</p> -<p>아래 문장을 개체 정의에 추가함으로써 이 함수를 car의 메소드로 만들 수 있습니다.</p> -<pre>this.displayCar = displayCar; -</pre> -<p>그러므로 <code>car</code> 개체의 완벽한 정의는 아래와 같은 모습이 될 것입니다.</p> -<pre>function car(make, model, year, owner) { - this.make = make; - this.model = model; - this.year = year; - this.owner = owner; - this.displayCar = displayCar; -} -</pre> -<p>그러면 우리는 모든 car 개체에 대해서 이런 식으로 <code>displayCar</code> 메소드를 호출할 수 있게됩니다.</p> -<pre>car1.displayCar() -car2.displayCar() -</pre> -<p>이 코드는 다음 그림과 같은 내용을 만들어냅니다.</p> -<p><img alt="Image:obja.gif"> <small><b>그림 7.1: 메소드 출력 결과</b></small></p> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Properties_for_an_Object_Type", "Core_JavaScript_1.5_Guide:Creating_New_Objects:Using_this_for_Object_References") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_properties_for_an_object_type/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_properties_for_an_object_type/index.html deleted file mode 100644 index 17c2aa7de8..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/defining_properties_for_an_object_type/index.html +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: Defining Properties for an Object Type -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Defining_Properties_for_an_Object_Type ---- -<h3 id=".EA.B0.9C.EC.B2.B4_.ED.98.95.EC.8B.9D.EC.97.90_.EC.86.8D.EC.84.B1_.EC.A0.95.EC.9D.98.ED.95.98.EA.B8.B0" name=".EA.B0.9C.EC.B2.B4_.ED.98.95.EC.8B.9D.EC.97.90_.EC.86.8D.EC.84.B1_.EC.A0.95.EC.9D.98.ED.95.98.EA.B8.B0">개체 형식에 속성 정의하기</h3> -<p><code>prototype</code> 속성을 이용하면 이미 정의해 놓은 개체 형식에 속성을 추가할 수 있습니다. 이 방법을 사용하면 개체의 인스턴스 하나에만 속성이 추가되는 것이 아니라 같은 타입의 모든 개체가 공유하는 속성을 정의합니다. 다음 코드는 <code>car</code> 형식의 모든 개체에 <code>color</code> 속성을 추가하고, <code>car1</code> 개체의 <code>color</code> 속성에 값을 할당하는 코드입니다.</p> -<pre>Car.prototype.color=null; -car1.color="black"; -</pre> -<p>더 많은 정보를 얻으려면 <a href="ko/Core_JavaScript_1.5_Reference">기본 JavaScript 레퍼런스</a>에 있는 Function 개체의 <a href="ko/Core_JavaScript_1.5_Reference/Objects/Function#Properties"><code>prototype</code> 속성</a>을 보십시오. {{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Indexing_Object_Properties", "Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Methods") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/deleting_properties/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/deleting_properties/index.html deleted file mode 100644 index 1b6f50cc11..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/deleting_properties/index.html +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: Deleting Properties -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Deleting_Properties ---- -<h3 id=".EC.86.8D.EC.84.B1_.EC.A0.9C.EA.B1.B0" name=".EC.86.8D.EC.84.B1_.EC.A0.9C.EA.B1.B0">속성 제거</h3> -<p><code>delete</code> 연산자를 사용하여 속성을 제거할 수 있습니다. 어떻게 속성을 제거하는지 코드를 보십시오.</p> -<pre>//a와 b라는 속성을 가지는 새 개체를 만듭니다. -myobj = new Object; -myobj.a = 5; -myobj.b = 12; - -//myobj가 속성 b만을 가지도록 속성 a를 지웁니다. -delete myobj.a; -</pre> -<p>전역 변수를 선언할 때 <code>var</code> 키워드를 사용하지 않았다면 그 전역 변수를 제거하는데 <code>delete</code> 연산자를 사용할 수 있습니다.</p> -<pre>g = 17; -delete g; -</pre> -<p>더 많은 정보를 얻으려면 <a href="ko/Core_JavaScript_1.5_Guide/Operators/Special_Operators#delete">delete</a>를 보십시오. {{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Getters_and_Setters", "Core_JavaScript_1.5_Guide:Predefined_Core_Objects") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/index.html deleted file mode 100644 index 8345ba1478..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/index.html +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: Creating New Objects -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects ---- -{{wiki.localize('System.API.page-generated-for-subpage')}} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/indexing_object_properties/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/indexing_object_properties/index.html deleted file mode 100644 index 84b9df2c2d..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/indexing_object_properties/index.html +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: Indexing Object Properties -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Indexing_Object_Properties ---- -<h3 id=".EA.B0.9C.EC.B2.B4_.EC.86.8D.EC.84.B1_.EC.A0.91.EA.B7.BC.ED.95.98.EA.B8.B0" name=".EA.B0.9C.EC.B2.B4_.EC.86.8D.EC.84.B1_.EC.A0.91.EA.B7.BC.ED.95.98.EA.B8.B0">개체 속성 접근하기</h3> -<p>JavaScript 1.0에서는 개체의 속성을 참조할 때 개체 이름이나 순서 인덱스를 사용할 수 있습니다. 그러나 JavaScript 1.1과 그 이후 버전에서는 처음에 속성을 정의할 때 이름으로 정의했으면 항상 이름으로만 참조해야 하고, 인덱스로 정의했으면 인덱스로만 참조해야 합니다.</p> -<p>이런 제한은 앞 페이지 예제의 car 개체 형식처럼 생성자 함수로 개체와 개체 속성을 만들 때나 명시적으로 개별 속성을 만들 때(예를 들어 <code>myCar.color = "red"</code> 같은 식으로 속성을 추가할 때) 모두 적용됩니다. 그러므로 <code>myCar{{ mediawiki.external(5) }} = "25 mpg"</code>라고 인덱스를 이용해서 속성을 정의하면 그 이후로는 항상 <code>myCar{{ mediawiki.external(5) }}</code>로 참조할 수 있습니다.</p> -<p>이 규칙은 <code>forms</code> 배열 같이 HTML을 반영하여 생성된 개체에는 예외입니다. 이 배열에 있는 개체를 참조할 때는 순서(문서에 기록된 순서)를 나타내는 숫자나 이름(이름을 정의한 경우에만)을 이용하여 참조할 수 있습니다. 예를 들어, 문서에 있는 두 번째 <code><FORM></code> 태그가 "myForm"이라는 값을 가진 <code>NAME</code> 속성을 갖고 있다면 이 폼은 <code>document.forms{{ mediawiki.external(1) }}</code>, <code>document.forms{{ mediawiki.external('\"myForm\"') }}</code>, <code>document.myForm</code>으로 접근할 수 있습니다. {{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Using_a_Constructor_Function", "Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Properties_for_an_Object_Type") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/using_a_constructor_function/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/using_a_constructor_function/index.html deleted file mode 100644 index 552347b70e..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/using_a_constructor_function/index.html +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: Using a Constructor Function -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Using_a_Constructor_Function ---- -<h3 id=".EC.83.9D.EC.84.B1.EC.9E.90_.ED.95.A8.EC.88.98_.EC.82.AC.EC.9A.A9.ED.95.98.EA.B8.B0" name=".EC.83.9D.EC.84.B1.EC.9E.90_.ED.95.A8.EC.88.98_.EC.82.AC.EC.9A.A9.ED.95.98.EA.B8.B0">생성자 함수 사용하기</h3> -<p>다른 방법으로, 다음 두 단계를 거쳐서 개체를 만들 수도 있습니다.</p> -<ol> - <li>생성자 함수를 작성함으로써 개체를 정의합니다.</li> - <li>new 키워드를 사용하여 개체의 인스턴스를 만듭니다.</li> -</ol> -<p>개체 형식을 정의하기 위해서, 개체의 이름, 속성, 메소드를 지정하는 함수를 만듭니다. 자동차를 나타내기 위한 개체를 만들고 싶다고 해봅시다. 그렇다면 이 형식이 <code>car</code>라고 불리길 원할 것이고, make, model, year라는 속성이 있기를 원할 것입니다. 원하는 것을 이루기 위해서 이런 함수를 작성합니다.</p> -<pre>function car(make, model, year) { - this.make = make; - this.model = model; - this.year = year; -} -</pre> -<p>함수의 인자로 전달받은 값을 개체의 속성에 할당하기 위해서 <code>this</code>를 사용했다는 것을 명심하십시오.</p> -<p>이제 우리는 <code>mycar</code>라는 개체를 이렇게 만들 수 있습니다.</p> -<pre>mycar = new car("Eagle", "Talon TSi", 1993); -</pre> -<p>이 문장은 <code>mycar</code>를 만들고, 지정된 값을 mycar의 속성에 할당합니다. 그러면 <code>mycar.make</code>는 "Eagle"이라는 문자열 값을 가지고, <code>mycar.year</code>는 1993이라는 정수를 가질 것입니다.</p> -<p>우리는 <code>new</code>를 써서 <code>car</code> 개체를 몇 개라도 만들 수 있습니다.</p> -<pre>kenscar = new car("Nissan", "300ZX", 1992); -vpgscar = new car("Mazda", "Miata", 1990); -</pre> -<p>개체는 다른 개체를 속성으로 가질 수 있습니다. 예를 들어, <code>person</code> 개체를 다음과 같이 정의했다고 합시다.</p> -<pre>function person(name, age, sex) { - this.name = name; - this.age = age; - this.sex = sex; -} -</pre> -<p>그리고나서 person 개체의 인스턴스 두 개를 만듭니다.</p> -<pre>rand = new person("Rand McKinnon", 33, "M"); -ken = new person("Ken Jones", 39, "M"); -</pre> -<p>이제 우리는 car가 owner라는 속성으로 <code>person</code> 개체를 가지도록 car의 정의를 바꿀 수 있습니다.</p> -<pre>function car(make, model, year, owner) { - this.make = make; - this.model = model; - this.year = year; - this.owner = owner; -} -</pre> -<p>새 개체 인스턴스를 만들 때 이렇게 쓸 수 있습니다.</p> -<pre>car1 = new car("Eagle", "Talon TSi", 1993, rand); -car2 = new car("Nissan", "300ZX", 1992, ken); -</pre> -<p>위 문장에서 owner 인자로 문자열 상수값이나 정수값을 전달하는 대신 <code>rand</code>와 <code>ken</code>이라는 개체를 전달했다는 사실에 주의하십시오. 이제 car2의 소유자 이름을 알고 싶으면 이런식으로 접근할 수 있습니다.</p> -<pre>car2.owner.name -</pre> -<p>정의된 개체에 아무때나 속성을 추가할 수 있다는 사실을 기억하십시오.</p> -<pre>car1.color = "black" -</pre> -<p>이 문장은 car1에 <code>color</code> 속성을 추가하고 "black"이라는 값을 할당합니다. 그러나 이 문장이 다른 개체에 영향을 미치지는 않습니다. 같은 형식을 가지는 모든 개체에 새 속성을 추가하고 싶으면 car 개체 형식의 정의에 속성을 추가해야 합니다.</p> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Using_Object_Initializers", "Core_JavaScript_1.5_Guide:Creating_New_Objects:Indexing_Object_Properties") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/using_this_for_object_references/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/using_this_for_object_references/index.html deleted file mode 100644 index 0ed663ae1f..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/creating_new_objects/using_this_for_object_references/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: Using this for Object References -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Creating_New_Objects/Using_this_for_Object_References ---- -<h3 id="this.EB.A5.BC_.EC.82.AC.EC.9A.A9.ED.95.9C_.EA.B0.9C.EC.B2.B4_.EC.B0.B8.EC.A1.B0" name="this.EB.A5.BC_.EC.82.AC.EC.9A.A9.ED.95.9C_.EA.B0.9C.EC.B2.B4_.EC.B0.B8.EC.A1.B0">this를 사용한 개체 참조</h3> -<p>JavaScript에는 <code>this</code>라는 키워드가 있는데, 메소드 안에서 현재 개체를 참조하기 위해서 이 키워드를 사용할 수 있습니다. 예를 들어, 개체의 값 속성을 검증하는 <code>validate</code>라는 함수가 있다고 해봅시다.</p> -<pre>function validate(obj, lowval, hival) { - if ((obj.value < lowval) || (obj.value > hival)) - alert("Invalid Value!"); -} -</pre> -<p>그러면 폼의 각 요소의 <code>onchange</code> 이벤트 핸들러에서 <code>validate</code>를 호출할 때, 다음 예제와 같은 방법으로 this를 사용해서 폼 요소를 <code>validate</code>에 전달할 수 있습니다.</p> -<pre><input type="text" name="age" size="3" - onChange="validate(this, 18, 99)"> -</pre> -<p><code>form</code> 속성과 같이 사용하면, <code>this</code>는 현재 개체의 부모 폼을 참조할 수 있습니다. 다음 예제에서, <code>myForm</code>이라는 폼은 <code>Text</code> 개체와 버튼을 포함하고 있습니다. 사용자가 버튼을 클릭하면 <code>Text</code> 개체의 값을 폼 이름으로 바꿉니다. 버튼의 <code>onclick</code> 이벤트 핸들러에서 부모 폼인 <code>myForm</code>을 참조하기 위해서 <code>this.form</code>을 사용하고 있습니다.</p> -<pre><form name="myForm"> -<p><label>Form name:<input type="text" name="text1" value="Beluga"></label> -<p><input name="button1" type="button" value="Show Form Name" - onclick="this.form.text1.value=this.form.name"> -</p> -</form> -</pre> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Methods", "Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Getters_and_Setters") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/expressions/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/expressions/index.html deleted file mode 100644 index d9f8bb0bf9..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/expressions/index.html +++ /dev/null @@ -1,16 +0,0 @@ ---- -title: Expressions -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Expressions ---- -<h3 id=".ED.91.9C.ED.98.84.EC.8B.9D" name=".ED.91.9C.ED.98.84.EC.8B.9D"> 표현식 </h3> -<p><i>표현식</i>은 상수(literals), 변수, 연산자 그리고 단일값을 반환하는 계산식(값은 숫자, 문자열, 논리값이 가능)이 알맞게 조합된 집합체다. -</p><p>개념적으로 보면 표현식에는 두가지 타입이 있다: 하나는 변수에 값을 할당하는 것이고 다른 하나는 단순히 값을 가지고 있는 것이다. 예를 들어, x = 7 이라는 표현식은 x 에 7이라는 값을 할당하는 표현식이다. 이 표현식은 스스로 7이라는 값을 부여한다. 이런 표현식들은 <i>할당 연산자</i>를 사용한다. 반면에, 3 + 4 라는 표현식은 단순히 7이라는 값을 계산할 뿐이다; 할당하지 않는다. 이런 표현식에서 사용되는 연산자는 그냥 단순히 <i>연산자</i>라고만 한다. -</p><p>JavaScript에는 다음과 같은 타입의 표현식이 있다: -</p> -<ul><li> 산술형 : 3.14159와 같이 숫자를 표현(evaluate). (일반적으로 <a href="ko/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators">산술 연산자</a>를 사용) -</li><li> 문자열형: "Fred"나 "234"와 같이 문자열을 표현(evaluate). (일반적으로 <a href="ko/Core_JavaScript_1.5_Guide/Operators/String_Operators">문자열 연산자</a>를 사용) -</li><li> 논리형: 참(true) 혹은 거짓(false)을 표현(evaluate). (종종 <a href="ko/Core_JavaScript_1.5_Guide/Operators/Logical_Operators">논리 연산자</a>와 함께 사용) -</li><li> 객체형: 객체를 표현(evaluate). (객체표현식에 사용하는 다양한 연산자는 <a href="ko/Core_JavaScript_1.5_Guide/Operators/Special_Operators">특수 연산자</a>를 참고) -</li></ul> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Unicode", "Core_JavaScript_1.5_Guide:Operators") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Expressions", "fr": "fr/Guide_JavaScript_1.5/Expressions", "ja": "ja/Core_JavaScript_1.5_Guide/Expressions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Wyra\u017cenia" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/javascript_overview/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/javascript_overview/index.html deleted file mode 100644 index 310ab25c67..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/javascript_overview/index.html +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: JavaScript Overview -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/JavaScript_Overview ---- -<h3 id="JavaScript.EB.9E.80_.EB.AC.B4.EC.97.87.EC.9D.B8.EA.B0.80.3F" name="JavaScript.EB.9E.80_.EB.AC.B4.EC.97.87.EC.9D.B8.EA.B0.80.3F">JavaScript란 무엇인가?</h3> -<p>JavaScript는 크로스 플랫폼, 객체 지향 스크립트 언어입니다. JavaScript는 작고, 가벼운 언어입니다; JavaScript는 단독으로 쓰이는 언어로는 유용하지 않지만, 웹 브라우져 같은 다른 제품이나 프로그램에 포함하기 쉽습니다. 호스트 환경에서 JavaScript는 그 환경의 다른 개체(object)들을 프로그램적으로 제어하기 위해서 그들과 연결될 수 있습니다.</p> -<p>기본 JavaScript(core JavaScript)는 <code>Array</code>, <code>Date</code>, <code>Math</code>등 기본이 되는 개체들(core set of objects)과 연산자, 제어 구조, 문장등 언어의 기본 요소들(core set of language elements)을 포함하고 있습니다. 기본 JavaScript는 다른 개체를 추가함으로써 다양한 목적을 위해 확장될 수 있습니다. 예를 들면 다음과 같은 것들입니다.</p> -<ul> <li>"클라이언트쪽 JavaScript"는 브라우저(Navigatore 또는 다른 브라우저들)와 브라우저의 Document Object Model(DOM)을 제어할 수 있는 개체들을 제공함으로써 기본 언어를 확장합니다. 예를 들어, 클라이언트쪽 확장 기능은 응용프로그램이 HTML 폼에 요소를 두어 마우스 클릭이나 폼 입력, 페이지 이동 같은 사용자 이벤트에 반응할 수 있게 합니다.</li> <li>"서버쪽 JavaScript"는 서버에서 JavaScript를 실행하는 데 연관되는 개체들을 제공함으로써 기본 언어를 확장합니다. 예를 들어, 서버쪽 확장 기능은 응용프로그램이 관계형 데이터베이스와 통신할 수 있게 하고, 응용프로그램의 호출들 사이에 연속성을 제공하거나, 서버에서 파일 조작을 수행할 수 있도록 해줍니다.</li> -</ul> -<p>JavaScript의 LiveConnect 기능을 통해서, Java와 JavaScript 코드가 서로 통신할 수 있습니다. JavaScript에서 Java 개체를 초기화하여 개체의 공개 메소드와 필드에 접근할 수 있습니다. Java에서 JavaScript 개체, 속성(property), 메소드에 접근할 수 있습니다.</p> -<p>Netscape가 JavaScript를 개발했고 Netscape 브라우저에서 JavaScript가 가장 먼저 사용되었습니다.</p> -<h3 id="JavaScript.EC.99.80_Java" name="JavaScript.EC.99.80_Java">JavaScript와 Java</h3> -<p>JavaScript 와 Java 는 여러가지 면에서 비슷하지만 본질적으로 다릅니다. JavaScript는 Java 와 공통점이 있지만 Java 처럼 형(type)을 검사하지 않습니다. JavaScript는 Java 문법의 대부분과 제어흐름의 기본적인 개념들을 지원합니다.</p> -<p>Java의 클래스 선언으로 이루어지는 컴파일 타임 시스템에 대조적으로, JavaScript는 수, 불리언, 문자열 값을 나타내는 작은 규모의 자료형에 기반한 런타임 시스템을 지원합니다. JavaScript는 클래스 기반 개체 모델이 아닌 프로토타입 기반(prototype-based) 개체 모델을 갖고 있습니다. 프로토타입 기반 개체 모델은 동적인 상속을 제공합니다. 즉, 각각의 개체를 상속할 수 있는 것입니다. JavaScript는 또 특별히 선언시의 요구사항이 없는 함수도 지원합니다. 함수는 느슨하게 타입된 메소드로 실행됨으로써 개체의 속성이 될 수 있습니다.(Functions can be properties of objects, executing as loosely typed methods.)</p> -<p>Java에 비해 JavaScript는 형식이 자유로운 언어입니다. 모든 변수, 클래스, 메소드들을 꼭 선언 할 필요는 없습니다. 메소드가 public, private, protected 인지 고민해야할 필요가 없고, interface를 구현할 필요도 없습니다. 변수, 매개변수(parameter), 함수의 반환 형식도 명시적으로 지정할 필요가 없습니다.</p> -<p>Java는 클래스 기반 프로그래밍 언어로서, 빠른 실행과 형 안정성(type safety)을 위해 설계되었습니다. 형 안정성이란 예를 들면 Java에서 정수를 개체 참조로 변환할 수 없고, Java 바이트코드에 오류를 일으켜서 사적인(private) 메모리 공간에 접근할 수 없다는 말입니다. 자바의 클래스 기반 모델은 프로그램이 클래스와 클래스의 메소드로만 이루어진다는 의미입니다. Java의 클래스 상속과 엄격한 형 검사(strong typing)는 일반적으로 단단히 결합된 개체의 계층 구조를 필요로 합니다. 이런 요구사항이 JavaScript 프로그래밍에 비해 Java 프로그래밍을 더 복잡하게 만듭니다.</p> -<p>반면 JavaScript는 HyperTalk나 dBASE 같이 적은 줄수의 동적 타입 언어를 계승한 것입니다. 이런 스크립트 언어는 더 많은 사람들을 위한 프로그래밍 도구로서 제공되는데, 이 언어들이 문법이 쉽고, 내장되기에 쉬우며, 개체 생성에 요구 사항이 단순하기 때문입니다.</p> -<table class="fullwidth-table"> <tbody> <tr> <th>JavaScript</th> <th>Java</th> </tr> <tr> <td>개체 지향. 개체의 형식 사이에 구분이 없음. 프로토타입 메커니즘을 통해 상속을 지원하고, 어떤 개체에든지 동적으로 속성과 메소드를 추가할 수 있습니다.</td> <td>클래스 기반. 개체는 클래스 계층 구조를 관통하는 상속을 통해서 클래스와 인스턴스(instance)로 나뉩니다. 클래스와 인스턴스에는 동적으로 속성과 메소드를 추가할 수 없습니다.</td> </tr> <tr> <td>변수의 자료형을 선언하지 않음(동적 형 검사)</td> <td>변수의 자료형을 반드시 선언해야 함(정적 형 검사)</td> </tr> <tr> <td>Cannot automatically write to hard disk.</td> <td>Cannot automatically write to hard disk.</td> </tr> </tbody> -</table> -<p><small><strong>표(Table) 1.1: JavaScript 와 Java 비교</strong></small><br> -<br> -Java와 JavaScript 사이의 차이점에 대해서 더 알고 싶으시면 <a href="/ko/Core_JavaScript_1.5_Guide#.EA.B0.9C.EC.B2.B4_.EB.AA.A8.EB.8D.B8.EC.9D.98_.EC.83.81.EC.84.B8_.EB.82.B4.EC.9A.A9" title="ko/Core_JavaScript_1.5_Guide#.EA.B0.9C.EC.B2.B4_.EB.AA.A8.EB.8D.B8.EC.9D.98_.EC.83.81.EC.84.B8_.EB.82.B4.EC.9A.A9">개체 모델의 상세 내용</a>을 보시기 바랍니다.</p><h3 id="JavaScript.EC.99.80_ECMAScript_.EB.AA.85.EC.84.B8" name="JavaScript.EC.99.80_ECMAScript_.EB.AA.85.EC.84.B8">JavaScript와 ECMAScript 명세</h3> -<p>Netscape가 JavaScript를 개발했고, Netscape 브라우저에서 가장 처음으로 사용되었습니다. 그러나 <a class="external" href="http://www.ecma-international.org/">Ecma International</a> - 정보와 통신 시스템을 표준화하기 위한 유럽 기구(공식적으로 ECMA - the European Computer Manufacturers Association으로 알려짐) - 과 Netscape가 공동으로 작업하여 기본 JavaScript에 기반하여 표준화되고 국제적인 프로그래밍 언어를 만들어냈습니다. JavaScript의 표준화된 버전은 ECMAScript라고 부르고, 표준을 지원하는 응용프로그램에서는 모두 동일하게 동작합니다. 회사들은 그들의 JavaScript 구현을 개발하기 위해서 공개된 표준 언어를 사용할 수 있습니다. ECMAScript 표준은 ECMA-262 명세에 문서화되어 있습니다.</p> -<p>ECMA-262 표준은 <a class="external" href="http://www.iso.ch/">ISO</a> (International Organization for Standardization, 국제 표준화기구)의 승인을 받아 ISO-16262가 되었습니다. Mozilla 웹사이트에서 <a class="external" href="http://www.mozilla.org/js/language/E262-3.pdf">ECMA-262의 PDF 문서</a>를 얻을 수 있습니다. <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">the Ecma International 웹사이트</a> 에서도 명세를 찾을 수 있습니다. ECMAScript 명세는 <a class="external" href="http://www.w3.org/">World Wide Web Consortium (W3C)</a>에서 표준화 한 Document Object Model(DOM)에 대해서는 설명하지 않습니다. DOM은 HTML 문서 개체들이 스크립트에 노출되는 방식을 정의합니다.</p> -<h4 id="JavaScript_.EB.B2.84.EC.A0.84.EA.B3.BC_ECMAScript_.ED.8C.90.EB.B3.B8_.EC.82.AC.EC.9D.B4.EC.9D.98_.EA.B4.80.EA.B3.84" name="JavaScript_.EB.B2.84.EC.A0.84.EA.B3.BC_ECMAScript_.ED.8C.90.EB.B3.B8_.EC.82.AC.EC.9D.B4.EC.9D.98_.EA.B4.80.EA.B3.84">JavaScript 버전과 ECMAScript 판본 사이의 관계</h4> -<p>Netscape는 ECMA와 밀접하게 작업하여 ECMAScript Specification(ECMA-262)를 만들었습니다. JavaScript 버전과 ECMAScript 판본(edition)들 사이의 관계가 아래 표에 설명되어 있습니다.</p> -<table class="fullwidth-table"> <tbody> <tr> <th>JavaScript 버전</th> <th>ECMAScript 판본과의 관계</th> </tr> <tr> <td>JavaScript 1.1</td> <td>ECMA-262, 1판은 JavaScript 1.1에 기초합니다.</td> </tr> <tr> <td>JavaScript 1.2</td> <td>JavaScript 1.2가 발표됐을 때 ECMA-262가 아직 완성되지 않았습니다. 다음과 같은 이유때문에 JavaScript 1.2는 ECMA-262 1판과 완벽하게 호환되지 않습니다. <ul> <li>Netscape는 JavaScript 1.2에 몇 가지 기능을 추가했으나, ECMA-262에서 고려하지 못했습니다.</li> <li>ECMA-262는 두 가지 새 기능을 추가했습니다. 유니코드를 이용한 국제화, 모든 플랫폼에서의 동일한 동작. Date 개체 같은 JavaScript 1.2의 몇 가지 기능이 플랫폼에 의존적이었습니다.</li> </ul> </td> </tr> <tr> <td> <p>JavaScript 1.3</p> </td> <td> <p>JavaScript 1.3은 ECMA-262 1판과 완벽하게 호환됩니다.</p> <p>JavaScript 1.3은 ==와 !=연산자를 제외하고는 JavaScript 1.2의 추가적인 기능을 그대로 유지하면서 JavaScript 1.2가 ECMA-262와 어긋나던 점들을 해결했습니다. ==, != 연산자는 ECMA-262에 맞추기 위해 수정되었습니다.</p> </td> </tr> <tr> <td> <p>JavaScript 1.4</p> </td> <td> <p>JavaScript 1.4는 ECMA-262 1판과 완벽하게 호환됩니다.</p> <p>JavaScript 1.4가 발표되었을 때 ECMAScript 명세의 세 번째 버전이 아직 완성되지 않았습니다.</p> </td> </tr> <tr> <td>JavaScript 1.5</td> <td>JavaScript 1.5는 ECMA-262 3판과 완벽하게 호환됩니다.</td> </tr> </tbody> -</table> -<p><small><strong>표 1.2: JavaScript 버전과 ECMAScript 판본</strong></small><br> -<br> -참고: ECMA-262 2판은 1판에 편집상 사소한 변경과 버그 수정을 가한 판본입니다. 현재 ECMA의 TC39 워킹그룹에서 ECMAScript 4판을 작업하고 있습니다. 4판은 JavaScript 2.0과 대응될 것입니다.</p> -<p><a href="/ko/Core_JavaScript_1.5_Guide" title="ko/Core_JavaScript_1.5_Guide">JavaScript 기본 레퍼런스</a>에서 ECMAScript 호환 기능을 보여줍니다.</p> -<p>JavaScript는 항상 ECMAScript Specification에 포함되지 않은 기능들을 포함할 것입니다. JavaScript는 추가적인 기능을 제공하지만 ECMAScript와 호환됩니다.</p> -<h4 id="JavaScript_.EB.AC.B8.EC.84.9C_vs_ECMAScript_.EB.AA.85.EC.84.B8.EC.84.9C" name="JavaScript_.EB.AC.B8.EC.84.9C_vs_ECMAScript_.EB.AA.85.EC.84.B8.EC.84.9C">JavaScript 문서 vs ECMAScript 명세서</h4> -<p>ECMAScript 명세는 ECMAScript를 구현하는데 필요한 요구사항을 모아놓은 것입니다. 이것은 우리가 JavaScript의 한 기능이 다른 ECMAScript 구현에서도 지원될 것인지 결정하는데 유용합니다. ECMAScript에서 지원하는 기능만을 사용하는 JavaScript 코드를 작성할 계획이라면 ECMAScript 명세를 살펴볼 필요가 있을 것입니다.</p> -<p>ECMAScript 문서는 스크립트 프로그래머를 돕기위해 작성된 것이 아닙니다. 스크립트 작성에 대한 정보를 얻으려면 JavaScript 문서를 보십시오.</p> -<h4 id="JavaScript.EC.99.80_ECMAScript_.EC.9A.A9.EC.96.B4" name="JavaScript.EC.99.80_ECMAScript_.EC.9A.A9.EC.96.B4">JavaScript와 ECMAScript 용어</h4> -<p>ECMAScript 명세는 JavaScript 프로그래머에게는 친숙하지 않은 용어와 문법을 사용하여 작성되었습니다. 비록 ECMAScript의 언어 설명이 다르긴 하지만 언어는 똑같습니다. JavaScript는 ECMAScript 명세에서 설명하는 모든 기능을 지원합니다.</p> -<p>JavaScript 문서는 JavaScript 프로그래머에게 적당한 언어의 측면을 설명합니다. 예를 들면 이렇습니다.</p> -<ul> <li>전역 개체(Global Object)는 JavaScript 문서에서는 논의되지 않는데, 그것은 우리가 그 개체를 직접 사용할 일이 없기 때문입니다. 전역 개체에서 우리가 사용할 만한 메소드와 속성은 JavaScript 문서에서 논의되고 있기는 하지만 최상위(top-level) 함수와 속성이라고 부릅니다.</li> <li>JavaScript 문서에서 매개변수가 없는 <code>Number</code>와 <code>String</code> 개체 생성자는 논의되지 않고 있는데, 그것은 거의 사용할 일이 없기 때문입니다. <code>Number</code>의 인자없는 생성자는 +0을 반환하고, <code>String</code>의 인자없는 생성자는 ""(빈 문자열)을 반환합니다.</li> -</ul> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:About", "Core_JavaScript_1.5_Guide:Values") }}</p> -<p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/JavaScript_Overview", "fr": "fr/Guide_JavaScript_1.5/Aper\u00e7u_de_JavaScript", "ja": "ja/Core_JavaScript_1.5_Guide/JavaScript_Overview", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Podgl\u0105d_JavaScriptu" } ) }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/literals/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/literals/index.html deleted file mode 100644 index ee62d0cecf..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/literals/index.html +++ /dev/null @@ -1,175 +0,0 @@ ---- -title: Literals -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Literals -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Literals ---- -<h3 id=".EC.83.81.EC.88.98.EA.B0.92.28Literal.29" name=".EC.83.81.EC.88.98.EA.B0.92.28Literal.29">상수값(Literal)</h3> -<p>JavaScript에서 값을 표현하기 위해 상수값을 사용할 수 있습니다. 그것은 변수가 아니라 고정된 값으로서 "문자 그대로(literally)" 스크립트에 값을 제공하는 것입니다. 이 절에서 다음과 같은 상수값에 대해서 설명하겠습니다.</p> -<ul> - <li>{{ Anch("배열 상수값") }}</li> - <li>{{ Anch("불리언 상수값") }}</li> - <li>{{ Anch("소수 상수값") }}</li> - <li>{{ Anch("정수") }}</li> - <li>{{ Anch("개체 상수값") }}</li> - <li>{{ Anch("문자열 상수값") }}</li> -</ul> -<h4 id=".EB.B0.B0.EC.97.B4_.EC.83.81.EC.88.98.EA.B0.92" name=".EB.B0.B0.EC.97.B4_.EC.83.81.EC.88.98.EA.B0.92">배열 상수값</h4> -<p>배열 상수값은 대괄호([])안에 배열의 원소(element)를 0개 이상 나열한 것입니다. 배열 상수값으로 배열을 만드면 배열은 지정된 원소를 가지도록 초기화되고, 지정된 원소의 개수만큼의 길이를 갖게 됩니다.</p> -<p>다음 예제는 세 개의 원소를 가지고 길이가 3인 <code>coffees</code> 배열을 만드는 예제입니다.</p> -<pre>coffees = ["French Roast", "Colombian", "Kona"]</pre> -<p><b>참고</b> 배열 상수값은 개체 초기화지정자(object initializer) 중의 하나입니다. <a href="ko/Core_JavaScript_1.5_Guide/Creating_New_Objects/Using_Object_Initializers">개체 초기화지정자 사용하기</a>를 보십시오.</p> -<p>최상위 스크립트에서 상수값을 이용하여 배열을 만들면 JavaScript는 배열 상수값을 포함하는 표현식을 평가(evaluate)할 때마다 배열을 만듭니다. 또한, 함수 안에서 사용된 상수값은 함수가 호출될 때마다 생성됩니다.</p> -<p>배열 상수값은 Array 개체입니다. Array 개체에 대한 상세한 내용은 <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Array_Object">Array 개체</a>를 보십시오.</p> -<p><b>배열 상수값의 추가적인 쉼표</b></p> -<p>배열 상수값에 모든 원소를 지정할 필요는 없습니다. 쉼표만 찍어 두면 값이 할당되지 않은 빈 공간을 가진 배열이 만들어집니다. 다음 예제는 <code>fish</code> 배열을 만듭니다.</p> -<pre>fish = ["Lion", , "Angel"]</pre> -<p>이 배열은 값을 가진 원소 두 개와 빈 원소 하나를 갖게됩니다. (<code>fish{{ mediawiki.external(0) }}</code>은 "Lion", <code>fish{{ mediawiki.external(1) }}</code>은 <code>undefined</code>, <code>fish{{ mediawiki.external(2) }}</code>는 "Angel"이라는 값을 가집니다.)</p> -<p>원소 목록 끝에 남겨둔 쉼표는 무시됩니다. 다음 예제에서 배열 길이는 3입니다. <code>myList{{ mediawiki.external(3) }}</code>은 만들어지지 않습니다. 그외에 목록에 있는 다른 쉼표들은 각각 새로운 원소를 나타냅니다.</p> -<pre>myList = ['home', , 'school', ];</pre> -<p>다음 예제에서 배열 길이는 4이고, <code>myList{{ mediawiki.external(0) }}</code>과 <code>myList{{ mediawiki.external(2) }}</code>는 비게 됩니다.</p> -<pre>myList = [ , 'home', , 'school'];</pre> -<p>다음 예제에서 배열 길이는 4이고 <code>myList{{ mediawiki.external(1) }}</code>과 <code>myList{{ mediawiki.external(3) }}</code>이 비게 됩니다. 오직 마지막 쉼표만 무시됩니다.</p> -<pre>myList = ['home', , 'school', , ];</pre> -<h4 id=".EB.B6.88.EB.A6.AC.EC.96.B8_.EC.83.81.EC.88.98.EA.B0.92" name=".EB.B6.88.EB.A6.AC.EC.96.B8_.EC.83.81.EC.88.98.EA.B0.92">불리언 상수값</h4> -<p>불리언 형은 두 가지 상수값을 가질 수 있는데, 그것은 <code>true</code>와 <code>false</code>입니다.</p> -<p><code>true</code>, <code>false</code>라는 기본(primitive) 불리언 값과 true, false 값의 불리언 개체를 혼동하지 마십시오. 불리언 개체는 기본 불리언 데이터 형을 감싸는 역할을 할 뿐입니다. 더 많은 정보는 <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Boolean_Object">불리언 개체</a>를 참조하십시오.</p> -<h4 id=".EC.A0.95.EC.88.98" name=".EC.A0.95.EC.88.98">정수</h4> -<p>10진수, 16진수, 8진수 정수를 쓸 수 있습니다. 10진수 정수 상수값은 0(영)으로 시작하지 않는 숫자의 나열입니다. 0(영)으로 시작하는 정수 상수값은 8진수입니다. 0x(또는 0X)로 시작하면 16진수입니다. 16진수는 0부터 9까지의 숫자와 a부터 f나 A부터 F까지의 문자를 포함할 수 있습니다. 8진수에는 0부터 7까지만 쓸 수 있습니다.</p> -<p>8진수 정수 상수값은 사용하지 말기를 추천하고 있으며, ECMA-262 표준 3판에서는 아예 제거되었습니다. 하위 호환성을 위해 JavaScript 1.5에서는 여전히 8진수 정수 상수값을 지원하고 있습니다.</p> -<p>몇 가지 정수 상수값을 예를 보여드리겠습니다.</p> -<pre class="eval">0, 117, -345 (10진수) -015, 0001, -077 (8진수) -0x1123, 0x00111, -0xF1A7 (16진수 또는 "hex") -</pre> -<h4 id=".EC.86.8C.EC.88.98_.EC.83.81.EC.88.98.EA.B0.92" name=".EC.86.8C.EC.88.98_.EC.83.81.EC.88.98.EA.B0.92">소수 상수값</h4> -<p>소수 상수값은 이런 부분으로 이뤄집니다.</p> -<ul> - <li>부호를 가질 수 있는(즉, "+"나 "-"로 시작할 수 있는) 10진수 정수,</li> - <li>소수점("."),</li> - <li>소수 부분(10진수),</li> - <li>지수 부분</li> -</ul> -<p>지수 부분은 "e"나 "E" 뒤에 숫자가 붙은 형태입니다. 숫자 앞에는 부호("+"나 "-")를 붙일 수도 있습니다. 소수 상수값은 적어도 하나의 숫자에 소수점 또는 지수 부분을 가져야 합니다.</p> -<p>소수 상수값의 몇 가지 예제를 보여드리겠습니다. 3.1415, -3.1E12, .1e12, 2E-12</p> -<h4 id=".EA.B0.9C.EC.B2.B4_.EC.83.81.EC.88.98.EA.B0.92" name=".EA.B0.9C.EC.B2.B4_.EC.83.81.EC.88.98.EA.B0.92">개체 상수값</h4> -<p>개체 상수값은 중괄호({}) 안에 특성(property) 이름과 그에 해당하는 값의 쌍을 나열한 것입니다. 문장(statement)의 시작 부분에 개체 상수값을 사용해서는 안됩니다. { 가 블럭의 시작을 나타내기 때문에, 에러가 나거나 의도하지 않은 동작을 보일 것입니다.</p> -<p>다음은 개체 상수값의 예입니다. <code>car</code> 개체의 첫 번째 원소는 <code>myCar</code>라는 특성을 정의하고 있습니다. 두 번째 원소는 <code>getCar</code> 특성을 정의하는데, <code>(CarTypes("Honda"));</code>라는 함수를 호출하고 있습니다. 세 번째 원소는 <code>special</code> 특성을 정의하는데에 <code>Sales</code>라는 변수를 사용합니다.</p> -<pre>var Sales = "Toyota"; - -function CarTypes(name) { - if(name == "Honda") - return name; - else - return "Sorry, we don't sell " + name + "."; -} - -car = {myCar: "Saturn", getCar: CarTypes("Honda"), special: Sales} - -document.write(car.myCar); // Saturn -document.write(car.getCar); // Honda -document.write(car.special); // Toyota</pre> -<p>개체 특성 이름에 정수 상수값이나 문자열 상수값을 사용할 수 있고, 개체 안에 다른 개체를 포함시킬 수도 있습니다. 다음 예제를 보십시오.</p> -<pre>car = {manyCars: {a: "Saab", b: "Jeep"}, 7: "Mazda"} - -document.write(car.manyCars.b); // Jeep -document.write(car[7]); // Mazda -</pre> -<p>다음 사항을 참고하십시오.</p> -<pre class="eval">foo = {a: "alpha", 2: "two"} -document.write (foo.a) // alpha -document.write (foo[2]) // two -//document.write (foo.2) // Error: missing ) after argument list -//document.write (foo[a]) // Error: a is not defined -document.write (foo["a"]) // alpha -document.write (foo["2"]) // two -</pre> -<h4 id=".EB.AC.B8.EC.9E.90.EC.97.B4_.EC.83.81.EC.88.98.EA.B0.92" name=".EB.AC.B8.EC.9E.90.EC.97.B4_.EC.83.81.EC.88.98.EA.B0.92">문자열 상수값</h4> -<p>문자열 상수값은 큰따옴표(")나 작은따옴표(')로 둘러싸인 0개 이상의 문자들 입니다. 문자열은 같은 종류의 따옴표로 묶어야 합니다. 즉, 작은따옴표 둘로 묶거나, 큰따옴표 둘로 묶어야 한다는 말입니다. 문자열 상수값의 예를 보여드리겠습니다.</p> -<ul> - <li>"blah"</li> - <li>'blah'</li> - <li>"1234"</li> - <li>"one line \n another line"</li> - <li>"John's cat"</li> -</ul> -<p>우 리는 문자열 상수값에 String 개체의 모든 메소드를 호출할 수 있습니다. JavaScript는 자동으로 문자열 상수값을 임시 String 개체로 만들어서 메소드를 호출한 후, 임시 String 개체를 제거합니다. 문자열 상수값에 <code>String.length</code> 특성을 사용할 수도 있습니다. 이렇게 말입니다.</p> -<ul> - <li>"John's cat".length</li> -</ul> -<p>우리가 특별하게 String 개체를 필요로 하는 경우가 아니라면 문자열 상수값을 사용해야만 합니다. String 개체에 대한 자세한 내용은 <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/String_Object">String 개체</a>를 보십시오.</p> -<h5 id=".EB.AC.B8.EC.9E.90.EC.97.B4.EC.97.90.EC.84.9C_.ED.8A.B9.EC.88.98.EB.AC.B8.EC.9E.90_.EC.82.AC.EC.9A.A9.ED.95.98.EA.B8.B0" name=".EB.AC.B8.EC.9E.90.EC.97.B4.EC.97.90.EC.84.9C_.ED.8A.B9.EC.88.98.EB.AC.B8.EC.9E.90_.EC.82.AC.EC.9A.A9.ED.95.98.EA.B8.B0">문자열에서 특수문자 사용하기</h5> -<p>다음 예제에서 볼 수 있듯이 일반적인 문자뿐만 아니라 특수문자도 문자열에 쓸 수 있습니다.</p> -<pre>"one line \n another line"</pre> -<p>JavaScript 문자열에 사용할 수 있는 특수문자를 표로 나타낸 것입니다.</p> -<table class="fullwidth-table"> - <tbody> - <tr> - <th>문자</th> - <th>의미</th> - </tr> - <tr> - <td>\b</td> - <td>Backspace</td> - </tr> - <tr> - <td>\f</td> - <td>Form feed</td> - </tr> - <tr> - <td>\n</td> - <td>New line</td> - </tr> - <tr> - <td>\r</td> - <td>Carriage return</td> - </tr> - <tr> - <td>\t</td> - <td>Tab</td> - </tr> - <tr> - <td>\v</td> - <td>Vertical tab</td> - </tr> - <tr> - <td>\'</td> - <td>Apostrophe or single quote</td> - </tr> - <tr> - <td>\"</td> - <td>Double quote</td> - </tr> - <tr> - <td>\\</td> - <td>Backslash character (\).</td> - </tr> - <tr> - <td>\<i>XXX</i></td> - <td>세 자리 까지의 8진수 "XXX"로 지정하는 Latin-1 인코딩의 문자. 0부터 377 사이. 예를 들어, \251은 저작권 기호의 8진수 표현입니다.</td> - </tr> - <tr> - <td>\x<i>XX</i></td> - <td>두 자리 까지의 16진수 "XX"로 지정하는 Latin-1 인코딩의 문자. 00부터 FF 사이. 예를 들어, \xA9는 저작권 기호의 16진수 표현입니다.</td> - </tr> - <tr> - <td>\u<i>XXXX</i></td> - <td>네 자리의 16진수 "XXXX"로 지정하는 유니코드 문자. 예를 들어, \u00A9는 저작권 기호의 유니코드 표현입니다. <a href="ko/Core_JavaScript_1.5_Guide/Unicode#.EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C_.EC.9D.B4.EC.8A.A4.EC.BC.80.EC.9D.B4.ED.94.84_.EC.8B.9C.ED.80.80.EC.8A.A4">유니코드 이스케이프 시퀀스</a>를 보십시오.</td> - </tr> - </tbody> -</table> -<p><small><b>표 2.1: JavaScript 특수문자</b></small></p> -<h5 id=".EB.AC.B8.EC.9E.90_.EC.9D.B4.EC.8A.A4.EC.BC.80.EC.9D.B4.ED.94.84" name=".EB.AC.B8.EC.9E.90_.EC.9D.B4.EC.8A.A4.EC.BC.80.EC.9D.B4.ED.94.84">문자 이스케이프</h5> -<p>표 2.1에 없는 문자에 대해서는 역슬래시가 무시됩니다. 그러나 이러한 기능은 사용하지 않기를 권장하므로 사용을 피해야만 합니다.</p> -<p>역슬래시를 앞에 붙이면 문자열 안에 따옴표를 넣을 수 있습니다. 이것은 따옴표 "이스케이프(escaping)"라고 알려져 있습니다.</p> -<pre>var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service." -document.write(quote) -</pre> -<p>이 코드의 결과는 다음과 같습니다.</p> -<pre>He read "The Cremation of Sam McGee" by R.W. Service. -</pre> -<p>문자열 안에 역슬래시 문자를 넣고 싶으면 역슬래시 문자를 이스케이프시켜야 합니다. 예를 들어, <code>c:\temp</code> 라는 경로를 문자열에 할당하고 싶으면 다음과 같이 하면 됩니다.</p> -<pre>var home = "c:\\temp" -</pre> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Constants", "Core_JavaScript_1.5_Guide:Unicode") }}</p> -<p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Literals", "fr": "fr/Guide_JavaScript_1.5/Constantes_litt\u00e9rales", "ja": "ja/Core_JavaScript_1.5_Guide/Literals", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Litera\u0142y" } ) }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/objects_and_properties/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/objects_and_properties/index.html deleted file mode 100644 index abe9ff83f4..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/objects_and_properties/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: Objects and Properties -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Objects_and_Properties ---- -<h3 id=".EA.B0.9D.EC.B2.B4.EC.99.80_.EC.86.8D.EC.84.B1" name=".EA.B0.9D.EC.B2.B4.EC.99.80_.EC.86.8D.EC.84.B1"> 객체와 속성 </h3> -<p>자바스크립트 객체는 객체를 구성하는 속성을 가지고 있습니다. 속성에는 간단한 방법으로 접근할 수 있습니다.: -</p> -<pre>객체이름.속성이름 -</pre> -<p>객체 이름과 속성 이름 두 가지 모두에 대해 알기쉬운 예가 있습니다. 속성은 값을 지정하여 정의합니다. 예를 들어 <code>myCar</code>라는 객체가 있다면(객체가 이미 존재한다고 가정합니다.), <code>make</code>, <code>model</code>, <code>year</code>라는 속성에 다음과 같이 값을 지정할 수 있습니다. -</p> -<pre>myCar.make = "Ford"; -myCar.model = "Mustang"; -myCar.year = 1969; -</pre> -<p>배열은 한 가지 변수 이름으로 결합되어 있는 연속된 값의 집합입니다. 자바스크립트에서 속성과 배열은 밀접한 관련이 있습니다; 말하자면 그 두 가지는 같은 데이터 구조에 다른 인터페이스라는 뜻입니다. 예를 들면 <code>myCar</code> 객체에 다음과 같이 접근할 수도 있습니다: -</p> -<pre>myCar["make"] = "Ford"; -myCar["model"] = "Mustang"; -myCar["year"] = 1967; -</pre> -<p>이러한 배열의 종류는 <i>연관 배열</i>이라고 부릅니다. 왜냐하면 각각의 인덱스 요소가 문자열 값과 연관되어 있기 때문입니다. 이러한 방식에 대한 설명은 다음의 함수에 객체와 객체의 이름을 입력했을 때 객체의 속성을 표시해주는 다음과 같은 함수에서 알아볼 수 있습니다: -</p> -<pre>function show_props(obj, obj_name) { - var result = ""; - for (var i in obj) - result += obj_name + "." + i + " = " + obj[i] + "\n"; - return result; -} -</pre> -<p>결과적으로 <code>call show_props(myCar, "myCar")</code>라는 함수 호출은 다음과 같은 값을 반환합니다: -</p> -<pre>myCar.make = Ford -myCar.model = Mustang -myCar.year = 1967 -</pre> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Predefined_Functions:escape_and_unescape_Functions", "Core_JavaScript_1.5_Guide:Creating_New_Objects") }} -</p>{{ languages( { "fr": "fr/Guide_JavaScript_1.5/Objets_et_propri\u00e9t\u00e9s", "ja": "ja/Core_JavaScript_1.5_Guide/Objects_and_Properties", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Obiekty_i_w\u0142a\u015bciwo\u015bci" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/arithmetic_operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/arithmetic_operators/index.html deleted file mode 100644 index f8793b4cbc..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/arithmetic_operators/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: Arithmetic Operators -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Arithmetic_Operators ---- -<h3 id=".EC.82.B0.EC.88.A0_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EC.82.B0.EC.88.A0_.EC.97.B0.EC.82.B0.EC.9E.90"> 산술 연산자 </h3> -<p>산술 연산자는 수(상수값이든지 변수든지)를 받아서 하나의 수를 반환합니다. 표준 산술 연산자는 더하기(+), 빼기(-), 곱하기(*), 나누기(/)입니다. 이 연산자들은 대부분의 다른 프로그래밍 언어에서 처럼 동작합니다. 예외적으로 / 연산자는 JavaScript에서 소수를 반환합니다. C나 Java 같은 다른 언어에서는 / 연산자가 소수 부분은 잘라버립니다. 예를 들면 이렇습니다. -</p> -<pre>1/2 //returns 0.5 in JavaScript -1/2 //returns 0 in Java -</pre> -<p>JavaScript는 다음 표에 나오는 산술 연산자를 제공합니다. -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>연산자</th> -<th>설명</th> -<th>예제</th> -</tr> -<tr> -<td>%<br>(나머지)</td> -<td>2항(binary) 연산자. 두 피연산자의 나눗셈에서 나온 나머지를 반환합니다.</td> -<td>12 % 5 returns 2.</td> -</tr> -<tr> -<td>++<br>(증가)</td> -<td>단항(unary) 연산자. 피연산자에 1을 더함. 전위 연산자(++x)를 사용하면 피연산자에 1을 더한 후 그 값을 반환합니다. 후위 연산자(x++)를 사용하면 피연산자에 1을 더하기 전에 피연산자의 값을 반환합니다.</td> -<td><code>x</code>가 3일 때, <code>++x</code>는 <code>x</code>를 4로 만들고 4를 반환합니다. 반면 <code>x++</code>는 <code>x</code>를 4로 만들고 3을 반환합니다.</td> -</tr> -<tr> -<td>--<br>(감소)</td> -<td>단항 연산자. 피연산자에서 1을 뺌. 반환값은 증가 연산자와 동일한 방식으로 결정됩니다.</td> -<td><code>x</code>가 3일 때, <code>--x</code>는 <code>x</code>를 2로 만들고 2를 반환합니다. 반면 <code>x--</code>는 <code>x</code>를 2로 만들고 3을 반환합니다.</td> -</tr> -<tr> -<td>-<br>(단항 부정)</td> -<td>단항 연산자. 피연산자의 부호를 바꾼 값을 반환합니다.</td> -<td><code>x</code>가 3이면 <code>-x</code>는 -3을 반환합니다.</td> -</tr> -</tbody></table> -<p><small><b>표 3.4: 산술 연산자</b></small> -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators:Comparison_Operators", "Core_JavaScript_1.5_Guide:Operators:Bitwise_Operators") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_arithm\u00e9tiques", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_arytmetyczne" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/assignment_operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/assignment_operators/index.html deleted file mode 100644 index dbc284f12f..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/assignment_operators/index.html +++ /dev/null @@ -1,62 +0,0 @@ ---- -title: Assignment Operators -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators/Assignment_Operators ---- -<h3 id=".ED.95.A0.EB.8B.B9_.EC.97.B0.EC.82.B0.EC.9E.90" name=".ED.95.A0.EB.8B.B9_.EC.97.B0.EC.82.B0.EC.9E.90">할당 연산자</h3> -<p>할당 연산자는 왼쪽 피연산자에 오른쪽 피연산자의 값을 할당합니다. 가장 기본적인 할당 연산자에는 등호(=)가 있는데, 왼쪽 피연산자의 값을 오른쪽 연산자에 할당합니다. 즉, x = y 라고 하면 y의 값이 x에 할당되는 것입니다.</p> -<p>다른 할당 연산자는 다음 표에서 보듯이 표준연산을 약식으로 쓰는 것입니다.</p> -<table class="fullwidth-table"> - <tbody> - <tr> - <th>약식 연산자</th> - <th>의미</th> - </tr> - <tr> - <td>x += y</td> - <td>x = x + y</td> - </tr> - <tr> - <td>x -= y</td> - <td>x = x - y</td> - </tr> - <tr> - <td>x *= y</td> - <td>x = x * y</td> - </tr> - <tr> - <td>x /= y</td> - <td>x = x / y</td> - </tr> - <tr> - <td>x %= y</td> - <td>x = x % y</td> - </tr> - <tr> - <td>x <<= y</td> - <td>x = x << y</td> - </tr> - <tr> - <td>x >>= y</td> - <td>x = x >> y</td> - </tr> - <tr> - <td>x >>>= y</td> - <td>x = x >>> y</td> - </tr> - <tr> - <td>x &= y</td> - <td>x = x & y</td> - </tr> - <tr> - <td>x ^= y</td> - <td>x = x ^ y</td> - </tr> - <tr> - <td>x |= y</td> - <td>x = x | y</td> - </tr> - </tbody> -</table> -<p><small><b>표: 할당 연산자</b></small></p> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators", "Core_JavaScript_1.5_Guide:Operators:Comparison_Operators") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/bitwise_operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/bitwise_operators/index.html deleted file mode 100644 index 3aed13da65..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/bitwise_operators/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: Bitwise Operators -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Bitwise_Operators ---- -<p><br> -</p> -<h3 id=".EB.B9.84.ED.8A.B8_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EB.B9.84.ED.8A.B8_.EC.97.B0.EC.82.B0.EC.9E.90"> 비트 연산자 </h3> -<p>비트 연산자는 피연산자를 10진수나 16진수, 8진수로 다루지 않고 32개의 비트 집합으로 다룹니다. 예를 들어, 10진수 9는 2진수로 1001입니다. 비트 연산자는 2진수 표현으로 연산을 하지만 반환값은 JavaScript 표준 수 값으로 반환합니다. -</p><p>JavaScript의 비트 연산자를 다음 표에 요약했습니다. -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>연산자</th> -<th>사용법</th> -<th>설명</th> -</tr> -<tr> -<td>비트 AND</td> -<td><code>a & b</code></td> -<td>두 피연산자의 대응되는 비트가 모두 1이면 1을 반환.</td> -</tr> -<tr> -<td>비트 OR</td> -<td><code>a | b</code></td> -<td>두 피연산자의 대응되는 비트에서 둘 중 하나가 1이거나 모두 1인 경우 1을 반환.</td> -</tr> -<tr> -<td>비트 XOR</td> -<td><code>a ^ b</code></td> -<td>두 피연산자의 대응되는 비트에서 둘 중 하나가 1이고, 둘 다 1이 아닐 경우 1을 반환.</td> -</tr> -<tr> -<td>비트 NOT</td> -<td><code>~ a</code></td> -<td>피연산자의 비트를 뒤집음.</td> -</tr> -<tr> -<td>왼쪽으로 이동</td> -<td><code>a << b</code></td> -<td>a의 2진수 표현을 b 비트만큼 왼쪽으로 이동함. 오른쪽은 0으로 채움.</td> -</tr> -<tr> -<td>부호 비트로 채우는 오른쪽 이동</td> -<td><code>a >> b</code></td> -<td>a의 2진수 표현을 b 비트만큼 오른쪽으로 이동함. 오른쪽 남는 비트는 버림.</td> -</tr> -<tr> -<td>0으로 채우는 오른쪽 이동</td> -<td><code>a >>> b</code></td> -<td>a의 2진수 표현을 b 비트만큼 오른쪽으로 이동함. 오른쪽 남는 비트는 버리고, 왼쪽은 0으로 채움.</td> -</tr> -</tbody></table> -<p><small><b>표 3.5: 비트 연산자</b></small> -</p> -<h4 id=".EB.B9.84.ED.8A.B8_.EB.85.BC.EB.A6.AC_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EB.B9.84.ED.8A.B8_.EB.85.BC.EB.A6.AC_.EC.97.B0.EC.82.B0.EC.9E.90"> 비트 논리 연산자 </h4> -<p>개념적으로 비트 논리 연산자는 다음과 같이 동작합니다. -</p> -<ul><li> 피연산자는 32비트 정수로 변환되어 비트의 나열로 표현됩니다. -</li><li> 두 피연산자의 비트를 같은 위치에 있는 것 끼리 짝을 짓습니다. -</li><li> 짝 지어진 각각의 쌍에 대해서 연산자를 적용하여 결과를 만들어냅니다. -</li></ul> -<p>예를 들어, 9를 2진수로 쓰면 1001이고 15를 2진수로 표현하면 1111입니다. 두 값에 비트 연산을 적용하면 결과는 다음과 같습니다. -</p> -<ul><li> 15 & 9 yields 9 (1111 & 1001 = 1001) -</li><li> 15 | 9 yields 15 (1111 | 1001 = 1111) -</li><li> 15 ^ 9 yields 6 (1111 ^ 1001 = 0110) -</li></ul> -<h4 id=".EB.B9.84.ED.8A.B8_.EC.9D.B4.EB.8F.99_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EB.B9.84.ED.8A.B8_.EC.9D.B4.EB.8F.99_.EC.97.B0.EC.82.B0.EC.9E.90"> 비트 이동 연산자 </h4> -<p>비트 이동 연산자는 피연산자 두 개를 받습니다. 첫 번째는 이동하려는 수이고, 두 번째는 첫 번째 피연산자를 몇 비트나 이동시킬지 나타내는 비트 수입니다. 이동 방향은 사용된 연산자에 따라 다릅니다. -</p><p>이동 연산자는 피연산자를 32비트 정수로 변환하여 연산하고, 왼쪽 연산자와 같은 자료형으로 반환합니다. -</p><p>이동 연산자는 다음 표에 있습니다. -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>연산자</th> -<th>설명</th> -<th>예제</th> -</tr> -<tr> -<td><<<br> -(왼쪽 이동)</td> -<td>이 연산자는 첫 번째 피연산자의 비트를 지정된 수만큼 왼쪽으로 옮깁니다. 왼쪽으로 넘친 비트는 버립니다. 오른쪽 빈 자리는 0으로 채웁니다.</td> <td>9<<2는 36을 반환합니다. 1001을 왼쪽으로 2비트 이동하면 100100이 되고 이것은 36이기 때문입니다.</td> -</tr> -<tr> -<td>>><br> -(부호 비트로 채우는 오른쪽 이동)</td> -<td>이 연산자는 첫 번째 피연산자의 비트를 지정된 수 만큼 오른쪽으로 옮깁니다. 오른쪽으로 넘친 비트는 버립니다. 왼쪽 빈 자리는 원래 가장 왼쪽에 있던 비트 값으로 채웁니다.</td> -<td>9>>2는 2를 반환합니다. 1001을 2비트 오른쪽으로 이동하면 10이 되는데 이것은 2이기 때문입니다. 비슷하게 -9>>2는 -3을 반환하는데, 부호가 유지되기 때문입니다.</td> -</tr> -<tr> -<td>>>><br> -(0으로 채우는 오른쪽 이동)</td> -<td>이 연산자는 첫 번째 피연산자의 비트를 지정된 수 만큼 오른쪽으로 옮깁니다. 오른쪽으로 넘친 비트는 버립니다. 왼쪽 빈 자리는 0으로 채웁니다.</td> -<td>19>>>2는 4를 반환합니다. 10011을 2비트 오른쪽으로 이동하면 100이 되기 때문입니다. 음수가 아닌 수에 대해서는 0을 채우는 오른쪽 이동이나 부호 비트로 채우는 오른쪽 이동이 똑같은 결과를 반환합니다.</td> -</tr> -</tbody></table> -<p><small><b>표 3.6: 비트 이동 연산자</b></small> -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators:Arithmetic_Operators", "Core_JavaScript_1.5_Guide:Operators:Logical_Operators") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_bit-\u00e0-bit", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_bitowe" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/index.html deleted file mode 100644 index 53b8e67492..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/index.html +++ /dev/null @@ -1,108 +0,0 @@ ---- -title: Operators -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators ---- -<h3 id=".EC.97.B0.EC.82.B0.EC.9E.90" name=".EC.97.B0.EC.82.B0.EC.9E.90"> 연산자 </h3> -<p>JavaScript에는 다음과 같은 연산자 타입이 있습니다. 이 섹션은 연산자에 대해 기술하고 연산자 우선순위에 대한 정보를 제공합니다. -</p> -<ul><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/Assignment_Operators">할당 연산자</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/Comparison_Operators">비교 연산자</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators">산술 연산자</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators">비트 연산자</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/Logical_Operators">논리 연산자</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/String_Operators">문자열 연산자</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Operators/Special_Operators">특수 연산자</a> -</li></ul> -<p>JavaScript는 이항연산자와 단항연산자를 모두 사용할 수 있습니다. 이항연산자는 두개의 피연산자(operand)를 가지며, 하나의 피연산자는 연산자 앞에 나머지 하나는 뒤에 위치합니다: -</p> -<pre>operand1 operator operand2 -</pre> -<p>예를 들자면, <code>3+4</code> 혹은 <code>x*y</code>와 같은 것입니다. -</p><p>단항연산자는 연산자 앞 혹은 뒤쪽에 하나의 피연산자만 있으면 됩니다: -</p> -<pre>operator operand -</pre> -<p>혹은 -</p> -<pre>operand operator -</pre> -<p>예를 들자면, <code>x++</code> 혹은 <code>++x</code>와 같은 것입니다. -</p><p>덧붙여, JavaScript는 한개의 삼항연산자, 조건 연산자를 가지고 있습니다. 삼항 연산자는 세개의 피연산자가 필요합니다. -</p> -<h4 id=".EC.97.B0.EC.82.B0.EC.9E.90_.EC.9A.B0.EC.84.A0.EC.88.9C.EC.9C.84" name=".EC.97.B0.EC.82.B0.EC.9E.90_.EC.9A.B0.EC.84.A0.EC.88.9C.EC.9C.84"> 연산자 우선순위 </h4> -<p><small><i><a>관련된 논의</a>에 따라서, 아래의 표는 우선순위 순으로 <b>내림차순</b> 정렬되었습니다.</i></small> -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>연산자 타입</th> -<th>사용하는 연산자</th> -</tr> -<tr> -<td>멤버 </td> -<td>. []</td> -</tr> -<tr> -<td>호출 / 인스턴스 생성 </td> -<td>() new</td> -</tr> -<tr> -<td>부정/증감 </td> -<td>! ~ - + ++ -- typeof void delete</td> -</tr> -<tr> -<td>곱하기/나누기 </td> -<td>* / %</td> -</tr> -<tr> -<td>더하기/빼기 </td> -<td>+ -</td> -</tr> -<tr> -<td>비트 이동 </td> -<td><< >> >>></td> -</tr> -<tr> -<td>관계 </td> -<td>< <= > >= in instanceof</td> -</tr> -<tr> -<td>같음 </td> -<td>== != === !==</td> -</tr> -<tr> -<td>비트연산-and </td> -<td>&</td> -</tr> -<tr> -<td>비트연산-xor </td> -<td>^</td> -</tr> -<tr> -<td>비트연산-or </td> -<td>|</td> -</tr> -<tr> -<td>논리연산-and </td> -<td>&&</td> -</tr> -<tr> -<td>논리연산-or </td> -<td>||</td> -</tr> -<tr> -<td>조건 </td> -<td>?:</td> -</tr> -<tr> -<td>할당 </td> -<td>= += -= *= /= %= <<= >>= >>>= &= ^= |=</td> -</tr> -<tr> -<td>컴마</td> -<td>,</td> -</tr> -</tbody></table> -<p><small><b>표: 연산자 우선순위</b></small> -</p><p>이 표의 보다 자세한 버전은 <a href="ko/Core_JavaScript_1.5_Reference/Operators/Operator_Precedence#Table">레퍼런스 섹션</a>에 있는 각 연산자별 상세한 추가 설명 링크를 참고하세요. -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Expressions", "Core_JavaScript_1.5_Guide:Operators:Assignment_Operators") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs", "ja": "ja/Core_JavaScript_1.5_Guide/Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/logical_operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/logical_operators/index.html deleted file mode 100644 index edf5f640a5..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/logical_operators/index.html +++ /dev/null @@ -1,69 +0,0 @@ ---- -title: Logical Operators -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators/Logical_Operators -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Logical_Operators ---- -<h3 id=".EB.85.BC.EB.A6.AC_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EB.85.BC.EB.A6.AC_.EC.97.B0.EC.82.B0.EC.9E.90"> 논리 연산자 </h3> -<p>논리 연산자는 주로 불리언(논리적) 값과 함께 사용됩니다. 그때 논리 연산자는 불리언 값을 반환합니다. 그러나 &&와 || 연산자는 실제로는 피연산자 중에 하나의 값을 반환하기 때문에, 이 연산자가 불리언 값이 아닌 값과 함께 사용되면 불리언 값이 아닌 값을 반환할 것입니다. 다음 표에 논리 연산자에 대해서 설명했습니다. -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>연산자</th> -<th>사용법</th> -<th>설명</th> -</tr> -<tr> -<td>&&</td> -<td>expr1 && expr2</td> -<td>(논리적 AND) expr1이 false로 변환될 수 있으면 expr1을 반환하고, 그렇지 않으면 expr2를 반환합니다. 그러므로 불리언 값과 같이 사용하면 피연산자 둘 모두가 true일 때 &&는 true를 반환하고 그렇지 않을 때는 false를 반환합니다.</td> -</tr> -<tr> -<td>||</td> -<td>expr1 || expr2</td> -<td>(논리적 OR) expr1이 true로 변환될 수 있으면 expr1을 반환하고 그렇지 않으면 expr2를 반환합니다. 그러므로 불리언 값과 같이 사용하면 ||는 피연산자 중에서 하나만 true이면 true를 반환합니다. 둘 다 false이면 false를 반환합니다.</td> -</tr> -<tr> -<td>!</td> -<td>!expr</td> -<td>(논리적 NOT) 피연산자가 true로 변환될 수 있으면 false를 반환합니다. 그렇지 않으면 true를 반환합니다.</td> -</tr> -</tbody></table> -<p><small><b>표 3.7: 논리 연산자</b></small> -</p><p>false로 변환될 수 있는 표현식은 null, 0, 빈 문자열(""), undefined로 평가될 수 있는 표현식들입니다. -</p><p>다음 코드는 && 연산자를 사용하는 예를 보여줍니다. -</p> -<pre>a1=true && true // t && t returns true -a2=true && false // t && f returns false -a3=false && true // f && t returns false -a4=false && (3 == 4) // f && f returns false -a5="Cat" && "Dog" // t && t returns Dog -a6=false && "Cat" // f && t returns false -a7="Cat" && false // t && f returns false -</pre> -<p>다음 코드는 || 연산자를 사용하는 예를 보여줍니다. -</p> -<pre>o1=true || true // t || t returns true -o2=false || true // f || t returns true -o3=true || false // t || f returns true -o4=false || (3 == 4) // f || f returns false -o5="Cat" || "Dog" // t || t returns Cat -o6=false || "Cat" // f || t returns Cat -o7="Cat" || false // t || f returns Cat -</pre> -<p>다음 코드는 ! 연산자를 사용하는 예를 보여줍니다. -</p> -<pre>n1=!true // !t returns false -n2=!false // !f returns true -n3=!"Cat" // !t returns false -</pre> -<h4 id=".EB.8B.A8.EC.B6.95_.ED.8F.89.EA.B0.80" name=".EB.8B.A8.EC.B6.95_.ED.8F.89.EA.B0.80"> 단축 평가 </h4> -<p>논리 표현식이 왼쪽부터 오른쪽으로 평가되기 때문에 다음 규칙을 이용해서 "단축(short-circuit)" 평가를 할 수 있습니다. -</p> -<ul><li> <code>false</code> && <i>아무 표현식</i>은 false로 단축 평가 됩니다. -</li><li> <code>true</code> || <i>아무 표현식</i>은 true로 단축 평가 됩니다. -</li></ul> -<p>이 규칙을 따라 평가를 수행한다고 해서 피연산자를 모두 평가할 때와 결과가 달라지지 않습니다. <i>아무 표현식</i> 부분은 평가되지 않기 때문에 아무런 부수 효과(side effect)도 일어나지 않는다는 것에 주의하십시오. -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators:Bitwise_Operators", "Core_JavaScript_1.5_Guide:Operators:String_Operators") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_logiques", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_logiczne" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/special_operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/special_operators/index.html deleted file mode 100644 index f238901cab..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/special_operators/index.html +++ /dev/null @@ -1,229 +0,0 @@ ---- -title: Special Operators -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators/Special_Operators -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Special_Operators ---- -<h3 id=".ED.8A.B9.EC.88.98_.EC.97.B0.EC.82.B0.EC.9E.90" name=".ED.8A.B9.EC.88.98_.EC.97.B0.EC.82.B0.EC.9E.90"> 특수 연산자 </h3> -<p>JavaScript 다음과 같은 특별한 연산자를 제공합니다. -</p> -<ul><li> {{ Anch("조건 연산자") }} -</li><li> {{ Anch("쉼표 연산자") }} -</li><li> {{ Anch("delete") }} -</li><li> {{ Anch("in") }} -</li><li> {{ Anch("instanceof") }} -</li><li> {{ Anch("new") }} -</li><li> {{ Anch("this") }} -</li><li> {{ Anch("typeof") }} -</li><li> {{ Anch("void") }} -</li></ul> -<h4 id=".EC.A1.B0.EA.B1.B4_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EC.A1.B0.EA.B1.B4_.EC.97.B0.EC.82.B0.EC.9E.90"> 조건 연산자 </h4> -<p>조건 연산자는 JavaScript에서 유일하게 세 개의 피연산자를 사용하는 연산자입니다. 연산자는 조건에 따라 둘 중에 하나의 값을 가질 수 있습니다. 문법은 이렇습니다. -</p> -<pre>condition ? val1 : val2 -</pre> -<p><code>condition</code>이 true이면 연산자는 <code>val1</code>의 값을 갖습니다. 그렇지 않으면 <code>val2</code>의 값을 갖습니다. 다른 표준 연산자를 사용할 수 있는 곳이면 어디든지 조건 연산자를 사용할 수 있습니다. -</p> -<pre>status = (age >= 18) ? "adult" : "minor" -</pre> -<p>이 문장은 <code>age</code>가 18이거나 더 큰 경우에 <code>status</code> 변수에 "adult"라는 값을 할당합니다. 그렇지 않으면 "minor"라는 값을 할당합니다. -</p> -<h4 id=".EC.89.BC.ED.91.9C_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EC.89.BC.ED.91.9C_.EC.97.B0.EC.82.B0.EC.9E.90"> 쉼표 연산자 </h4> -<p>쉼표 연산자(,)는 단순히 피연산자 둘을 모두 평가하고 두 번째 피연산자의 값을 반환하는 연산자입니다. 이 연산자는 주로 <code>for</code> 반복문에서 변수 여러 개가 매번 업데이트 되게 하는데 쓰입니다. -</p><p>예를 들어 <code>a</code>가 각각 10줄의 원소를 가지는 2차원 배열일 때, 다음 코드에서는 변수 두 개를 한 번에 바꾸기 위해서 쉼표 연산자를 사용하고 있습니다. 이 코드는 배열의 대각선 원소를 출력합니다. -</p> -<pre>for (var i=0, j=9; i <= 9; i++, j--) - document.writeln("a["+i+"]["+j+"]= " + a[i][j]) -</pre> -<h4 id="delete" name="delete"> delete </h4> -<p>delete는 개체(object), 개체의 속성(property), 배열의 특정 인덱스에 있는 원소(element)를 지우는 연산자입니다. 문법은 이렇습니다. -</p> -<pre>delete objectName -delete objectName.property -delete objectName[index] -delete property // with 문장 안에서만 유효합니다 -</pre> -<p><code>objectName</code>은 개체 이름이고, <code>property</code>는 개체에 존재하는 속성이고, <code>index</code>는 배열의 원소 위치를 나타내는 정수입니다. -</p><p>네 번째 형식은 개체의 속성을 지우는 코드인데, <code>with</code> 문장 안에서만 사용할 수 있습니다. -</p><p>암시적으로 선언된 변수를 지울 때는 <code>delete</code> 연산자를 사용할 수 있지만 <code>var</code> 문장을 이용해서 선언된 변수는 지울 수 없습니다. -</p><p><code>delete</code> 연산자 실행이 성공하면, 속성이나 원소가 <code>undefined</code>로 설정됩니다. <code>delete</code> 연산자는 실행이 가능하면 true를 반환하고, 불가능하면 false를 반환합니다. -</p> -<pre>x=42 -var y= 43 -myobj=new Number() -myobj.h=4 // h라는 속성을 만듭니다 -delete x // returns true (암시적으로 선언된 변수는 지울 수 있습니다) -delete y // returns false (var로 선언한 변수는 지울 수 없습니다) -delete Math.PI // returns false (미리 정의된 속성은 지울 수 없습니다) -delete myobj.h // returns true (사용자 정의 속성은 지울 수 있습니다) -delete myobj // returns true (암시적으로 선언되었으므로 지울 수 있습니다) -</pre> -<p><b>배열의 원소를 지우기</b><br> -배열의 원소를 지울 때, 배열의 길이에는 변화가 없습니다. 예를 들어, a{{ mediawiki.external(3) }}, a{{ mediawiki.external(4) }}를 지우더라도 a{{ mediawiki.external(4) }}와 a{{ mediawiki.external(3) }}은 여전히 정의되지 않습니다. -</p><p><code>delete</code> 연산자가 배열 원소를 제거할 때 원소는 더이상 배열에 존재하지 않습니다. 아래 예제에서 trees{{ mediawiki.external(3) }}은 <code>delete</code>로 제거되었습니다. -</p> -<pre>trees=new Array("redwood","bay","cedar","oak","maple") -delete trees[3] -if (3 in trees) { - // 이 블록은 실행되지 않습니다. -} -</pre> -<p>배열 원소가 존재하긴 하지만 정의되지 않은 값을 가지도록 하고 싶다면 <code>delete</code> 연산자 대신 <code>undefined</code> 키워드를 사용하십시오. 다음 예제에서 <code>trees{{ mediawiki.external(3) }}</code>에 <code>undefined</code> 값을 할당했지만 배열 요소는 여전히 존재합니다. -</p> -<pre>trees=new Array("redwood","bay","cedar","oak","maple") -trees[3]=undefined -if (3 in trees) { - // 이 블록은 실행됩니다. -} -</pre> -<h4 id="in" name="in"> in </h4> -<p><code>in</code> 연산자는 지정된 속성이 지정된 개체에 있으면 true를 반환합니다. 문법은 이렇습니다. -</p> -<pre>propNameOrNumber in objectName -</pre> -<p><code>propNameOrNumber</code>은 속성 이름을 나타내는 문자열이나 배열 인덱스를 나타내는 수이고, <code>objectName</code>은 개체 이름입니다. -</p><p>다음 예제는 <code>in</code> 연산자의 몇 가지 사용법을 보여줍니다. -</p> -<pre>// 배열 -trees=new Array("redwood","bay","cedar","oak","maple") -0 in trees // returns true -3 in trees // returns true -6 in trees // returns false -"bay" in trees // returns false (원하는 인덱스를 지정해야 하는데, - // 그 인덱스에 있는 값을 지정하면 안됩니다.) -"length" in trees // returns true (length는 배열의 속성입니다.) - -// 미리 정의된 개체 -"PI" in Math // returns true -myString=new String("coral") -"length" in myString // returns true - -// 사용자 개체 -mycar = {make:"Honda",model:"Accord",year:1998} -"make" in mycar // returns true -"model" in mycar // returns true -</pre> -<h4 id="instanceof" name="instanceof"> instanceof </h4> -<p><code>instanceof</code>는 지정된 개체가 지정된 개체 형식이면 true를 반환합니다. 문법은 이렇습니다. -</p> -<pre>objectName instanceof objectType -</pre> -<p><code>objectName</code>은 <code>objectType</code>과 비교할 개체의 이름이고, <code>objectType</code>은 개체 형식으로 <code>Date</code>나 <code>Array</code> 같은 것입니다. -</p><p>실행중에 개체의 형식을 알고 싶으면 <code>instanceof</code>를 사용하면 됩니다. 예를 들어 예외를 처리할 때, 발생한 예외의 형식에 따라 서로 다른 예외 처리 코드를 실행할 수 있습니다. -</p><p>다음 코드에서 <code>theDay</code>가 <code>Date</code> 개체인지 결정하기 위해서 <code>instanceof</code>를 사용합니다. <code>theDay</code>는 <code>Date</code> 개체이기 때문에 <code>if</code>문 안에 있는 문장이 실행됩니다. -</p> -<pre>theDay=new Date(1995, 12, 17) -if (theDay instanceof Date) { - // 실행할 문장 -} -</pre> -<h4 id="new" name="new"> new </h4> -<p>사용자 정의 개체 형식이나 <code>Array, Boolean, Date, Function, Image, Number, Object, Option, RegExp, String</code> 같이 미리 정의된 개체 형식의 인스턴스를 만들 때 <code>new</code> 연산자를 사용합니다. 서버에서는 <code>DbPool, Lock, File, SendMail</code> 등을 만들 때 사용할 수 있습니다. <code>new</code>는 다음과 같이 사용합니다. -</p> -<pre>objectName = new objectType ( param1 [,param2] ...[,paramN] ) -</pre> -<p><a href="ko/Core_JavaScript_1.5_Guide/Creating_New_Objects/Using_Object_Initializers">개체 초기화 지정자 사용하기</a>에 설명한 것처럼 개체 초기화 지정자를 이용해서 개체를 만들 수도 있습니다. -</p><p>더 많은 정보를 얻으려면 JavaScript 레퍼런스의 <a href="ko/Core_JavaScript_1.5_Reference/Operators/Special_Operators/new_Operator">new 연산자</a> 페이지를 보시기 바랍니다. -</p> -<h4 id="this" name="this"> this </h4> -<p>현재 개체를 참조할 때 <code>this</code> 키워드를 사용합니다. 일반적으로 <code>this</code>는 메소드를 호출하는 개체를 참조합니다. 다음과 같이 사용하면 됩니다. -</p> -<pre>this[.propertyName] -</pre> -<p><b>예제 1.</b><br> -개체의 <code>value</code> 속성이 높거나 낮은 값을 가지는지 검증하는 <code>validate</code>라는 함수가 있다고 가정합시다. -</p> -<pre>function validate(obj, lowval, hival) { - if ((obj.value < lowval) || (obj.value > hival)) - alert("Invalid Value!") -} -</pre> -<p>이제 우리는 폼의 각 요소의 <code>onChange</code> 이벤트 핸들러에서 <code>validate</code> 함수를 호출하면서, <code>this</code>를 이용하여 스스로를 함수에 전달할 수 있습니다. -</p> -<pre><B>Enter a number between 18 and 99:</B> -<INPUT TYPE = "text" NAME = "age" SIZE = 3 - onChange="validate(this, 18, 99)"> -</pre> -<p><b>예제 2.</b><br> -<code>form</code> 속성과 결합되면, <code>this</code>는 현재 개체가 포함된 폼을 참조할 수 있습니다. 다음 예제에서 <code>myForm</code> 폼은 <code>Text</code> 개체와 버튼을 포함하고 있습니다. 사용자가 버튼을 클릭하면 <code>Text</code> 개체의 값이 폼 이름으로 설정됩니다. 버튼의 <code>onClick</code> 이벤트 핸들러는 부모 폼인 <code>myForm</code>을 참조하기 위해서 <code>this.form</code>을 사용하고 있습니다. -</p> -<pre><FORM NAME="myForm"> -Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga"> -<P> -<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name" - onClick="this.form.text1.value=this.form.name"> -</FORM> -</pre> -<h4 id="typeof" name="typeof"> typeof </h4> -<p><code>typeof</code> 연산자는 둘 중 한 가지 방법으로 사용할 수 있습니다. -</p> -<pre>1. typeof operand -2. typeof (operand) -</pre> -<p><code>typeof</code> 연산자는 피연산자의 평가되지 않은 형식을 나타내는 문자열을 반환합니다. <code>피연산자</code>는 string, variable, keyword, object 등의 타입을 반환하게 됩니다. 괄호는 선택적입니다. -</p><p>우리가 이런 변수를 정의했다고 해봅시다. -</p> -<pre>var myFun = new Function("5+2") -var shape="round" -var size=1 -var today=new Date() -</pre> -<p><code>typeof</code>는 이 변수들에 대해서 다음과 같은 결과를 반환할 것입니다. -</p> -<pre>typeof myFun is function -typeof shape is string -typeof size is number -typeof today is object -typeof dontExist is undefined -</pre> -<p><code>true</code>와 <code>null</code> 키워드에 대해서 <code>typeof</code> 연산자는 다음과 같은 결과를 반환합니다. -</p> -<pre>typeof true is boolean -typeof null is object -</pre> -<p>수와 문자열에 대해서 <code>typeof</code> 연산자는 다음과 같은 결과를 반환합니다. -</p> -<pre>typeof 62 is number -typeof 'Hello world' is string -</pre> -<p>속성 값에 대해서 <code>typeof</code> 연산자는 속성이 포함하고 있는 값의 형식을 반환합니다. -</p> -<pre>typeof document.lastModified is string -typeof window.length is number -typeof Math.LN2 is number -</pre> -<p>메소드와 함수에 사용하면 <code>typeof</code> 연산자는 다음과 같은 결과를 반환합니다. -</p> -<pre>typeof blur is function -typeof eval is function -typeof parseInt is function -typeof shape.split is function -</pre> -<p>미리 정의된 개체들에 대해서 <code>typeof</code> 연산자는 다음과 같은 결과를 반환합니다. -</p> -<pre>typeof Date is function -typeof Function is function -typeof Math is function -typeof Option is function -typeof String is function -</pre> -<h4 id="void" name="void"> void </h4> -<p><code>void</code> 연산자는 다음과 같이 사용할 수 있습니다. -</p> -<pre>1. void (expression) -2. void expression -</pre> -<p><code>void</code> 연산자는 표현식이 값을 반환하지 않으면서 평가되어야 한다고 지정하는데 사용됩니다. <code>expression</code>은 평가하려는 JavaScript 표현식입니다. 표현식을 감싸는 괄호는 선택적이지만 사용하는 쪽이 더 좋은 스타일입니다. -</p><p>표현식을 하이퍼텍스트 링크로 지정하기 위해서 <code>void</code> 연산자를 사용할 수 있습니다. 표현식이 평가되기는 하지만 현재 문서 대신 로드되지는 않습니다. -</p><p>아래 코드는 사용자가 클릭할 때 아무 동작도 하지 않는 하이퍼텍스트 링크를 만듭니다. 사용자가 링크를 클릭하면 <code>void(0)</code>는 정의되지 않은 것(undefined)으로 평가되고 JavaScript에서 아무런 효과가 없습니다. -</p> -<pre><A HREF="javascript:void(0)">Click here to do nothing</A> -</pre> -<p>다음 코드는 클릭하면 폼을 제출하는 하이퍼텍스트 링크를 만듭니다. -</p> -<pre><A HREF="javascript:void(document.form.submit())"> -Click here to submit</A> -</pre> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators:String_Operators", "Core_JavaScript_1.5_Guide:Creating_a_Regular_Expression") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_sp\u00e9ciaux", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_specjalne" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/string_operators/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/string_operators/index.html deleted file mode 100644 index fc39b5a34f..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/operators/string_operators/index.html +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: String Operators -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Operators/String_Operators -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/String_Operators ---- -<h4 id=".EB.AC.B8.EC.9E.90.EC.97.B4_.EC.97.B0.EC.82.B0.EC.9E.90" name=".EB.AC.B8.EC.9E.90.EC.97.B4_.EC.97.B0.EC.82.B0.EC.9E.90"> 문자열 연산자 </h4> -<p>문자열 값에 사용할 수 있는 비교 연산자 외에도 연결 연산자(+)가 있는데, 이 연산자는 두 문자열 값을 연결한 새로운 문자열 값을 반환합니다. 예를 들어, <code>"my " + "string"</code>는 <code>"my string"</code>라는 문자열을 반환합니다. -</p><p>축약된 할당 연산자인 += 또한 문자열 연결에 사용할 수 있습니다. 예를 들어 <code>mystring</code> 변수가 "alpha"라는 값을 가지고 있을 때, <code>mystring += "bet"</code>은 "alphabet"으로 평가되고, 그 값이 <code>mystring</code>에 할당됩니다. -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Operators:Logical_Operators", "Core_JavaScript_1.5_Guide:Operators:Special_Operators") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/String_Operators", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_li\u00e9s_aux_cha\u00eenes", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/String_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operacje_na_\u0142a\u0144cuchach" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/predefined_core_objects/array_object/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/predefined_core_objects/array_object/index.html deleted file mode 100644 index 1f6ef48f3a..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/predefined_core_objects/array_object/index.html +++ /dev/null @@ -1,133 +0,0 @@ ---- -title: Array Object -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Array_Object ---- -<h3 id="Array_.EA.B0.9C.EC.B2.B4" name="Array_.EA.B0.9C.EC.B2.B4">Array 개체</h3> -<p>JavaScript에는 명시적인 배열 자료형이 없습니다. 하지만 배열을 다루기 위해서 <code>Array</code> 개체와 그 개체의 메소드를 이용할 수 있습니다. <code>Array</code> 개체에는 다양한 방법으로 배열을 다루기 위한 메소드들이 있는데, 배열을 합치거나, 순서를 뒤집거나, 정렬하는 등의 작업을 할 수 있습니다. 배열 길이를 알 수 있는 속성과 정규 표현식에 사용할 수 있는 속성들이 있습니다. - <i> - 배열</i> - 은 이름이나 색인으로 참조할 수 있는 값들을 모아놓은, 값의 순서가 유지되는 집합입니다. 예를 들어, 우리는 고용 번호로 색인된 고용인의 이름을 담고 있는 <code>emp</code>라는 배열을 만들 수 있습니다. 이 때 <code>emp{{ mediawiki.external(1) }}</code>는 1번 고용인, <code>emp{{ mediawiki.external(2) }}</code> 2번 고용인이 되는 것입니다.</p> -<p> </p> -<h4 id=".EB.B0.B0.EC.97.B4_.EB.A7.8C.EB.93.A4.EA.B8.B0" name=".EB.B0.B0.EC.97.B4_.EB.A7.8C.EB.93.A4.EA.B8.B0">배열 만들기</h4> -<p><code>Array</code> 개체는 이렇게 만들 수 있습니다.</p> -<pre>1. arrayObjectName = new Array(element0, element1, ..., elementN) -2. arrayObjectName = new Array(arrayLength) -</pre> -<p><code>arrayObjectName</code>은 새 개체의 이름이거나 존재하는 다른 개체의 속성 이름입니다. <code>Array</code> 개체의 속성이나 메소드를 이용할 때는 arrayObjectName은 존재하는 <code>Array</code> 개체 이름이거나 존재하는 다른 개체의 속성입니다.</p> -<p><code>element0, element1, ..., elementN</code>는 배열의 원소(element)가 될 값들입니다. 이런 식으로 지정하면, 나열한 값들을 원소로 가지고, 길이는 값의 개수인 배열이 만들어집니다.</p> -<p><code>arrayLength</code>는 배열의 초기 길이입니다. 다음 코드는 원소 다섯 개를 가지는 배열을 만듭니다.</p> -<pre>billingMethod = new Array(5) -</pre> -<p>배열 상수값 또한 <code>Array</code> 개체입니다. 예를 들어, 다음과 같은 상수값은 <code>Array</code> 개체입니다. 배열 상수값에 대한 자세한 내용은 <a href="ko/Core_JavaScript_1.5_Guide/Literals#.EB.B0.B0.EC.97.B4_.EC.83.81.EC.88.98.EA.B0.92">배열 상수값</a>을 보시기 바랍니다.</p> -<pre>coffees = ["French Roast", "Columbian", "Kona"] -</pre> -<h4 id=".EB.B0.B0.EC.97.B4.EC.97.90_.EC.9B.90.EC.86.8C_.EB.84.A3.EA.B8.B0" name=".EB.B0.B0.EC.97.B4.EC.97.90_.EC.9B.90.EC.86.8C_.EB.84.A3.EA.B8.B0">배열에 원소 넣기</h4> -<p>원소에 값을 할당함으로써 배열에 값을 넣을 수 있습니다.</p> -<pre>emp[1] = "Casey Jones" -emp[2] = "Phil Lesh" -emp[3] = "August West" -</pre> -<p>배열을 만들 때 값을 넣을 수도 있습니다.</p> -<pre>myArray = new Array("Hello", myVar, 3.14159) -</pre> -<h4 id=".EB.B0.B0.EC.97.B4_.EC.9B.90.EC.86.8C_.EC.B0.B8.EC.A1.B0.ED.95.98.EA.B8.B0" name=".EB.B0.B0.EC.97.B4_.EC.9B.90.EC.86.8C_.EC.B0.B8.EC.A1.B0.ED.95.98.EA.B8.B0">배열 원소 참조하기</h4> -<p>배열 원소의 순서를 나타내는 숫자로 원소를 참조할 수 있습니다. 예를 들어 다음과 같은 배열을 만들었다고 해봅시다.</p> -<pre>myArray = new Array("Wind","Rain","Fire") -</pre> -<p>그러면 첫 번째 원소는 <code>myArray{{ mediawiki.external(0) }}</code>으로 참조할 수 있고, 두 번째 원소는 <code>myArray{{ mediawiki.external(1) }}</code>로 참조할 수 있습니다.</p> -<p>원소의 색인은 영(0)부터 시작하지만 배열 길이(예를 들면 <code>myArray.length</code>)는 배열의 원소 개수를 나타냅니다.</p> -<p> </p> -<h4 id="Array_.EA.B0.9C.EC.B2.B4.EC.9D.98_.EB.A9.94.EC.86.8C.EB.93.9C" name="Array_.EA.B0.9C.EC.B2.B4.EC.9D.98_.EB.A9.94.EC.86.8C.EB.93.9C">Array 개체의 메소드</h4> -<p><code>Array</code> 개체는 다음과 같은 메소드들을 가지고 있습니다.</p> -<ul> - <li><code>concat</code> 메소드는 두 배열을 합쳐서 새 배열 하나를 반환합니다.</li> -</ul> -<pre>myArray = new Array("1","2","3") -myArray = myArray.concat("a", "b", "c"); // myArray는 ["1", "2", "3", "a", "b", "c"]이 되었습니다. -</pre> -<ul> - <li><code>join(deliminator = ",")</code> 메소드는 배열의 모든 원소를 문자열로 바꿔서 하나의 문자열을 만들어줍니다.</li> -</ul> -<pre>myArray = new Array("Wind","Rain","Fire") -list = myArray.join(" - "); // list는 "Wind - Rain - Fire"입니다. -</pre> -<ul> - <li><code>pop</code> 메소드는 배열의 마지막 원소를 배열에서 제거하고 그 원소를 반환합니다.</li> -</ul> -<pre>myArray = new Array("1", "2", "3"); -last=myArray.pop(); // MyArray는 ["1", "2"], last = "3"이 되었습니다. -</pre> -<ul> - <li><code>push</code> 메소드는 하나 또는 그 이상의 원소를 배열 끝에 추가하고, 추가된 마지막 원소를 반환합니다.</li> -</ul> -<pre>myArray = new Array("1", "2"); -myArray.push("3"); // MyArray는 ["1", "2", "3"]이 되었습니다. -</pre> -<ul> - <li><code>reverse</code> 메소드는 원소의 순서를 뒤집어서 첫 번째 원소가 마지막 원소가 되고, 마지막 원소가 첫 번째 원소가 되도록 합니다.</li> -</ul> -<pre>myArray = new Array ("1", "2", "3"); -myArray.reverse(); // myArray = [ "3", "2", "1" ]이 되었습니다. -</pre> -<ul> - <li><code>shift</code> 메소드는 첫 번째 요소를 배열에서 제거하고, 그 원소를 반환합니다.</li> -</ul> -<pre>myArray = new Array ("1", "2", "3"); -first=myArray.shift(); // MyArray는 ["2", "3"], first는 "1"이 되었습니다. -</pre> -<ul> - <li><code>slice (start_index, upto_index)</code> 메소드는 배열의 일부분을 추출하여 새 배열을 반환합니다.</li> -</ul> -<pre>myArray = new Array ("a", "b", "c", "d", "e"); -myArray = myArray.slice(1,4); //색인 1부터 색인 4 바로 앞까지의 원소를 추출해서 [ "b", "c", "d" ]를 반환합니다. -</pre> -<ul> - <li><code>splice(index, count_to_remove, addelement1, addelement2, ...)</code> 메소드는 배열에 원소를 추가하거나 배열에서 원소를 제거합니다.</li> -</ul> -<pre>myArray = new Array ("1", "2", "3", "4", "5"); -myArray.splice(1,3,"a","b","c", "d"); // MyArray는 ["1", "a", "b", "c", "d", "5"]가 되었습니다. -// 이 코드는 색인 1(즉 "2")부터 원소 세 개를 제거하고, 그 자리에 원소를 추가합니다. -</pre> -<ul> - <li><code>sort</code> 메소드는 원소를 정렬합니다.</li> -</ul> -<pre>myArray = new Array("Wind","Rain","Fire") -myArray.sort(); // 배열을 정렬했으므로 myArrray = [ "Fire", "Rain", "Wind" ]가 되었습니다. -</pre> -<p><code>sort</code> 메소드에 배열을 어떻게 정렬할지 결정하는 콜백 함수를 전해줄 수 있습니다. 그 함수는 두 값을 비교해서 다음 셋 중 하나를 반환해야 합니다.</p> -<ul> - <li>정렬할 때 a가 b보다 작다면 -1(또는 임의의 음수)를 반환</li> - <li>정렬할 때 a가 b보다 크다면 1(또는 임의의 양수)를 반환</li> - <li>a와 b가 같으면 0을 반환</li> -</ul> -<p>예를 들어 다음 코드는 원소의 마지막 글자를 기준으로 배열을 정렬합니다.</p> -<pre>var sortFn = function(a,b){ - if (a[a.length - 1] < b[b.length - 1]) return -1; - if (a[a.length - 1] > b[b.length - 1]) return 1; - if (a[a.length - 1] == b[b.length - 1]) return 0; - } -myArray.sort(sortFn); // 배열을 정렬했으므로 myArray = ["Wind","Fire","Rain"]가 되었습니다. -</pre> -<ul> - <li><code>unshift</code> 메소드는 하나 또는 그 이상의 원소를 배열 앞에 추가하고 배열의 새 길이를 반환합니다.</li> -</ul> -<h4 id="2.EC.B0.A8.EC.9B.90_.EB.B0.B0.EC.97.B4" name="2.EC.B0.A8.EC.9B.90_.EB.B0.B0.EC.97.B4">2차원 배열</h4> -<p>다음 코드는 2차원 배열을 만듭니다.</p> -<pre>a = new Array(4) -for (i=0; i < 4; i++) { - a[i] = new Array(4) - for (j=0; j < 4; j++) { - a[i][j] = "["+i+","+j+"]" - } -} -</pre> -<p>바로 위 코드는 이런 배열을 만들어냅니다.</p> -<pre>Row 0:[0,0][0,1][0,2][0,3] -Row 1:[1,0][1,1][1,2][1,3] -Row 2:[2,0][2,1][2,2][2,3] -Row 3:[3,0][3,1][3,2][3,3] -</pre> -<h4 id=".EB.B0.B0.EC.97.B4.EA.B3.BC_.EC.A0.95.EA.B7.9C_.ED.91.9C.ED.98.84.EC.8B.9D" name=".EB.B0.B0.EC.97.B4.EA.B3.BC_.EC.A0.95.EA.B7.9C_.ED.91.9C.ED.98.84.EC.8B.9D">배열과 정규 표현식</h4> -<p>배열이 정규 표현식과 문자열을 매치한 결과로 생성되었을 때, 그 배열은 매치에 대한 정보를 제공하는 속성과 원소를 포함하고 있습니다. <code>RegExp.exec</code>, <code>String.match</code>, <code>String.split</code>의 반환 값은 배열입니다. 정규 표현식과 관련된 배열 사용에 대한 정보를 얻으려면 4장 <a href="ko/Core_JavaScript_1.5_Guide#.EC.A0.95.EA.B7.9C_.ED.91.9C.ED.98.84.EC.8B.9D">정규 표현식</a>을 보십시오.</p> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Predefined_Core_Objects", "Core_JavaScript_1.5_Guide:Predefined_Core_Objects:Boolean_Object") }}</p> diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/predefined_core_objects/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/predefined_core_objects/index.html deleted file mode 100644 index d8d0156dc2..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/predefined_core_objects/index.html +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: Predefined Core Objects -slug: >- - Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Predefined_Core_Objects -translation_of: Web/JavaScript/Guide -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Core_Objects ---- -<h3 id=".EB.AF.B8.EB.A6.AC_.EC.A0.95.EC.9D.98.EB.90.9C_.EA.B8.B0.EB.B3.B8_.EA.B0.9C.EC.B2.B4" name=".EB.AF.B8.EB.A6.AC_.EC.A0.95.EC.9D.98.EB.90.9C_.EA.B8.B0.EB.B3.B8_.EA.B0.9C.EC.B2.B4"> 미리 정의된 기본 개체 </h3> -<p>이 절에서는 기본 JavaScrip에 미리 정의된 개체에 대해서 설명하겠습니다. -</p> -<ul><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Array_Object">Array 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Boolean_Object">Boolean 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Date_Object">Date 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Function_Object">Function 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Math_Object">Math 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Number_Object">Number 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/RegExp_Object">RegExp 개체</a> -</li><li> <a href="ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/String_Object">String 개체</a> -</li></ul> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Creating_New_Objects:Deleting_Properties", "Core_JavaScript_1.5_Guide:Predefined_Core_Objects:Array_Object") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "fr": "fr/Guide_JavaScript_1.5/Objets_pr\u00e9d\u00e9finis", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Obiekty_predefiniowane" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/unicode/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/unicode/index.html deleted file mode 100644 index 9c97d9cf82..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/unicode/index.html +++ /dev/null @@ -1,110 +0,0 @@ ---- -title: Unicode -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Unicode -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Unicode ---- -<h3 id=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C" name=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C"> 유니코드 </h3> -<p>유니코드는 세계의 주요한 문자 언어를 교환하고 표현하기 위한 문자-코딩 표준입니다. 유니코드는 아메리카, 유럽, 중동, 아프리카, 인도, 아시아, 태평양 지역(Pacifica)의 언어를 포함하며 고문자와 기술 분야 기호들도 포함합니다. 유니코드는 공통적인 기술 분야, 수학 분야 기호 뿐만 아니라 여러 언어를 포함한 텍스트의 교환, 처리, 표현을 지원합니다. 유니코드는 나라마다 서로 다른 문자 표준으로 인해서 여러 언어를 포함했을 때 발생하는 국제화 문제를 해결할 수 있기를 희망합니다. 하지만 아직은 모든 현대 문자, 고대 문자를 지원하지는 못합니다. -</p><p>유니코드 문자 집합은 알려진 모든 인코딩을 위해 사용될 수 있습니다. 유니코드는 ASCII (American Standard Code for Information Interchange, 정보 교환을 위한 미국 표준 코드) 문자 집합을 본떠 만들어졌습니다. 각각의 문자에 숫자와 이름을 부여한 것입니다. 문자 인코딩은 문자의 정체성(identity)과 숫자 값(코드 위치)와 함께 숫자 값의 비트 표현을 명시합니다. 16비트 숫자 값(코드 값)은 U+0041처럼 접두어 U뒤에 16진수를 붙여서 표시합니다. 이 값의 유일한 이름은 LATIN CAPITAL LETTER A입니다. -</p><p><b>JavaScript 1.3 이전 버전은 유니코드를 지원하지 않습니다.</b> -</p> -<h4 id=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C.EC.99.80_ASCII_.EB.B0.8F_ISO_.EC.82.AC.EC.9D.B4.EC.9D.98_.ED.98.B8.ED.99.98.EC.84.B1" name=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C.EC.99.80_ASCII_.EB.B0.8F_ISO_.EC.82.AC.EC.9D.B4.EC.9D.98_.ED.98.B8.ED.99.98.EC.84.B1"> 유니코드와 ASCII 및 ISO 사이의 호환성 </h4> -<p>유니코드는 ISO 10646의 부분집합인 국제 표준 ISO/IEC 10646-1; 1993과 완벽하게 호환됩니다. -</p><p>몇몇 인코딩 표준(UTF-8, UTF-16, ISO UCS-2를 포함하는)들이 실제 비트 값으로 유니코드를 표현하기 위해 사용됩니다. -</p><p>UTF-8 인코딩은 ASCII 문자와 호환되며 많은 프로그램이 UTF-8을 지원합니다. 앞쪽 128개의 유니코드 문자는 ASCII 문자에 대응되며 같은 바이트 값을 가지고 있습니다. U+0020부터 U+007E 까지의 유니코드 문자는 ASCII 문자 0x20 부터 0x7E 까지와 동일합니다. 라틴 알파벳을 지원하고 7비트 문자 집합을 사용하는 ASCII와는 달리, UTF-8은 한 문자를 위해서 한 개부터 네 개 사이의 8진수(octet)를 사용합니다. ("8진수"는 바이트 또는 8비트를 의미합니다.) 이 방법으로 수백만개의 문자를 표현할 수 있습니다. 다른 인코딩 표준인 UTF-16은 유니코드 문자를 표현하기 위해 2바이트를 사용합니다. 이스케이프 시퀀스를 이용하여 UTF-16은 4바이트를 써서 모든 유니코드 범위를 표현합니다. ISO UCS-2 (Universal Character Set, 세계 문자 집합)은 2바이트를 사용합니다. -</p><p>JavaScript와 Navigator가 UTF-8/유니코드를 지원한다는 것은 우리가 비 라틴 문자와 국제화되고 지역화된 문자에다 특수한 기술 분야 기호까지 JavaScript 프로그램에 쓸 수 있다는 것을 의미합니다. 유니코드는 여러 언어를 포함한 텍스트를 인코딩할 수 있는 표준적인 방법을 제공합니다. UTF-8 인코딩이 ASCII와 호환되기 때문에, ASCII 문자를 프로그램에 사용할 수 있습니다. 우리는 JavaScript의 주석, 문자열 리터럴, 식별자(identifier), 정규 표현식에 비 ASCII 유니코드 문자를 쓸 수 있습니다. -</p> -<h4 id=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C_.EC.9D.B4.EC.8A.A4.EC.BC.80.EC.9D.B4.ED.94.84_.EC.8B.9C.ED.80.80.EC.8A.A4" name=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C_.EC.9D.B4.EC.8A.A4.EC.BC.80.EC.9D.B4.ED.94.84_.EC.8B.9C.ED.80.80.EC.8A.A4"> 유니코드 이스케이프 시퀀스 </h4> -<p>우리는 문자열 리터럴, 정규 표현식, 식별자에 유니코드 이스케이프 시퀀스를 사용할 수 있습니다. 이스케이프 시퀀스는 ASCII 문자 여섯 개로 이루어지는데, \u 뒤에 16진수를 표현하는 숫자 네 개가 붙은 모양입니다. 예를 들어 \u00A9는 저작권 기호를 나타냅니다. JavaScript에서 모든 유니코드 이스케이프 시퀀스는 문자 한 개로 인식됩니다. -</p><p>다음의 코드는 저작권 문자와 "Netscape Communications"라는 문자열을 반환합니다. -</p> -<pre>x="\u00A9 Netscape Communications"</pre> -<p>다음의 표는 자주 사용되는 특수 문자의 유니코드 값을 모은 것입니다. -</p> -<table class="fullwidth-table"> -<tbody><tr> -<th>분류</th> -<th>유니코드 값</th> -<th>이름</th> -<th>형식화된 이름(Format name)</th> -</tr> -<tr> -<td>공백 문자</td> -<td>\u0009</td> -<td>Tab</td> -<td><TAB></td> -</tr> -<tr> -<td> </td> -<td>\u000B</td> -<td>Vertical Tab</td> -<td><VT></td> -</tr> -<tr> -<td> </td> -<td>\u000C</td> -<td>Form Feed</td> -<td><FF></td> -</tr> -<tr> -<td> </td> -<td>\u0020</td> -<td>Space</td> -<td><SP></td> -</tr> -<tr> -<td>줄 끝 문자</td> -<td>\u000A</td> -<td>Line Feed</td> -<td><LF></td> -</tr> -<tr> -<td> </td> -<td>\u000D</td> -<td>Carriage Return</td> -<td><CR></td> -</tr> -<tr> -<td>그 외 유니코드 이스케이프 시퀀스</td> -<td>\u0008</td> -<td>Backspace</td> -<td><BS></td> -</tr> -<tr> -<td> </td> -<td>\u0009</td> -<td>Horizontal Tab</td> -<td><HT></td> -</tr> -<tr> -<td> </td> -<td>\u0022</td> -<td>Double Quote</td> -<td>"</td> -</tr> -<tr> -<td> </td> -<td>\u0027</td> -<td>Single Quote</td> -<td>'</td> -</tr> -<tr> -<td> </td> -<td>\u005C</td> <td>Backslash</td> -<td>\</td> -</tr> -</tbody></table> -<p><small><b>표 2.2: 특수 문자의 유니코드 값</b></small> -</p><p>JavaScript에서 유니코드 이스케이프 시퀀스는 Java와 다릅니다. JavaScript에서, 이스케이프 시퀀스가 특수 문자로 먼저 해석되지 않습니다. 예를 들어, 줄 끝 이스케이프 시퀀스가 문자열에 포함되어 있어도 함수에 의해 해석되기 전까지는 문자열을 자르지 않습니다. 주석에 포함된 이스케이프 시퀀스는 모두 무시됩니다. Java에서는 한 줄 주석에 이스케이프 시퀀스가 있으면 유니코드 문자로 해석됩니다. 문자열 리터럴에서 Java 컴파일러는 이스케이프 시퀀스를 먼저 해석합니다. 예를 들어 줄 끝 이스케이프 문자(즉 \u000A)가 Java에서 사용되면 문자열 리터럴을 끝나게 합니다. Java에서는 줄 끝 문자가 문자열 리터럴에 포함될 수 없으므로, 에러가 발생합니다. 문자열 리터럴에 개행 문자를 넣으려면 반드시 \n을 사용해야 합니다. JavaScript에서 이스케이프 시퀀스는 \n과 같은 방식으로 동작합니다. -</p> -<div class="note">참고: 긴 문자열을 변환하는 웹 프로그램 <a class="external" href="http://www.hot-tips.co.uk/useful/unicode_converter.HTML">Hot-Tips' Unicode Converter</a>, by Bob Foley.</div> -<h4 id="JavaScript_.ED.8C.8C.EC.9D.BC.EC.97.90.EC.84.9C_.EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C_.EB.AC.B8.EC.9E.90" name="JavaScript_.ED.8C.8C.EC.9D.BC.EC.97.90.EC.84.9C_.EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C_.EB.AC.B8.EC.9E.90"> JavaScript 파일에서 유니코드 문자 </h4> -<p>초기 버전의 <a href="ko/Gecko">Gecko</a>는 XUL에서 로드되는 JavaScript 파일의 인코딩이 Latin-1일 것이라고 가정했습니다. Gecko 1.8부터는 XUL 파일의 인코딩으로 부터 JavaScript 파일의 인코딩을 유추하도록 변경되었습니다. 더 많은 정보는 <a href="ko/International_characters_in_XUL_JavaScript">International characters in XUL JavaScript</a> 페이지를 참고하시기 바랍니다. -</p> -<h4 id=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C.EB.A1.9C_.EB.AC.B8.EC.9E.90_.ED.91.9C.EC.8B.9C.ED.95.98.EA.B8.B0" name=".EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C.EB.A1.9C_.EB.AC.B8.EC.9E.90_.ED.91.9C.EC.8B.9C.ED.95.98.EA.B8.B0"> 유니코드로 문자 표시하기 </h4> -<p>우리는 다른 언어나 기술 분야 기호를 표시하기 위해서 유니코드를 사용할 수 있습니다. 문자를 제대로 표시하기 위해서는 Mozilla Firefox나 Netscape 같은 클라이언트가 유니코드를 지원해야 합니다. 게다가 클라이언트에서 사용할 수 있는 적절한 유니코드 글꼴이 필요하고, 클라이언트 플랫폼이 유니코드를 지원해야 합니다. 종종 유니코드 글꼴이 모든 유니코드 문자를 표시하지 못하는 경우가 있습니다. Windows 95 같은 몇몇 플랫폼은 유니코드를 부분적으로만 지원합니다. -</p><p>비 ASCII 문자 입력을 받기 위해서는 클라이언트가 유니코드로 입력을 보내야 합니다. 표준 확장 키보드(standard enhanced keyborad)를 사용하면 클라이언트에서 유니코드가 지원하는 추가적인 문자를 쉽게 입력할 수 없습니다. 때때로 유니코드 문자를 입력하려면 유니코드 이스케이프를 사용하는 방법 밖에 없을 때도 있습니다. -</p><p>유니코드에 대한 더 많은 정보를 얻으려면 <a class="external" href="http://www.unicode.org/">유니코드 홈페이지</a>나 The Unicode Standard, Version 2.0, published by Addison-Wesley, 1996 를 보시기 바랍니다. -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Literals", "Core_JavaScript_1.5_Guide:Expressions") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Unicode", "fr": "fr/Guide_JavaScript_1.5/Unicode", "ja": "ja/Core_JavaScript_1.5_Guide/Unicode", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Unicode" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/values/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/values/index.html deleted file mode 100644 index e5c40d23bf..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/values/index.html +++ /dev/null @@ -1,40 +0,0 @@ ---- -title: Values -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Values -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Values ---- -<h3 id=".EA.B0.92" name=".EA.B0.92"> 값 </h3> -<p>JavaScript는 다음과 같은 값 형식을 인식합니다. -</p> -<ul><li> <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Number">수</a>, 42나 3.14159 -</li><li> <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">논리적(불리언)</a> 값, <code>true</code>와 <code>false</code> -</li><li> <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/String">문자열</a>, "안녕!" -</li><li> <code>null</code>, null 값을 나타내는 특별한 키워드. <code>null</code>은 또한 기본(primitive) 값이기도 합니다. JavaScript는 대소문자를 구분하므로, <code>null</code>은 <code>Null</code>이나 <code>NULL</code>과는 다릅니다. -</li><li> <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Properties/undefined">undefined</a></code>, 값이 정의되지 않은 최상위 속성. <code>undefined</code>도 기본(primitive) 값입니다. -</li></ul> -<p>이렇게 조금 적어보이는 값 형식 또는 "자료형"이지만 훌륭한 기능을 작성할 수 있습니다. 정수와 실수 사이에 엄격한 구분은 없습니다. JavaScript에는 명시적인 날짜 자료형은 없습니다. 하지만 <code><a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Date">Date</a></code> 개체를 이용하면 됩니다. -<a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Object">Object</a>와 <a href="ko/Core_JavaScript_1.5_Reference/Global_Objects/Function">함수</a>는 언어의 또다른 기초 요소입니다. 개체는 값을 포함할 수 있는 이름 붙은 어떤 것이라고 생각하면 되고, 함수는 프로그램이 수행할 수 있는 실행 절차라고 생각하면 됩니다. -</p> -<h4 id=".EC.9E.90.EB.A3.8C.ED.98.95_.EB.B3.80.ED.99.98" name=".EC.9E.90.EB.A3.8C.ED.98.95_.EB.B3.80.ED.99.98"> 자료형 변환 </h4> -<p>JavaScript는 동적 타입 언어입니다. 이 말은 변수를 선언할 때 타입을 지정하지 않아도 되고, 스크립트 실행중에 필요에 따라 자동으로 자료형이 바뀐다는 말입니다. 예를 들어 다음과 같이 변수를 선언할 수 있습니다. -</p> -<pre class="eval">var answer = 42 -</pre> -<p>그 후에 이 변수에 문자열 값을 할당할 수 있습니다. -</p> -<pre class="eval">answer = "Thanks for all the fish..." -</pre> -<p>JavaScript는 동적 타입 언어이기 때문에, 이렇게 대입하더라도 에러를 내지 않습니다. -</p><p>숫자와 문자열 값을 + 연산자로 계산하는 표현식에서, JavaScript는 숫자를 문자열로 변환합니다. 예를 들어 다음과 같은 문장을 생각해봅시다. -</p> -<pre class="eval">x = "The answer is " + 42 // returns "The answer is 42" -y = 42 + " is the answer" // returns "42 is the answer" -</pre> -<p>다른 연산자를 사용하는 문장에서는 숫자를 문자열로 변환하지 않습니다. -</p> -<pre class="eval">"37" - 7 // returns 30 -"37" + 7 // returns "377" -</pre> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:JavaScript_Overview", "Core_JavaScript_1.5_Guide:Variables") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Values", "fr": "fr/Guide_JavaScript_1.5/Valeurs", "ja": "ja/Core_JavaScript_1.5_Guide/Values", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Warto\u015bci" } ) }} diff --git a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/variables/index.html b/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/variables/index.html deleted file mode 100644 index c9260414d3..0000000000 --- a/files/ko/web/javascript/guide/obsolete_pages/core_javascript_1.5_guide/variables/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: Variables -slug: Web/JavaScript/Guide/Obsolete_Pages/Core_JavaScript_1.5_Guide/Variables -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Variables ---- -<h3 id=".EB.B3.80.EC.88.98" name=".EB.B3.80.EC.88.98"> 변수 </h3> -<p>우리는 프로그램 내에서 값에 이름을 부여하기 위해서 변수를 사용할 수 있습니다. 변수의 이름은 "식별자(identifier)"라고 불리며, 몇 가지 규칙을 따라야 합니다. -</p><p>JavaScript 의 식별자는 문자(letter)나 밑줄(_)이나 달러 기호($)로 시작해야 합니다. 그 뒤에는 숫자(0-9)도 올 수 있습니다. JavaScript는 대소문자를 구별하기 때문에, 문자는 대문자 "A"부터 "Z"까지와 소문자 "a"부터 "z"까지를 사용할 수 있습니다. -</p><p>JavaScript 1.5부터, 식별자에 å나 ü같은 ISO 8859-1이나 유니코드 문자를 사용할 수 있습니다. 또한 <a href="ko/Core_JavaScript_1.5_Guide/Unicode#.EC.9C.A0.EB.8B.88.EC.BD.94.EB.93.9C_.EC.9D.B4.EC.8A.A4.EC.BC.80.EC.9D.B4.ED.94.84_.EC.8B.9C.ED.80.80.EC.8A.A4">유니코드 이스케이프 시퀀스</a> 페이지에 나열된 \uXXXX 형식 유니코드 이스케이프 시퀀스를 식별자에 쓸 수도 있습니다. -</p><p>규칙에 맞는 이름 몇 가지는 이런 것입니다. <code>Number_hits</code>, <code>temp99</code>, <code>_name</code>. -</p> -<h4 id=".EB.B3.80.EC.88.98_.EC.84.A0.EC.96.B8" name=".EB.B3.80.EC.88.98_.EC.84.A0.EC.96.B8"> 변수 선언 </h4> -<p>변수를 선언하는 방법에는 두 가지가 있습니다. -</p> -<ul><li> <a href="ko/Core_JavaScript_1.5_Reference/Statements/var">var</a> 키워드를 이용하는 방법. 예를 들면 <code>var x = 42</code> 같은 식입니다. 이 문법은 <a href="#.EB.B3.80.EC.88.98_.EB.B2.94.EC.9C.84">지역, 전역</a> 변수를 선언하는데 모두 사용할 수 있습니다. -</li><li> 그냥 값을 대입하는 방법. <code>x = 42</code> 같은 식입니다. 이 방법은 항상 <a href="#.EC.A0.84.EC.97.AD_.EB.B3.80.EC.88.98">전역 변수</a>를 선언하고, strict JavaScript 경고를 냅니다. 이 방법은 절대 사용하지 맙시다. -</li></ul> -<h4 id=".EB.B3.80.EC.88.98.EB.A5.BC_.ED.8F.89.EA.B0.80.ED.95.98.EA.B8.B0.28Evaluating.29" name=".EB.B3.80.EC.88.98.EB.A5.BC_.ED.8F.89.EA.B0.80.ED.95.98.EA.B8.B0.28Evaluating.29"> 변수를 평가하기(Evaluating) </h4> -<p>초기값을 지정하지 않고 <code>var</code> 문장을 이용해서 선언한 변수는 <a href="ko/Core_JavaScript_1.5_Reference/Global_Properties/undefined">undefined</a>라는 값을 갖습니다. -</p><p>선언하지 않은 변수에 접근하려고 하면 ReferenceError 예외가 발생합니다. -</p> -<pre class="eval">var a; -print("The value of a is " + a); // prints "The value of a is undefined" -print("The value of b is " + b); // throws ReferenceError exception -</pre> -<p>변수가 값을 갖고 있는지 결정하기 위해서 <code>undefined</code>를 사용할 수 있습니다. 다음 코드에서 <code>input</code>에는 값을 할당하지 않아서 <code><a href="ko/Core_JavaScript_1.5_Reference/Statements/if...else">if</a></code>문은 <code>true</code>로 평가됩니다. -</p> -<pre>var input; -if(input === undefined){ - doThis(); -} else { - doThat(); -}</pre> -<p><span class="comment">Not sure how the following is related to "Variables" section</span> -<code>undefined</code>값을 참/거짓을 판별하는 구문에 쓰면 <code>false</code>로 평가됩니다. 예를 들어 다음 코드에서는 <code>myArray</code>의 원소가 정의되지 않았기 때문에 <code>myFunction</code> 함수가 실행됩니다. -</p> -<pre>myArray=new Array() -if (!myArray[0]) - myFunction();</pre> -<p>숫자가 필요한 문맥에서 null 변수를 평가하면 null 값은 0으로 평가되고, 참/거짓이 필요한 문맥에서는 false로 평가됩니다. -When you evaluate a null variable, the null value behaves as 0 in numeric contexts and as false in boolean contexts. For example: -</p> -<pre>var n = null; -n * 32; //0을 반환합니다</pre> -<h4 id=".EB.B3.80.EC.88.98_.EB.B2.94.EC.9C.84" name=".EB.B3.80.EC.88.98_.EB.B2.94.EC.9C.84"> 변수 범위 </h4> -<p>함 수 외부에서 선언한 변수는 "전역(global)" 변수라고 부릅니다. 그 변수는 현재 문서의 모든 코드에서 접근할 수 있기 때문입니다. 함수 안에서 선언한 변수는 "지역(local)" 변수라고 부릅니다. 그 변수는 함수 안에서만 접근할 수 있기 때문입니다. -</p><p>JavaScript에는 <a href="ko/Core_JavaScript_1.5_Guide/Block_Statement#.EB.B8.94.EB.A1.9D_.EB.AC.B8.EC.9E.A5">블록 문장</a> 범위가 없습니다. 대신 그 블록이 포함된 코드의 지역 범위에 포함됩니다. 예를 들어 다음 코드에서는 <code>condition</code>이 <code>false</code>이면 예외를 발생시키는 대신 0을 출력합니다. -</p> -<pre class="eval">if (condition) { - var x = 5; -} -print(x ? x : 0); -</pre> -<p>JavaScript의 변수와 관련해서 또다른 색다른 점은 나중에 선언될 변수에 예외 발생없이 접근할 수 있다는 것입니다. -</p> -<pre class="eval">print(x === undefined); // prints "true" -var x = 3; -</pre> -<h4 id=".EC.A0.84.EC.97.AD_.EB.B3.80.EC.88.98" name=".EC.A0.84.EC.97.AD_.EB.B3.80.EC.88.98"> 전역 변수 </h4> -<p><span class="comment">need links to pages discussing scope chains and the global object</span> -전역 변수는, 실제로는 "전역 개체(global object)"의 속성(property)입니다. 웹 페이지에서 전역 개체는 <a href="ko/DOM/window">window</a>이므로, <code>window.<i>variable</i></code> 문장을 이용해서 전역 변수에 접근할 수 있습니다. -</p><p>그러므로, window나 frame 이름을 이용하면 다른 window나 frame에 정의된 전역 변수에 접근할 수 있습니다. 예를 들어 <code>phoneNumber</code>라는 변수를 <code>FRAMESET</code> 문서에 정의했다면, 자식 frame에서 <code>parent.phoneNumber</code>로 그 변수에 접근할 수 있습니다. -</p><p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Values", "Core_JavaScript_1.5_Guide:Constants") }} -</p>{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Variables", "fr": "fr/Guide_JavaScript_1.5/Variables", "ja": "ja/Core_JavaScript_1.5_Guide/Variables", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Zmienne" } ) }} diff --git a/files/ko/web/javascript/guide/정규식/assertions/index.html b/files/ko/web/javascript/guide/regular_expressions/assertions/index.html index 350c50f8f9..350c50f8f9 100644 --- a/files/ko/web/javascript/guide/정규식/assertions/index.html +++ b/files/ko/web/javascript/guide/regular_expressions/assertions/index.html diff --git a/files/ko/web/javascript/guide/정규식/groups_and_ranges/index.html b/files/ko/web/javascript/guide/regular_expressions/groups_and_ranges/index.html index 2e2109b4ed..2e2109b4ed 100644 --- a/files/ko/web/javascript/guide/정규식/groups_and_ranges/index.html +++ b/files/ko/web/javascript/guide/regular_expressions/groups_and_ranges/index.html diff --git a/files/ko/web/javascript/guide/정규식/index.html b/files/ko/web/javascript/guide/regular_expressions/index.html index 5fbbcef0a0..5fbbcef0a0 100644 --- a/files/ko/web/javascript/guide/정규식/index.html +++ b/files/ko/web/javascript/guide/regular_expressions/index.html diff --git a/files/ko/web/javascript/guide/inheritance_and_the_prototype_chain/index.html b/files/ko/web/javascript/inheritance_and_the_prototype_chain/index.html index e05bab3102..e05bab3102 100644 --- a/files/ko/web/javascript/guide/inheritance_and_the_prototype_chain/index.html +++ b/files/ko/web/javascript/inheritance_and_the_prototype_chain/index.html diff --git a/files/ko/web/javascript/introduction_to_object-oriented_javascript/index.html b/files/ko/web/javascript/introduction_to_object-oriented_javascript/index.html deleted file mode 100644 index 03015b1407..0000000000 --- a/files/ko/web/javascript/introduction_to_object-oriented_javascript/index.html +++ /dev/null @@ -1,290 +0,0 @@ ---- -title: 객체지향 자바스크립트 개요 -slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript -translation_of: Learn/JavaScript/Objects -translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript ---- -<p>비록 다른 객체지향적인 언어들과의 차이점에 대한 논쟁들이 있긴 하지만, JavaScript는 강력한 객체지향 프로그래밍 능력들을 지니고 있다.</p> - -<p>이 글에서는 객체지향 프로그래밍에 대해 소개하는 것으로 시작해서 자바스크립트의 객체 모델, 그리고 자바스크립트에서의 객체지향 프로그래밍 개념에 대해 간단한 예제로 살펴볼 것이다.</p> - -<h2 id="JavaScript_Review" name="JavaScript_Review">자바스크립트 리뷰(JavaScript review)</h2> - -<p>만약 변수, 형, 함수, 스코프 등 자바스크립트의 개념에 대해 명확히 이해하고 있지 못하다면, <a href="/en/JavaScript/A_re-introduction_to_JavaScript" title="en/JavaScript/A_re-introduction_to_JavaScript">A re-introduction to JavaScript</a>를 참고해 보자. <a href="/en/JavaScript/Guide" title="en/JavaScript/Guide">Core JavaScript 1.5 Guide</a>라는 글도 도움이 될 것이다.</p> - -<h2 id="Object-oriented_programming" name="Object-oriented_programming">객체지향 프로그래밍(Object-oriented programming)</h2> - -<p>객체지향 프로그래밍은 실제 세계에 기반한 모델을 만들기 위해 추상화를 사용하는 프로그래밍 패러다임이다. 객체지향 프로그래밍은 modularity, polymorphism, encapsulation을 포함하여 이전에 정립된 패러다임들부터 여러가지 테크닉들을 사용한다. 오늘날 많은 유명한 프로그래밍 언어(자바, 자바스크립트, C#, C++, 파이썬, PHP, 루비, 오브젝트C)는 객체지향 프로그래밍을 지원한다.</p> - -<p>객체지향 프로그래밍은 함수들의 집합 혹은 단순한 컴퓨터의 명령어들의 목록 이라는 기존의 프로그래밍에 대한 전통적인 관점에 반하여, 관계성있는 객체들의 집합이라는 관점으로 접근하는 소프트웨어 디자인으로 볼 수 있다. 객체지향 프로그래밍에서, 각 객체는 메시지를 받을 수도 있고, 데이터를 처리할 수도 있으며, 또다른 객체에게 메시지를 전달할 수도 있다. 각 객체는 별도의 역할이나 책임을 갖는 작은 독립적인 기계로 볼 수 있는 것이다.</p> - -<p>객체지향 프로그래밍은 보다 유연하고 유지보수성이 높은 프로그래밍을 하도록 의도되었고, 대규모 소프트웨어 공학에서 널리 알려져 있다. 객체지향 프로그래밍이 갖는 modularity에 기반한 강력한 힘에 의해, 객체지향적인 코드는 개발을 보다 단순하게 했고, 시간이 흐른 뒤에도 보다 쉽게 이해할 수 있도록 했으며, 복잡한 상황이나 절차들을 덜 모듈화된 프로그래밍 방법들보다 더 직접적으로 분석하고, 코딩하고, 이해할 수 있도록 만들었다.<sup><a href="#Reference">2</a></sup></p> - -<h2 id="Terminology" name="Terminology">용어(Terminology)</h2> - -<dl> - <dt>Class</dt> - <dd>객체의 특성을 정의</dd> - <dt>Object</dt> - <dd>Class의 인스턴스</dd> - <dt>Property</dt> - <dd>객체의 특성(예: 색깔)</dd> - <dt>Method</dt> - <dd>객체의 능력(예: 걷기)</dd> - <dt>Constructor</dt> - <dd>인스턴스화 되는 시점에서 호출되는 메서드</dd> - <dt>Inheritance</dt> - <dd>클래스는 다른 클래스로부터 특성들을 상속받을 수 있다.</dd> - <dt>Encapsulation</dt> - <dd>클래스는 해당 객체의 특성들만을 정의할 수 있고, 메서드는 그 메서드가 어떻게 실행되는지만 정의할 수 있다. (외부 접근 불가)</dd> - <dt>Abstraction</dt> - <dd>복잡한 상속, 메서드, 객체의 속성의 결합은 반드시 현실 세계를 시뮬레이션할 수 있어야 한다.</dd> - <dt>Polymorphism</dt> - <dd>다른 클래스들이 같은 메서드나 속성으로 정의될 수 있다.</dd> -</dl> - -<p>객체지향 프로그래밍에 대한 보다 확장된 설명은 <a class="external" href="http://en.wikipedia.org/wiki/Object_oriented_programming">Object-oriented programming</a>를 참고하면 된다.</p> - -<h2 id="프로토타입기반_프로그래밍(Prototype-based_programming)">프로토타입기반 프로그래밍(Prototype-based programming)</h2> - -<p>프로토타입 기반 프로그래밍은 클래스가 존재하지 않는 객체지향 프로그래밍의 한가지 스타일로, 동작 재사용(behavior reuse, 클래스기반 언어에서는 상속이라고함)은 프로토타입으로서 존재하는 객체를 데코레이팅하는 과정을 통해 수행된다.</p> - -<p>프로토타입 기반 언어의 원형적인 예는 David Ungar과 Randall Smith가 개발한 'Self'라는 프로그래밍 언어이다. 그러나 클래스가 없는 프로그래밍 스타일이 최근 인기를 얻으며 성장하였고, 자바스크립트, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak 등의 언어에서 채택되어 왔다.<sup><a href="#Reference">2</a></sup></p> - -<h2 id="JavaScript_Object_Oriented_Programming" name="JavaScript_Object_Oriented_Programming">자바스크립트 객체지향 프로그래밍(JavaScript Object Oriented Programming)</h2> - -<h3 id="Core_Objects" name="Core_Objects">Core Objects</h3> - -<p>자바스크립트는 코어(core)에 몇 개의 객체를 갖고 있다. 예를들면, Math, Object, Array, String과 같은 객체가 있다. 아래의 예제는 Math 객체를 사용해서 무작위 숫자를 만들어내는 것을 보여준다.</p> - -<pre class="brush: js">alert(Math.random()); -</pre> - -<div class="note"><strong>Note:</strong> <span style="color: #333333; line-height: inherit;">여기와 다른 예제들 모두 alert 이라는 함수가 전역에 선언되어 있다고 가정하고 있다. alert 함수는 실제로 자바스크립트 그 자체에 포함되진 않았지만, 대부분의 브라우저에서 지원하고 있다.</span></div> - -<p>자바스크립트의 core object들의 리스트는 <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects" title="En/Core_JavaScript_1.5_Reference/Global_Objects">Core JavaScript 1.5 Reference:Global Objects</a>라는 글을 참고하면 자세히 알 수 있다.</p> - -<p>자바스크립트의 모든 객체는 Object 객체의 인스턴스이므로 Object의 모든 속성과 메서드를 상속받는다.</p> - -<h3 id="Custom_Objects" name="Custom_Objects">Custom Objects</h3> - -<h4 id="The_Class" name="The_Class">The Class</h4> - -<p>class문을 흔하게 볼 수 있는 C++이나 자바와는 달리 자바스크립트는 class문이 포함되지 않은 프로토타입 기반 언어이다. 이로인해 때때로 class 기반 언어에 익숙한 프로그래머들은 혼란을 일으킨다. 자바스크립트에서는 function을 class로서 사용한다. 클래스를 정의하는 것은 function을 정의하는 것만큼 쉽다. 아래 예제에서는 Person이라는 이름의 클래스를 새로 정의하고 있다.</p> - -<pre class="brush: js">function Person() { } -</pre> - -<h4 id="The_Object_.28Class_Instance.29" name="The_Object_.28Class_Instance.29">The Object (Class Instance)</h4> - -<p>obj라는 이름의 객체의 새로운 인스턴스를 만들 때에는 new obj라는 statement를 사용하고, 차후에 접근할 수 있도록 변수에 결과를 받는다.</p> - -<p>아래의 예제에서 Person이라는 이름의 클래스를 정의한 후에, 두 개의 인스턴스를 생성하고 있다.</p> - -<pre class="brush: js">function Person() { } -var person1 = new Person(); -var person2 = new Person(); -</pre> - -<div class="note"><a href="/en/JavaScript/Reference/Global_Objects/Object/create" title="Object.create">Object.create</a> 메서드 역시 새로운 인스턴스를 만들 때 사용할 수 있다.</div> - -<h4 id="The_Constructor" name="The_Constructor">The Constructor</h4> - -<p>생성자는 인스턴스화되는 순간(객체 인스턴스가 생성되는 순간) 호출된다. 생성자는 해당 클래스의 메서드이다. 자바스크립트에서는 함수 자체가 그 객체의 생성자 역할을 하기 때문에 특별히 생성자 메서드를 정의할 필요가 없다. 클래스 안에 선언된 모든 내역은 인스턴스화되는 그 시간에 실행된다. 생성자는 주로 객체의 속성을 설정하거나 사용하기 위해 객체를 준비시키는 메서드를 호출할 때 주로 사용된다. 클래스 메서드를 추가하고 정의하는 것은 나중에 설명한다.</p> - -<div>아래의 예제에서, Person 클래스의 생성자는 Person 이 인스턴스화되었을 때 alert 을 보여주게 된다.</div> - -<pre class="brush: js">function Person() { - alert('Person instantiated'); -} - -var person1 = new Person(); -var person2 = new Person(); -</pre> - -<h4 id="The_Property_.28object_attribute.29" name="The_Property_.28object_attribute.29">The Property (object attribute)</h4> - -<div>속성은 클래스 안에 있는 변수들을 말한다. 객체의 모든 인스턴스는 그 인스턴스의 속성을 갖는다. 속성들의 상속이 바르게 이루어지려면 해당 클래스(function)의 프로토타입에 선언되어 있어야 한다.</div> - -<div> </div> - -<div>클래스 내에서 속성 작업은 현재 객체를 가리키는 this 키워드에 의해 이루어진다. 클래스의 외부에서 속성에 접근(읽기 혹은 쓰기)하는 것은 "인스턴스명.속성명" 의 형식으로 이루어진다. 이러한 문법은 C++, 자바나 다른 수많은 언어에서와 동일한 방식이다. (클래스 내부에서 "this.속성명" 은 해당 속성의 값을 읽거나 쓸 때 주로 사용된다)</div> - -<div> </div> - -<div>아래의 예제에서 Person 클래스에 gender라는 속성을 정의하고 인스턴스화할 때 그 값을 설정한다.</div> - -<pre class="brush: js">function Person(gender) { - this.gender = gender; - alert('Person instantiated'); -} - -var person1 = new Person('Male'); -var person2 = new Person('Female'); - -//display the person1 gender -alert('person1 is a ' + person1.gender); // person1 is a Male -</pre> - -<h4 id="The_methods" name="The_methods">메서드(The methods)</h4> - -<p>메서드는 앞서 살펴본 속성과 같은 방식을 따른다. 차이점이 있다면 메서드는 function이기 때문에 function 형태로 정의된다는 것입니다. 메서드를 호출하는 것은 속성에 접근하는 것과 매우 유사한데 단지 끝에 ()를 추가하면 된다. argument가 있다면 괄호 안에 입력해준다. 메서드를 정의하기 위해서는 클래스의 prototype에 명명된 속성에 함수를 할당하면 된다. 이때 할당된 이름은 해당 객체의 메서드를 호출할 때 사용되는 이름이다.</p> - -<p>아래의 예에서는 Person 클래스에 sayHello()라는 메서드를 정의하고 사용하고 있다.</p> - -<pre class="brush: js">function Person(gender) { - this.gender = gender; - alert('Person instantiated'); -} - -Person.prototype.sayHello = function() -{ - alert ('hello'); -}; - -var person1 = new Person('Male'); -var person2 = new Person('Female'); - -// call the Person sayHello method. -person1.sayHello(); // hello -</pre> - -<p>자바스크립트에서 메서드는 "컨텍스트에 관계 없이" 호출될 수 있는 속성으로서 클래스/객체에 연결되어 있다. 다음 예제의 코드를 살펴보자.</p> - -<pre class="brush: js">function Person(gender) { - this.gender = gender; -} - -Person.prototype.sayGender = function() -{ - alert(this.gender); -}; - -var person1 = new Person('Male'); -var genderTeller = person1.sayGender; - -person1.sayGender(); // alerts 'Male' -genderTeller(); // alerts undefined -alert(genderTeller === person1.sayGender); // alerts true -alert(genderTeller === Person.prototype.sayGender); // alerts true -</pre> - -<p>위의 예제는 많은 개념들을 한꺼번에 보여주고 있다. </p> - -<div>먼저 이 예제는 자바스크립트에 "per-object methods" 가 존재하지 않는다는 것을 보여준다. JavaScript는 메서드에 대한 레퍼런스가 모두 똑같은 (프로토타입에 처음 정의한) 함수를 참조하고 있기 때문이다.</div> - -<div> </div> - -<div>자바스크립트는 어떤 객체의 메서드로서 함수가 호출될 때 현재 "객체의 컨텍스트"를 특별한 "this" 변수에 "연결한다". 이는 아래와 같이 function 객체의 call 메서드를 호출하는 것과 동일하다.</div> - -<div> </div> - -<div>(역자주: 참고로, genderTeller() 만 호출했을 때 undefined 가 나타난 것은 해당 메서드가 호출될 때 컨텍스트가 window 로 잡혔기 때문에 window.gender 는 존재하지 않으므로 undefined 가 나타난 것이다.)</div> - -<div> </div> - -<pre class="brush: js">genderTeller.call(person1); //alerts 'Male' -</pre> - -<div class="note">더 자세한 것은 <a href="/en/JavaScript/Reference/Global_Objects/Function/call" title="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/call">Function.call</a> 과 <a href="/en/JavaScript/Reference/Global_Objects/Function/apply" title="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/apply">Function.apply</a> 를 참고하자.</div> - -<h4 id="Inheritance" name="Inheritance">상속(Inheritance)</h4> - -<p>상속은 하나 이상의 클래스를 특별한 버전의 클래스로 생성하는 하나의 방법이다. (다만 자바스크립트는 오직 하나의 클래스를 상속받는 것만 지원한다.) 이 특별한 클래스는 흔히 자식 클래스(child)라고 불리우고 원본 클래스는 흔히 부모 클래스(parent)라고 불리운다. 자바스크립트에서는 부모 클래스의 인스턴스를 자식 클래스에 할당함으로써 상속이 이루어진다. 최신 브라우저에서는 <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/create#Classical_inheritance_with_Object.create" title="/en-US/docs/JavaScript/Reference/Global_Objects/Object/create#Classical_inheritance_with_Object.create">Object.create</a> 메서드를 사용해서 상속을 수행할 수도 있다.</p> - -<div class="note"> -<p><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/prototype">Core JavaScript 1.5 Reference:Global Objects:Object:prototype</a> 에 나와있는 설명과 같이 자바스크립트는 자식 클래스의 prototype.constructor 를 검색하지 않으므로 직접 명시해주어야 한다.</p> -</div> - -<p>아래의 예제에서는, Student라는 클래스를 Person 클래스의 자식 클래스로 정의한다. 그 후에 우리는 sayHello() 메서드를 재정의하고 sayGoodBye() 메서드를 추가한다.</p> - -<pre class="brush: js">// define the Person Class -function Person() {} - -Person.prototype.walk = function(){ - alert ('I am walking!'); -}; -Person.prototype.sayHello = function(){ - alert ('hello'); -}; - -// define the Student class -function Student() { - // Call the parent constructor - Person.call(this); -} - -// inherit Person -Student.prototype = new Person(); - -// correct the constructor pointer because it points to Person -Student.prototype.constructor = Student; - -// replace the sayHello method -Student.prototype.sayHello = function(){ - alert('hi, I am a student'); -} - -// add sayGoodBye method -Student.prototype.sayGoodBye = function(){ - alert('goodBye'); -} - -var student1 = new Student(); -student1.sayHello(); -student1.walk(); -student1.sayGoodBye(); - -// check inheritance -alert(student1 instanceof Person); // true -alert(student1 instanceof Student); // true -</pre> - -<p>Object.create 를 사용하면 상속을 아래와 같이 수행할 수 있다.</p> - -<pre class="brush: js">Student<code class="js plain">.prototype = Object.create(</code>Person<code class="js plain">.prototype);</code></pre> - -<h4 id="Encapsulation" name="Encapsulation">캡슐화(Encapsulation)</h4> - -<p>이전의 예제에서, Student 클래스는 Person 클래스의 walk() 메서드가 어떻게 실행되는지에 대해 알 필요가 없고, walk() 메서드를 사용하는데에도 전혀 문제가 없다. 또 Student 클래스에서는 walk() 메서드의 내용을 바꾸려는게 아니라면 walk() 메서드를 특별히 정의할 필요도 없다. 자식 클래스는 부모 클래스의 모든 메서드를 상속받고, 상속받은 메서드중 일부를 수정하고 싶은 경우에만 해당 메서드를 정의하는 것을 우리는 캡슐화(encapsulation)이라고 부른다.</p> - -<h4 id="Abstraction" name="Abstraction">추상화(Abstraction)</h4> - -<p>추상화는 작업 문제의 현재 부분을 모델링할 수 있도록 하는 매커니즘이다. 추상화는 상속(specialization, 추상의 수준을 낮추는 것)과 합성으로 구현할 수 있다. 자바스크립트는 상속에 의해 특별화(specialization)를, 클래스들의 인스턴스를 다른 객체의 속성값이 되게 함으로써 합성을 구현한다.</p> - -<p>자바스크립트 Function 클래스는 Object 클래스를 상속받고(이는 모델의 특별화를 보여준다), Function.prototype 속성은 Object의 인스턴스이다(이는 합성을 보여준다).</p> - -<pre class="brush: js">var foo = function(){}; -alert( 'foo is a Function: ' + (foo instanceof Function) ); -alert( 'foo.prototype is an Object: ' + (foo.prototype instanceof Object) ); -</pre> - -<h4 id="Polymorphism" name="Polymorphism">다형성(Polymorphism)</h4> - -<p>모든 메서드와 속성들은 prototype 속성에 선언되어 있고, 클래스가 다르다면 같은 이름의 메서드도 선언할 수 있다. 메서드들은 메서드가 선언된 클래스로 그 실행 영역이 한정된다. 물론 이건 두 개의 클래스들이 서로 부모-자식 관계가 아닐때에만 성립한다. 즉 다시 말해 부모-자식 관계의 상속 관계로 하나가 다른 하나에게서 상속받지 않았을 때에만 성립한다.</p> - -<h2 id="Notes" name="Notes">Notes</h2> - -<p>객체지향 프로그래밍을 구현하는데 있어서 자바스크립트는 매우 유연하기 때문에, 이 글에서 선보인 테크닉들은 자바스크립트에서 객체지향을 구현하는 유일한 방법들 중 일부일 뿐이다.</p> - -<p>또, 여기에서 선보인 테크닉들은 어떤 hack도 사용하지 않았고 또한 다른 언어의 객체 이론 구현물들을 모방하지도 않았다.</p> - -<p>자바스크립트의 객체지향 프로그래밍에 있어서 다른 보다 깊이있는 테크닉들이 많이 있지만, 소개하는 글이라는 이 글의 특성상 다루지 않기로 한다.</p> - -<h2 id="References" name="References">References</h2> - -<ol> - <li>Mozilla. "Core JavaScript 1.5 Guide", http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide</li> - <li>Wikipedia. "Object-oriented programming", <a class="external" href="http://en.wikipedia.org/wiki/Object-oriented_programming" rel="freelink">http://en.wikipedia.org/wiki/Object-...ed_programming</a></li> -</ol> - -<div class="originaldocinfo"> -<h2 id="Original_Document_Information">Original Document Information</h2> - -<ul> - <li>Author(s): Fernando Trasviña <f_trasvina at hotmail dot com></li> - <li>Copyright Information: © 1998-2005 by individual mozilla.org contributors; content available under a <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Creative Commons license</a></li> -</ul> -</div> - -<p> </p> diff --git a/files/ko/web/javascript/언어_리소스/index.html b/files/ko/web/javascript/language_resources/index.html index 5743a54e24..5743a54e24 100644 --- a/files/ko/web/javascript/언어_리소스/index.html +++ b/files/ko/web/javascript/language_resources/index.html diff --git a/files/ko/web/javascript/reference/classes/class_fields/index.html b/files/ko/web/javascript/reference/classes/public_class_fields/index.html index 959c65fada..959c65fada 100644 --- a/files/ko/web/javascript/reference/classes/class_fields/index.html +++ b/files/ko/web/javascript/reference/classes/public_class_fields/index.html diff --git a/files/ko/web/javascript/reference/functions/애로우_펑션/index.html b/files/ko/web/javascript/reference/functions/arrow_functions/index.html index 02dc0d55e4..02dc0d55e4 100644 --- a/files/ko/web/javascript/reference/functions/애로우_펑션/index.html +++ b/files/ko/web/javascript/reference/functions/arrow_functions/index.html diff --git a/files/ko/web/javascript/reference/global_objects/bigint/prototype/index.html b/files/ko/web/javascript/reference/global_objects/bigint/prototype/index.html deleted file mode 100644 index 6ba56eb37e..0000000000 --- a/files/ko/web/javascript/reference/global_objects/bigint/prototype/index.html +++ /dev/null @@ -1,59 +0,0 @@ ---- -title: BigInt.prototype -slug: Web/JavaScript/Reference/Global_Objects/BigInt/prototype -tags: - - BigInt - - JavaScript - - Property - - Prototype - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>BigInt.prototype</code></strong> 속성은 {{jsxref("BigInt")}} 생성자의 프로토타입을 나타냅니다.</p> - -<p>{{js_property_attributes(0, 0, 0)}}</p> - -<h2 id="설명">설명</h2> - -<p>모든 {{jsxref("BigInt")}} 인스턴스는 <code>BigInt.prototype</code>을 상속합니다. <code>BigInt</code> 생성자의 프로토타입 객체를 변형해 모든 <code>BigInt</code> 인스턴스에 영향을 줄 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>BigInt.prototype.constructor</code></dt> - <dd>이 객체의 인스턴스를 만들 때 사용한 함수를 반환합니다. 기본값은 {{jsxref("BigInt")}} 객체입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt><code>BigInt.prototype.toLocaleString()</code></dt> - <dd>BigInt를 주어진 언어에 적합한 형태를 가진 문자열로 변환해 반환합니다. {{jsxref("Object.prototype.toLocaleString()")}} 메서드를 재정의합니다.</dd> - <dt><code>BigInt.prototype.toString()</code></dt> - <dd><code>BigInt</code>의 값을 주어진 진수로 표현한 문자열을 반환합니다. {{jsxref("Object.prototype.toString()")}} 메서드를 재정의합니다.</dd> - <dt><code>BigInt.prototype.valueOf()</code></dt> - <dd><code>BigInt</code> 객체의 원시 값 표현을 반환합니다. {{jsxref("Object.prototype.valueOf()")}} 메서드를 재정의합니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - </tr> - <tr> - <td><a href="https://tc39.github.io/proposal-bigint/#sec-bigint.prototype">BigInt.prototype</a></td> - <td>Stage 3</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<div class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> - -<p>{{Compat("javascript.builtins.BigInt.prototype")}}</p> diff --git a/files/ko/web/javascript/reference/global_objects/boolean/prototype/index.html b/files/ko/web/javascript/reference/global_objects/boolean/prototype/index.html deleted file mode 100644 index 6e90207661..0000000000 --- a/files/ko/web/javascript/reference/global_objects/boolean/prototype/index.html +++ /dev/null @@ -1,82 +0,0 @@ ---- -title: Boolean.prototype -slug: Web/JavaScript/Reference/Global_Objects/Boolean/prototype -tags: - - Boolean - - JavaScript - - Property - - Prototype -translation_of: Web/JavaScript/Reference/Global_Objects/Boolean -translation_of_original: Web/JavaScript/Reference/Global_Objects/Boolean/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>Boolean.prototype</code></strong> 속성은 {{jsxref("Boolean")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<div>{{EmbedInteractiveExample("pages/js/boolean-constructor.html")}}</div> - - - -<h2 id="설명">설명</h2> - -<p>{{jsxref("Boolean")}} 인스턴스는 <code>Boolean.prototype</code>을 상속받습니다. 생성자의 프로토타입 객체를 사용해 모든 <code>Boolean</code> 인스턴스에 속성이나 메서드를 추가할 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Boolean.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 생성한 함수를 반환합니다. 기본값은 {{jsxref("Boolean")}} 함수입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("Boolean.prototype.toSource()")}} {{non-standard_inline}}</dt> - <dd>{{jsxref("Boolean")}} 객체의 소스를 포함한 문자열을 반환합니다. 반환 문자열을 사용해 동일한 객체를 생성할 수 있습니다. {{jsxref("Object.prototype.toSource()")}} 메서드를 재정의합니다.</dd> - <dt>{{jsxref("Boolean.prototype.toString()")}}</dt> - <dd>객체의 값에 따라 문자열 <code>"true"</code> 또는 <code>"false"</code>를 반환합니다. {{jsxref("Object.prototype.toString()")}} 메서드를 재정의합니다.</dd> - <dt>{{jsxref("Boolean.prototype.valueOf()")}}</dt> - <dd>{{jsxref("Boolean")}} 객체의 원시 값을 반환합니다. {{jsxref("Object.prototype.valueOf()")}} 메서드를 재정의합니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('ES1')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>Initial definition. Implemented in JavaScript 1.0.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.6.3.1', 'Boolean.prototype')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-boolean.prototype', 'Boolean.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-boolean.prototype', 'Boolean.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.builtins.Boolean.prototype")}}</p> diff --git a/files/ko/web/javascript/reference/global_objects/date/prototype/index.html b/files/ko/web/javascript/reference/global_objects/date/prototype/index.html deleted file mode 100644 index 06e1bba5f7..0000000000 --- a/files/ko/web/javascript/reference/global_objects/date/prototype/index.html +++ /dev/null @@ -1,183 +0,0 @@ ---- -title: Date.prototype -slug: Web/JavaScript/Reference/Global_Objects/Date/prototype -tags: - - Date - - JavaScript - - Property - - Prototype - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Date -translation_of_original: Web/JavaScript/Reference/Global_Objects/Date/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>Date.prototype</code></strong> 속성은 {{jsxref("Date")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 1)}}</div> - -<h2 id="설명">설명</h2> - -<p>JavaScript {{jsxref("Date")}} 인스턴스는 <code>Date.prototype</code>을 상속합니다. 생성자의 프로토타입을 변경해 모든 <code>Date</code> 인스턴스의 속성과 메서드를 수정할 수 있습니다.</p> - -<p>2000년대 달력과의 호환성을 위해 연도는 언제나 완전하게 네 자리 숫자로 작성해야 합니다. 즉 98 대신 1998이 올바른 작성법입니다. <code>Date</code>는 완전한 연도 설정에 도움이 될 {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}}, {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}}, {{jsxref("Date.prototype.getUTCFullYear()", "getUTCFullYear()")}}, {{jsxref("Date.prototype.setUTCFullYear()", "setUTCFullYear()")}} 메서드를 가지고 있습니다.</p> - -<p>ECMAScript 6부터 <code>Date.prototype</code>은 {{jsxref("Date")}} 인스턴스가 아닌 평범한 객체입니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Date.prototype.constructor</code></dt> - <dd>인스턴스 생성에 사용한 생성자를 반환합니다. 기본값은 {{jsxref("Date")}}입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<h3 id="접근자">접근자</h3> - -<dl> - <dt>{{jsxref("Date.prototype.getDate()")}}</dt> - <dd>주어진 날짜의 일(1-31)을 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getDay()")}}</dt> - <dd>주어진 날짜의 요일(0-6)을 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getFullYear()")}}</dt> - <dd>주어진 날짜의 연도(4자리 수)를 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getHours()")}}</dt> - <dd>주어진 날짜의 시(0-23)를 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getMilliseconds()")}}</dt> - <dd>주어진 날짜의 밀리초(0-999)를 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getMinutes()")}}</dt> - <dd>주어진 날짜의 분(0-59)을 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getMonth()")}}</dt> - <dd>주어진 날짜의 월(0-11)을 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getSeconds()")}}</dt> - <dd>주어진 날짜의 초(0-59)를 현지 시간에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getTime()")}}</dt> - <dd>주어진 날짜와 1970년 1월 1일 0시 0분(UTC)의 차이를 밀리초로 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getTimezoneOffset()")}}</dt> - <dd>현재 로케일의 시간대 차이를 분으로 환산해 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCDate()")}}</dt> - <dd>주어진 날짜의 일(1-31)을 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCDay()")}}</dt> - <dd>주어진 날짜의 요일(0-6)을 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCFullYear()")}}</dt> - <dd>주어진 날짜의 연도(4자리 수)를 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCHours()")}}</dt> - <dd>주어진 날짜의 시(0-23)를 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCMilliseconds()")}}</dt> - <dd>주어진 날짜의 밀리초(0-999)를 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCMinutes()")}}</dt> - <dd>주어진 날짜의 분(0-59)을 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCMonth()")}}</dt> - <dd>주어진 날짜의 월(0-11)을 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getUTCSeconds()")}}</dt> - <dd>주어진 날짜의 초(0-59)를 UTC에 맞춰 반환합니다.</dd> - <dt>{{jsxref("Date.prototype.getYear()")}} {{deprecated_inline}}</dt> - <dd>주어진 날짜의 연도(주로 두세자리 숫자)를 현지 시간에 맞춰 반환합니다. {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}}를 사용하세요.</dd> -</dl> - -<h3 id="설정자">설정자</h3> - -<dl> - <dt>{{jsxref("Date.prototype.setDate()")}}</dt> - <dd>Sets the day of the month for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setFullYear()")}}</dt> - <dd>Sets the full year (e.g. 4 digits for 4-digit years) for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setHours()")}}</dt> - <dd>Sets the hours for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setMilliseconds()")}}</dt> - <dd>Sets the milliseconds for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setMinutes()")}}</dt> - <dd>Sets the minutes for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setMonth()")}}</dt> - <dd>Sets the month for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setSeconds()")}}</dt> - <dd>Sets the seconds for a specified date according to local time.</dd> - <dt>{{jsxref("Date.prototype.setTime()")}}</dt> - <dd>Sets the {{jsxref("Date")}} object to the time represented by a number of milliseconds since January 1, 1970, 00:00:00 UTC, allowing for negative numbers for times prior.</dd> - <dt>{{jsxref("Date.prototype.setUTCDate()")}}</dt> - <dd>Sets the day of the month for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setUTCFullYear()")}}</dt> - <dd>Sets the full year (e.g. 4 digits for 4-digit years) for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setUTCHours()")}}</dt> - <dd>Sets the hour for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setUTCMilliseconds()")}}</dt> - <dd>Sets the milliseconds for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setUTCMinutes()")}}</dt> - <dd>Sets the minutes for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setUTCMonth()")}}</dt> - <dd>Sets the month for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setUTCSeconds()")}}</dt> - <dd>Sets the seconds for a specified date according to universal time.</dd> - <dt>{{jsxref("Date.prototype.setYear()")}} {{deprecated_inline}}</dt> - <dd>Sets the year (usually 2-3 digits) for a specified date according to local time. Use {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} instead.</dd> -</dl> - -<h3 id="변환_접근자">변환 접근자</h3> - -<dl> - <dt>{{jsxref("Date.prototype.toDateString()")}}</dt> - <dd>Returns the "date" portion of the {{jsxref("Date")}} as a human-readable string like 'Thu Apr 12 2018'</dd> - <dt>{{jsxref("Date.prototype.toISOString()")}}</dt> - <dd>Converts a date to a string following the ISO 8601 Extended Format.</dd> - <dt>{{jsxref("Date.prototype.toJSON()")}}</dt> - <dd>Returns a string representing the {{jsxref("Date")}} using {{jsxref("Date.prototype.toISOString()", "toISOString()")}}. Intended for use by {{jsxref("JSON.stringify()")}}.</dd> - <dt>{{jsxref("Date.prototype.toGMTString()")}} {{deprecated_inline}}</dt> - <dd>Returns a string representing the {{jsxref("Date")}} based on the GMT (UT) time zone. Use {{jsxref("Date.prototype.toUTCString()", "toUTCString()")}} instead.</dd> - <dt>{{jsxref("Date.prototype.toLocaleDateString()")}}</dt> - <dd>Returns a string with a locality sensitive representation of the date portion of this date based on system settings.</dd> - <dt>{{jsxref("Date.prototype.toLocaleFormat()")}} {{non-standard_inline}}</dt> - <dd>Converts a date to a string, using a format string.</dd> - <dt>{{jsxref("Date.prototype.toLocaleString()")}}</dt> - <dd>Returns a string with a locality sensitive representation of this date. Overrides the {{jsxref("Object.prototype.toLocaleString()")}} method.</dd> - <dt>{{jsxref("Date.prototype.toLocaleTimeString()")}}</dt> - <dd>Returns a string with a locality sensitive representation of the time portion of this date based on system settings.</dd> - <dt>{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}}</dt> - <dd>Returns a string representing the source for an equivalent {{jsxref("Date")}} object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.</dd> - <dt>{{jsxref("Date.prototype.toString()")}}</dt> - <dd>Returns a string representing the specified {{jsxref("Date")}} object. Overrides the {{jsxref("Object.prototype.toString()")}} method.</dd> - <dt>{{jsxref("Date.prototype.toTimeString()")}}</dt> - <dd>Returns the "time" portion of the {{jsxref("Date")}} as a human-readable string.</dd> - <dt>{{jsxref("Date.prototype.toUTCString()")}}</dt> - <dd>Converts a date to a string using the UTC timezone.</dd> - <dt>{{jsxref("Date.prototype.valueOf()")}}</dt> - <dd>Returns the primitive value of a {{jsxref("Date")}} object. Overrides the {{jsxref("Object.prototype.valueOf()")}} method.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES1')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>Initial definition. Implemented in JavaScript 1.1.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.9.5', 'Date.prototype')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> - -<p>{{Compat("javascript.builtins.Date.prototype")}}</p> diff --git a/files/ko/web/javascript/reference/global_objects/internalerror/prototype/index.html b/files/ko/web/javascript/reference/global_objects/internalerror/prototype/index.html deleted file mode 100644 index 6e13afb6db..0000000000 --- a/files/ko/web/javascript/reference/global_objects/internalerror/prototype/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: InternalError.prototype -slug: Web/JavaScript/Reference/Global_Objects/InternalError/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/InternalError -translation_of_original: Web/JavaScript/Reference/Global_Objects/InternalError/prototype ---- -<div>{{JSRef}} {{non-standard_header}}</div> - -<p><code><strong>InternalError.prototype </strong></code>속성은 {{jsxref("InternalError")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="설명">설명</h2> - -<p>모든 {{jsxref("InternalError")}} 인스턴스는 <code>InternalError.prototype</code> 으로부터 상속받습니다. 프로토타입은 모든 인스턴스에 속성이나 메소드를 추가하거나 하는 데에 사용할 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>InternalError.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 생성하는 함수를 명시합니다. </dd> - <dt>{{jsxref("Error.prototype.message", "InternalError.prototype.message")}}</dt> - <dd>에러 메시지. {{jsxref("Error")}} 로부터 상속받습니다. </dd> - <dt>{{jsxref("Error.prototype.name", "InternalError.prototype.name")}}</dt> - <dd>에러명. {{jsxref("Error")}} 로부터 상속받습니다.</dd> - <dt>{{jsxref("Error.prototype.fileName", "InternalError.prototype.fileName")}}</dt> - <dd>에러를 발생시킨 파일의 경로. {{jsxref("Error")}} 로부터 상속받습니다.</dd> - <dt>{{jsxref("Error.prototype.lineNumber", "InternalError.prototype.lineNumber")}}</dt> - <dd>에러를 발생시킨 파일의 라인 넘버. {{jsxref("Error")}} 로부터 상속받습니다.</dd> - <dt>{{jsxref("Error.prototype.columnNumber", "InternalError.prototype.columnNumber")}}</dt> - <dd>에러를 발생 시킨 라인의 컬럼 넘버. {{jsxref("Error")}} 로부터 상속받습니다.</dd> - <dt>{{jsxref("Error.prototype.stack", "InternalError.prototype.stack")}}</dt> - <dd>스택 트레이스. {{jsxref("Error")}} 로부터 상속받습니다. </dd> -</dl> - -<h2 id="메소드">메소드</h2> - -<p>비록 {{jsxref("InternalError")}}의 프로토타입 객체는 고유의 메소드를 가지고 있지는 않습니다. 하지만, {{jsxref("InternalError")}} 인스턴스는 프로토타입 체인을 통해 몇 가지의 메소드를 상속 받습니다.</p> - -<h2 id="스펙">스펙</h2> - -<p>Not part of any specifications.</p> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="참조">참조</h2> - -<ul> - <li>{{jsxref("Error.prototype")}}</li> - <li>{{jsxref("Function.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html b/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html deleted file mode 100644 index 2f1b031b39..0000000000 --- a/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: Intl.DateTimeFormat.prototype -slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/prototype -tags: - - DateTimeFormat - - Internationalization - - Intl - - JavaScript - - Property - - Prototype - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat -translation_of_original: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>Intl.DateTimeFormat.prototype</code></strong> 속성은 {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="설명">설명</h2> - -<p><code>Intl.DateTimeFormat</code> 인스턴스에 대한 설명은 {{jsxref("DateTimeFormat")}} 문서를 참고하세요.</p> - -<p>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 인스턴스는 <code>Intl.DateTimeFormat.prototype</code>을 상속합니다. 프로토타입 객체를 변경하면 모든 {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 인스턴스가 영향을 받습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Intl.DateTimeFormat.prototype.constructor</code></dt> - <dd>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}에 대한 참조입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("DateTimeFormat.format", "Intl.DateTimeFormat.prototype.format()")}}</dt> - <dd>주어진 날짜에 {{jsxref("DateTimeFormat")}} 객체의 로케일과 서식 설정을 적용해 반환합니다.</dd> -</dl> - -<dl> - <dt>{{jsxref("DateTimeFormat.formatToParts", "Intl.DateTimeFormat.prototype.formatToParts()")}}</dt> - <dd>서식을 적용한 날짜 문자열의 각 부분을 객체로 표현해서 {{jsxref("Array")}}로 반환합니다. 반환 값은 로케일별 커스텀 서식에 사용할 수 있습니다.</dd> - <dt>{{jsxref("DateTimeFormat.resolvedOptions", "Intl.DateTimeFormat.prototype.resolvedOptions()")}}</dt> - <dd>객체 인스턴스 생성 때 주어진 로케일과 서식 설정이 어떻게 반영되었나 나타내는 새로운 객체를 반환합니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES Int 1.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}</td> - <td>{{Spec2('ES Int 1.0')}}</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ES Int 2.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}</td> - <td>{{Spec2('ES Int 2.0')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype', 'Intl.DateTimeFormat.prototype')}}</td> - <td>{{Spec2('ES Int Draft')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<div> - - -<p>{{Compat("javascript.builtins.Intl.DateTimeFormat.prototype")}}</p> -</div> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html b/files/ko/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html deleted file mode 100644 index fcbaa6c247..0000000000 --- a/files/ko/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html +++ /dev/null @@ -1,86 +0,0 @@ ---- -title: Intl.NumberFormat.prototype -slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/prototype -tags: - - Internationalization - - Intl - - JavaScript - - NumberFormat - - Property - - Prototype -translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat -translation_of_original: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>Intl.NumberFormat.prototype</code></strong> 속성은 {{jsxref("NumberFormat", "Intl.NumberFormat")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="설명">설명</h2> - -<p><code>Intl.NumberFormat</code> 인스턴스에 대한 설명은 {{jsxref("NumberFormat")}} 문서를 참고하세요.</p> - -<p>{{jsxref("NumberFormat", "Intl.NumberFormat")}} 인스턴스는 <code>Intl.NumberFormat.prototype</code>을 상속합니다. 프로토타입 객체를 변형하면 모든 {{jsxref("NumberFormat", "Intl.NumberFormat")}} 인스턴스가 영향을 받습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Intl.NumberFormat.prototype.constructor</code></dt> - <dd><code>Intl.NumberFormat</code>에 대한 참조입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("NumberFormat.format", "Intl.NumberFormat.prototype.format()")}}</dt> - <dd>주어진 숫자에 {{jsxref("NumberFormat")}} 객체의 로케일과 서식 설정을 적용해 반환합니다.</dd> -</dl> - -<dl> - <dt>{{jsxref("NumberFormat.formatToParts", "Intl.NumberFormat.prototype.formatToParts()")}}</dt> - <dd>서식을 적용한 숫자의 각 부분을 객체로 표현해서 {{jsxref("Array")}}로 반환합니다. 반환 값은 로케일별 커스텀 서식에 사용할 수 있습니다.</dd> - <dt>{{jsxref("NumberFormat.resolvedOptions", "Intl.NumberFormat.prototype.resolvedOptions()")}}</dt> - <dd>객체 인스턴스 생성 때 주어진 로케일과 콜레이션 설정이 어떻게 반영되었나 나타내는 새로운 객체를 반환합니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES Int 1.0', '#sec-11.2.1', 'Intl.NumberFormat.prototype')}}</td> - <td>{{Spec2('ES Int 1.0')}}</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ES Int 2.0', '#sec-11.2.1', 'Intl.NumberFormat.prototype')}}</td> - <td>{{Spec2('ES Int 2.0')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES Int Draft', '#sec-Intl.NumberFormat.prototype', 'Intl.NumberFormat.prototype')}}</td> - <td>{{Spec2('ES Int Draft')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<div> - - -<p>{{Compat("javascript.builtins.Intl.NumberFormat.prototype")}}</p> -</div> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/map/prototype/index.html b/files/ko/web/javascript/reference/global_objects/map/prototype/index.html deleted file mode 100644 index 3445bf2847..0000000000 --- a/files/ko/web/javascript/reference/global_objects/map/prototype/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: Map.prototype -slug: Web/JavaScript/Reference/Global_Objects/Map/prototype -tags: - - ECMAScript 2015 - - JavaScript - - Map - - Property - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Map -translation_of_original: Web/JavaScript/Reference/Global_Objects/Map/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>Map</strong></code><strong><code>.prototype</code></strong> property는 {{jsxref("Map")}}의 프로토 타입을 나타낸다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="Description">Description</h2> - -<p>{{jsxref("Map")}} instance는 {{jsxref("Map.prototype")}}를 상속한다. Constructor의 프로토타입에 property와 method를 추가함으로써 모든 <code>Map</code> 인스턴스에서 사용 가능하게끔 만들 수 있다.</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt><code>Map.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 만드는 함수를 반환한다. 이것 {{jsxref("Map")}} 함수의 기본 값이다.</dd> - <dt>{{jsxref("Map.prototype.size")}}</dt> - <dd><code>Map</code> 객체에 들어있는 key/value pair의 수를 반환한다.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt>{{jsxref("Map.prototype.clear()")}}</dt> - <dd><code>Map</code> 객체의 모든 key/value pair를 제거한다.</dd> - <dt>{{jsxref("Map.delete", "Map.prototype.delete(key)")}}</dt> - <dd>주어진 키(Key)와 해당되는 값(Value)를 제거하고 제거하기 전에 <code>Map.prototype.has(key)가 반환했던 값을 반환한다.</code> 그 후의 <code>Map.prototype.has(key)<font face="Open Sans, arial, sans-serif">는 </font></code><code>false를 반환한다.</code></dd> - <dt>{{jsxref("Map.prototype.entries()")}}</dt> - <dd><code>Map</code> 객체 안의 모든 요소들을 <strong><code>[key, value] 형태의 </code>array </strong>로 집어넣은 순서대로 가지고 있는 <code>Iterator 객체를 반환한다.</code></dd> - <dt>{{jsxref("Map.forEach", "Map.prototype.forEach(callbackFn[, thisArg])")}}</dt> - <dd><code>Map</code> 객체 안에 존재하는 각각의 key/value pair에 집어넣은 순서대로 callbackFn을 부른다. 만약 thisArg 매개변수가 제공되면, 이것이 각 callback의 this 값으로 사용된다.</dd> - <dt>{{jsxref("Map.get", "Map.prototype.get(key)")}}</dt> - <dd>주어진 키(Key)에 해당되는 값(value)을 반환하고, 만약 없으면 <code>undefined를 반환한다.</code></dd> - <dt>{{jsxref("Map.has", "Map.prototype.has(key)")}}</dt> - <dd><code>Map 객체 안에 주어진 </code>key/value pair가 있는지 검사하고 Boolean 값을 반환한다.</dd> - <dt>{{jsxref("Map.prototype.keys()")}}</dt> - <dd><code>Map</code> 객체 안의 모든 <strong>키(Key)</strong>들을 집어넣은 순서대로 가지고 있는 <code>Iterator 객체를 반환한다.</code></dd> - <dt>{{jsxref("Map.set", "Map.prototype.set(key, value)")}}</dt> - <dd><code>Map 객체에 주어진 키</code>(Key)에 값(Value)를 집어넣고, <code>Map 객체를 반환한다.</code></dd> - <dt>{{jsxref("Map.prototype.values()")}}</dt> - <dd><code>Map</code> 객체 안의 모든 <strong>값</strong><strong>(Value)</strong>들을 집어넣은 순서대로 가지고 있는 <code>Iterator 객체를 반환한다.</code></dd> - <dt>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</dt> - <dd><code>Map</code> 객체 안의 모든 요소들을 <strong><code>[key, value] 형태의 </code>array </strong>로 집어넣은 순서대로 가지고 있는 <code>Iterator 객체를 반환한다.</code></dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES2015', '#sec-map.prototype', 'Map.prototype')}}</td> - <td>{{Spec2('ES2015')}}</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-map.prototype', 'Map.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{Compat("javascript.builtins.Map.prototype")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{jsxref("Set.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/number/prototype/index.html b/files/ko/web/javascript/reference/global_objects/number/prototype/index.html deleted file mode 100644 index 2bf39d20f9..0000000000 --- a/files/ko/web/javascript/reference/global_objects/number/prototype/index.html +++ /dev/null @@ -1,91 +0,0 @@ ---- -title: Number.prototype -slug: Web/JavaScript/Reference/Global_Objects/Number/prototype -tags: - - JavaScript - - Number - - Property - - Prototype - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Number -translation_of_original: Web/JavaScript/Reference/Global_Objects/Number/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>Number.prototype</code></strong> 속성은 {{jsxref("Number")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="설명">설명</h2> - -<p>모든 {{jsxref("Number")}} 인스턴스는 <code>Number.prototype</code>을 상속합니다. {{jsxref("Number")}} 생성자의 프로토타입 객체는 모든 {{jsxref( "Number")}} 인스턴스에 영향을 미치도록 수정할 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Number.prototype.constructor</code></dt> - <dd>이 객체의 인스턴스를 생성한 함수를 반환합니다. 기본적으로 {{jsxref("Number")}} 객체 입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("Number.prototype.toExponential()")}}</dt> - <dd>숫자의 지수표기법 표현을 문자열로 반환합니다.</dd> - <dt>{{jsxref("Number.prototype.toFixed()")}}</dt> - <dd>숫자의 고정소수점 표현을 문자열로 반환합니다.</dd> - <dt>{{jsxref("Number.prototype.toLocaleString()")}}</dt> - <dd>숫자의 표현을 특정 언어에 맞춘 형식의 문자열로 반환합니다. {{jsxref("Object.prototype.toLocaleString()")}} 메서드를 오버라이드 합니다.</dd> - <dt>{{jsxref("Number.prototype.toPrecision()")}}</dt> - <dd>지정한 정밀도로 숫자를 나타내는 문자열을 반환합니다. 고정소수점 혹은 지수표기법으로 표현합니다.</dd> - <dt>{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}}</dt> - <dd>지정한 {{jsxref("Number")}} 객체를 나타내는 객체 리터럴을 반환합니다. 이 값을 사용하여 새 객체를 만들 수 있습니다. {{jsxref("Object.prototype.toSource()")}} 메서드를 오버라이드 합니다.</dd> - <dt>{{jsxref("Number.prototype.toString()")}}</dt> - <dd>지정된 기수(기본 10진수)로 지정된 객체를 문자열로 반환합니다. {{jsxref("Object.prototype.toString()")}} 메서드를 오버라이드 합니다.</dd> - <dt>{{jsxref("Number.prototype.valueOf()")}}</dt> - <dd>지정한 객체의 기본 자료형(primitive) 값을 반환합니다. {{jsxref("Object.prototype.valueOf()")}} 메서드를 오버라이드 합니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES1')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>Initial definition. Implemented in JavaScript 1.1.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.7.4', 'Number')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-properties-of-the-number-prototype-object', 'Number')}}</td> - <td>{{Spec2('ES6')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-properties-of-the-number-prototype-object', 'Number')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> - -<p>{{Compat("javascript.builtins.Number.prototype")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("Number")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/object/prototype/index.html b/files/ko/web/javascript/reference/global_objects/object/prototype/index.html deleted file mode 100644 index 8f7b08793f..0000000000 --- a/files/ko/web/javascript/reference/global_objects/object/prototype/index.html +++ /dev/null @@ -1,219 +0,0 @@ ---- -title: Object.prototype -slug: Web/JavaScript/Reference/Global_Objects/Object/prototype -tags: - - JavaScript - - Object - - Property - - Reference - - 프로토타입 -translation_of: Web/JavaScript/Reference/Global_Objects/Object -translation_of_original: Web/JavaScript/Reference/Global_Objects/Object/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>Object.prototype</strong></code> 속성은 {{jsxref("Object")}} 프로토타입(원형) 객체를<br> - 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="설명">설명</h2> - -<p>JavaScript에서 거의 모든 객체는 {{jsxref("Object")}}의 인스턴스입니다. 일반적인 객체는 <code>Object.prototype</code> 에서 속성과 메서드를 상속받으며, 그 중 일부는 (오버라이드 등으로 인해) 숨겨질 수 있습니다. 그러나, 의도적으로 <code>Object</code>를 생성할 때 ({{jsxref("Object.create", "Object.create(null)")}} 처럼) 이를 피할 수도 있고, {{jsxref("Object.setPrototypeOf")}} 등을 통해 나중에 무효화할 수도 있습니다.</p> - -<p><code>Object</code> 프로토타입에 가하는 변경은 프로토타입 체인을 통해, 더 아래쪽 체인에서 덮어 쓴 경우가 아니라면 <strong>모든</strong> 객체에서 관측할 수 있습니다. 이는 객체를 확장하거나 행동을 바꿀 수 있는 매우 강력하면서도 위험한 방법을 제공합니다.</p> - - - -<h2 id="속성">속성</h2> - -<dl> - <dt>{{jsxref("Object.prototype.constructor")}}</dt> - <dd>객체의 프로토타입을 생성하는 함수를 지정합니다.</dd> - <dt>{{jsxref("Object.prototype.__proto__")}} {{non-standard_inline}}</dt> - <dd>객체가 초기화될 때 프로토타입으로 사용된 객체를 가리킵니다.</dd> - <dt><s class="obsoleteElement">{{jsxref("Object.prototype.__noSuchMethod__")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement">정의되지 않은 객체 멤버가 메소드로서 호출될 때 실행되는 함수를 정의하는 데 쓰였지만 제거되었습니다.</s></dd> - <dt><s class="obsoleteElement">{{jsxref("Object.prototype.count","Object.prototype.__count__")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement">사용자 정의 객체 상에 직접 있는 열거가능 속성의 수를 반환하는 데 쓰였지만 제거되었습니다.</s></dd> - <dt><s class="obsoleteElement">{{jsxref("Object.prototype.parent","Object.prototype.__parent__")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement">객체 문맥을 가리키는 데 쓰였지만 제거되었습니다.</s></dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("Object.prototype.__defineGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> - <dd>함수를 속성에 연결합니다, 접근했을 때 그 함수를 실행해 그 결과값을 반환하는.</dd> - <dt>{{jsxref("Object.prototype.__defineSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> - <dd>함수를 속성에 연결합니다, 설정했을 때 그 속성을 수정하는 함수를 실행하는.</dd> - <dt>{{jsxref("Object.prototype.__lookupGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> - <dd>{{jsxref("Object.prototype.__defineGetter__()", "__defineGetter__()")}} 메소드에 의해 지정된 속성과 관련된 함수를 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.__lookupSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> - <dd>{{jsxref("Object.prototype.__defineSetter__()", "__defineSetter__()")}} 메소드에 의해 지정된 속성과 관련된 함수를 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.hasOwnProperty()")}}</dt> - <dd>객체가 지정된 속성을 프로토타입 체인을 통해 상속되지 않은 그 객체의 직접 속성으로 포함하는지를 나타내는 boolean을 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.isPrototypeOf()")}}</dt> - <dd>지정된 객체가 이 메소드가 호출된 객체의 프로토타입 체인 내에 있는지를 나타내는 boolean을 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</dt> - <dd>내부 <a href="/ko/docs/Web/JavaScript/Data_structures#Properties">ECMAScript [[Enumerable]] attribute</a>가 설정된 경우를 나타내는 boolean을 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.toSource()")}} {{non-standard_inline}}</dt> - <dd>이 메소드가 호출된 객체를 나타내는 객체 리터럴의 출처를 포함하는 문자열을 반환합니다; 새로운 객체를 만들기 위해 이 값을 쓸 수 있습니다.</dd> - <dt>{{jsxref("Object.prototype.toLocaleString()")}}</dt> - <dd>{{jsxref("Object.toString", "toString()")}}을 호출합니다.</dd> - <dt>{{jsxref("Object.prototype.toString()")}}</dt> - <dd>객체의 문자열 표현을 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.unwatch()")}} {{non-standard_inline}}</dt> - <dd>객체 속성에서 감시점을 제거합니다.</dd> - <dt>{{jsxref("Object.prototype.valueOf()")}}</dt> - <dd>지정된 객체의 원시값을 반환합니다.</dd> - <dt>{{jsxref("Object.prototype.watch()")}} {{non-standard_inline}}</dt> - <dd>객체 속성에 감시점을 추가합니다.</dd> - <dt><s class="obsoleteElement">{{jsxref("Object.prototype.eval()")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement">지정된 객체의 문맥에서 JavaScript 코드 문자열을 평가하는 데 쓰였지만 제거되었습니다.</s></dd> -</dl> - -<h2 id="예제">예제</h2> - -<p><code>Object.prototype</code>의 기본 메서드를 변경할 때, 기존 조직의 앞 또는 후에 확장(extension) 을 포장하여 코드를 주입시키는 것을 고려하자. 예를 들어서, 이 (시험받지<br> - 않은) 코드는 내장된 로직 또는 어떤 다른 확장이 실행되기 전에 커스텀 로직을 전제조건적으로 실행시킬 것이다.</p> - -<p>함수가 호출되었을 때, 불러온 매개변수들은 배열과 같은 형태로 '변수' <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments">arguments</a>에 보관된다. 예를 들어 myFn(a, b, c) 라는 함수를 부를 때, 이 함수 내부에 배열형태로 매개변수 (a, b, c) 를 담게 된다. prototype을 훅을 이용해 수정할 때, 함수에서 apply()를 호출하여 단순하게 this와 arguments(호출 상태)에 현재 동작을 전달하면 된다. 이 패턴은 Node.prototype, Function.prototype등 prototype에도 사용할 수 있다.</p> - -<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> current <span class="operator token">=</span> Object<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>valueOf<span class="punctuation token">;</span> - -<span class="comment token">// 현재 설정한 "-prop-value" 속성은 cross-cutting 이고 </span> -<span class="comment token">// 항상 같은 prototype chain이 아니기 때문에, 이 Object.prototype을 바꾸고 싶다.</span> -Object<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>valueOf <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">hasOwnProperty</span><span class="punctuation token">(</span><span class="string token">'-prop-value'</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">return</span> <span class="keyword token">this</span><span class="punctuation token">[</span><span class="string token">'-prop-value'</span><span class="punctuation token">]</span><span class="punctuation token">;</span> - <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="punctuation token">{</span> - <span class="comment token">// 이 객체 내 속성(property)이 하나가 아니라면, 현재 동작을 재구성한 것으로부터 - // 기본 동작으로 되돌리자(복구). </span> - <span class="comment token">// apply 동작은 다른 언어에서의 "super"와 유사하다.</span> - <span class="comment token">// 비록 valueOf()가 매개변수를 받지못하더라도, 다른 훅에서 있을 것이다.</span> - <span class="keyword token">return</span> current<span class="punctuation token">.</span><span class="function token">apply</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">,</span> arguments<span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="punctuation token">}</span> -<span class="punctuation token">}</span></code> -</pre> - -<p>JavaScript는 엄밀히 말해서 하위클래스(sub-class) 객체가 없기에, prototype은 객체 역할을 하는 특정 함수의 "기반 클래스" 객체를 만드는 유용한 차선책입니다. 예를 들어:</p> - -<pre class="brush: js notranslate">var Person = function() { - this.canTalk = true; -}; - -Person.prototype.greet = function() { - if (this.canTalk) { - console.log('Hi, I am ' + this.name); - } -}; - -var Employee = function(name, title) { - Person.call(this); - this.name = name; - this.title = title; -}; - -Employee.prototype = Object.create(Person.prototype); -Employee.prototype.constructor = Employee; - -Employee.prototype.greet = function() { - if (this.canTalk) { - console.log('Hi, I am ' + this.name + ', the ' + this.title); - } -}; - -var Customer = function(name) { - Person.call(this); - this.name = name; -}; - -Customer.prototype = Object.create(Person.prototype); -Customer.prototype.constructor = Customer; - -var Mime = function(name) { - Person.call(this); - this.name = name; - this.canTalk = false; -}; - -Mime.prototype = Object.create(Person.prototype); -Mime.prototype.constructor = Mime; - -var bob = new Employee('Bob', 'Builder'); -var joe = new Customer('Joe'); -var rg = new Employee('Red Green', 'Handyman'); -var mike = new Customer('Mike'); -var mime = new Mime('Mime'); - -bob.greet(); -// Hi, I am Bob, the Builder - -joe.greet(); -// Hi, I am Joe - -rg.greet(); -// Hi, I am Red Green, the Handyman - -mike.greet(); -// Hi, I am Mike - -mime.greet(); -</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">스펙</th> - <th scope="col">상태</th> - <th scope="col">설명</th> - </tr> - <tr> - <td>{{SpecName('ES1')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>초기 정의. JavaScript 1.0에서 구현됨.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-object.prototype', 'Object.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{Compat("javascript.builtins.Object.prototype")}}</p> - -<h2 id="참조">참조</h2> - -<ul> - <li><a href="/ko/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">객체지향 JavaScript 소개</a></li> -</ul> - -<div id="dicLayer" style=""> -<div id="dicLayerContents"><dicword style="user-select: text;">Even though valueOf() doesn't take arguments, some other hook may.</dicword><dicword style="user-select: text;"><dicimg id="play" style="background-image: url(chrome-extension://bmbdcffdhebhecemcchbkfnjlmdiiepe/play.gif);"></dicimg> <input>Eng<dicimg id="copy" style="background-image: url(chrome-extension://bmbdcffdhebhecemcchbkfnjlmdiiepe/copy.png);" title="copy"></dicimg></dicword><br> -<br> -<br> -<br> -valueOf ()가 인수를받지 않더라도 다른 후크가있을 수 있습니다.</div> - -<div id="dicLayerSub"></div> -</div> - -<div id="dicRawData" style="display: none;">{"mean":["take<br/><br/>[동사]\n\t\t ~ sth (with you) | ~ sth (to sb) | ~ (sb) sth\n\t\t \t\t(어떤 것을 한 곳에서 다른 곳으로) 가지고 가다[이동시키다]","though<br/><br/>[접속사]\n\t\t \t\t(비록) …이긴 하지만[…인데도/…일지라도]\n\n\t\t\t\t\t\t\t\t유의어 although","value<br/><br/>[명사]\n\t\t \t\t(경제적인) 가치\n\n\t\t 참조 market value, street value","other<br/><br/>[형용사, 대명사]\n\t\t \t\t(그 밖의) 다른; 다른 사람[것]\n\n\t\t 참조 another","may<br/><br/>[법조동사]\n\t\t \t\t(가능성을 나타내어) …일지도 모른다[…일 수도 있다]"],"word":"\n\t\t\t\t\t\ttake\n \t\t\t\n\t \t\n\t ","soundUrl":"https://dict-dn.pstatic.net/v?_lsu_sa_=3cd8f6567dcc35f67a9d216930e402fa1d2763157705ff3d60620d707b1d60814356971c64e54c7e792964a50a21103d6cc3ad8a5c30e6d7e9205e93c8517e38f8e5b191d1700b6773822766eee45672523cb75822e10196643a3baf5d3dabb04974f799e77e47c4f2db9476dbfb3e4bf612100b4fa8e918f972d80a449bc79c","phoneticSymbol":"[teɪk]"}</div> - -<div id="dicLayerLoader" style="top: 3322px; left: 514px;"></div> diff --git a/files/ko/web/javascript/reference/global_objects/promise/prototype/index.html b/files/ko/web/javascript/reference/global_objects/promise/prototype/index.html deleted file mode 100644 index 2e393d68d3..0000000000 --- a/files/ko/web/javascript/reference/global_objects/promise/prototype/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: Promise.prototype -slug: Web/JavaScript/Reference/Global_Objects/Promise/prototype -tags: - - JavaScript - - Promise - - Property - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise -translation_of_original: Web/JavaScript/Reference/Global_Objects/Promise/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>Promise.prototype</code></strong> 속성은 {{jsxref("Promise")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="설명">설명</h2> - -<p>{{jsxref("Promise")}} 인스턴스는 {{jsxref("Promise.prototype")}}을 상속합니다. 모든 <code>Promise</code> 인스턴스에 속성 또는 메서드를 추가하기 위해 생성자의 프로토타입 객체를 사용할 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Promise.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 만드는 함수를 반환합니다. 기본값은 {{jsxref("Promise")}} 함수입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("Promise.prototype.catch()")}}</dt> - <dd>프로미스(promise)에 거부 처리기 콜백을 추가하고 호출된 경우 콜백의 반환값 또는 프로미스가 대신 이행된 경우 그 원래 이행(fulfillment)값으로 결정하는(resolving) 새 프로미스를 반환합니다.</dd> - <dt>{{jsxref("Promise.prototype.then()")}}</dt> - <dd>프로미스에 이행 또는 거부 처리기를 추가하고 호출된 처리기의 반환값 또는 프로미스가 처리되지 않은 경우 그 원래 처리된(settled) 값으로 결정하는 새 프로미스를 반환합니다 (즉 관련 처리기 <code>onFulfilled</code> 또는 <code>onRejected</code>가 <code>undefined</code>인 경우).</dd> - <dt>{{jsxref("Promise.prototype.finally()")}}</dt> - <dd>Appends a handler to the promise, and returns a new promise which is resolved when the original promise is resolved. The handler is called when the promise is settled, whether fulfilled or rejected.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">명세</th> - <th scope="col">상태</th> - <th scope="col">설명</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-promise.prototype', 'Promise.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>초기 정의.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.prototype', 'Promise.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> - -<p>{{Compat("javascript.builtins.Promise.prototype")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/proxy/handler/apply/index.html b/files/ko/web/javascript/reference/global_objects/proxy/proxy/apply/index.html index b4928da1d8..b4928da1d8 100644 --- a/files/ko/web/javascript/reference/global_objects/proxy/handler/apply/index.html +++ b/files/ko/web/javascript/reference/global_objects/proxy/proxy/apply/index.html diff --git a/files/ko/web/javascript/reference/global_objects/proxy/handler/index.html b/files/ko/web/javascript/reference/global_objects/proxy/proxy/index.html index d153c621c6..d153c621c6 100644 --- a/files/ko/web/javascript/reference/global_objects/proxy/handler/index.html +++ b/files/ko/web/javascript/reference/global_objects/proxy/proxy/index.html diff --git a/files/ko/web/javascript/reference/global_objects/set/prototype/index.html b/files/ko/web/javascript/reference/global_objects/set/prototype/index.html deleted file mode 100644 index 8183d348a9..0000000000 --- a/files/ko/web/javascript/reference/global_objects/set/prototype/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: Set.prototype -slug: Web/JavaScript/Reference/Global_Objects/Set/prototype -tags: - - ECMAScript 2015 - - JavaScript - - Property - - Reference - - set -translation_of: Web/JavaScript/Reference/Global_Objects/Set -translation_of_original: Web/JavaScript/Reference/Global_Objects/Set/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>Set.prototype</strong></code> 속성은 {{jsxref("Set")}} 생성자의 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="설명">설명</h2> - -<p>{{jsxref("Set")}} 인스턴스는 {{jsxref("Set.prototype")}}에서 상속합니다. 모든 <code>Set</code> 인스턴스에 속성 또는 메서드를 추가하기 위해 생성자의 프로토타입 객체를 사용할 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>Set.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 만든 함수를 반환합니다. 이는 기본으로 {{jsxref("Set")}} 함수입니다.</dd> - <dt>{{jsxref("Set.prototype.size")}}</dt> - <dd><code>Set</code> 객체 내 값의 개수를 반환합니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("Set.add", "Set.prototype.add(value)")}}</dt> - <dd><code>Set</code> 객체에 주어진 값을 갖는 새로운 요소를 추가합니다. <code>Set</code> 객체를 반환합니다.</dd> - <dt>{{jsxref("Set.prototype.clear()")}}</dt> - <dd><code>Set</code> 객체에서 모든 요소를 제거합니다.</dd> - <dt>{{jsxref("Set.delete", "Set.prototype.delete(value)")}}</dt> - <dd><code>value</code>와 관련된 요소를 제거하고 <code>Set.prototype.has(value)</code>가 이전에 반환했던 값을 반환합니다. <code>Set.prototype.has(value)</code>는 그 뒤에 <code>false</code>를 반환합니다.</dd> - <dt>{{jsxref("Set.prototype.entries()")}}</dt> - <dd>삽입 순으로 <code>Set</code> 객체 내 각 값에 대한 <strong><code>[value, value]</code> 배열</strong>을 포함하는 새로운 <code>Iterator</code> 객체를 반환합니다. 이는 <code>Map</code> 객체와 비슷하게 유지되므로 여기서 각 항목은 그 <em>key</em>와 <em>value</em>에 대해 같은 값을 갖습니다.</dd> - <dt>{{jsxref("Set.forEach", "Set.prototype.forEach(callbackFn[, thisArg])")}}</dt> - <dd>삽입 순으로 <code>Set</code> 객체 내에 있는 각 값에 대해 한 번 <code>callbackFn</code>을 호출합니다. <code>thisArg</code> 매개변수가 <code>forEach</code>에 제공된 경우, 이는 각 콜백에 대해 <code>this</code> 값으로 사용됩니다.</dd> - <dt>{{jsxref("Set.has", "Set.prototype.has(value)")}}</dt> - <dd><code>Set</code> 객체 내 주어진 값을 갖는 요소가 있는지를 주장하는(asserting, 나타내는) boolean을 반환합니다.</dd> - <dt>{{jsxref("Set.prototype.keys()")}}</dt> - <dd><strong><code>values()</code></strong> 함수와 같은 함수로 삽입 순으로 <code>Set</code> 객체 내 각 요소에 대한 값을 포함하는 새로운 <code>Iterator</code> 객체를 반환합니다.</dd> - <dt>{{jsxref("Set.prototype.values()")}}</dt> - <dd>삽입 순으로 <code>Set</code> 객체 내 각 요소에 대한 <strong>값</strong>을 포함하는 새로운 <code>Iterator</code> 객체를 반환합니다.</dd> - <dt>{{jsxref("Set.prototype.@@iterator()", "Set.prototype[@@iterator]()")}}</dt> - <dd>삽입 순으로 <code>Set</code> 객체 내 각 요소에 대한 <strong>값</strong>을 포함하는 새로운 <code>Iterator</code> 객체를 반환합니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">명세</th> - <th scope="col">상태</th> - <th scope="col">설명</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-set.prototype', 'Set.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>초기 정의.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-set.prototype', 'Set.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.builtins.Set.prototype")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("Map.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/sharedarraybuffer/prototype/index.html b/files/ko/web/javascript/reference/global_objects/sharedarraybuffer/prototype/index.html deleted file mode 100644 index 849b70c1c6..0000000000 --- a/files/ko/web/javascript/reference/global_objects/sharedarraybuffer/prototype/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: SharedArrayBuffer.prototype -slug: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/prototype -tags: - - JavaScript - - SharedArrayBuffer - - TypedArrays - - 공유 메모리 - - 속성 -translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer -translation_of_original: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/prototype ---- -<div>{{JSRef}}</div> - -<p><strong><code>SharedArrayBuffer.prototype</code></strong> 속성은 {{jsxref("SharedArrayBuffer")}} 객체를위한 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="설명">설명</h2> - -<p><code>SharedArrayBuffer</code> 인스턴스는 <code>SharedArrayBuffer.prototype</code> 을 상속합니다. 모든 생성자와 마찬가지로, 생성자의 프로토타입 객체를 변경하여 모든 <code>SharedArrayBuffer</code> 인스턴스에 변화를 줄 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt>SharedArrayBuffer.prototype.constructor</dt> - <dd>객체의 프로토타입을 생성하는 함수를 지정합니다. 초기 값은 <code>SharedArrayBuffer</code> 생성자에 내장된 표준입니다.</dd> - <dt>{{jsxref("SharedArrayBuffer.prototype.byteLength")}} {{readonlyInline}}</dt> - <dd>배열의 바이트 크기입니다. 배열이 생성되고 수정이 불가할 때 지정됩니다. <strong>읽기 전용입니다.</strong></dd> -</dl> - -<h2 id="메소드">메소드</h2> - -<dl> - <dt>{{jsxref("SharedArrayBuffer.slice", "SharedArrayBuffer.prototype.slice(begin, end)")}}</dt> - <dd><code>begin</code> 부터 <code>end</code> 까지의 모든 것을 포함하는 <code>SharedArrayBuffer</code> 바이트의 복사본을 컨텐츠로 갖는 새로운 <code>SharedArrayBuffer</code> 를 반환합니다. <code>begin</code> 또는 <code>end</code> 가 음수인 경우, 인덱스는 배열의 끝에서부터이고 반대인 경우 시작부터입니다.</dd> -</dl> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">명세</th> - <th scope="col">상태</th> - <th scope="col">코멘트</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-sharedarraybuffer.prototype', 'SharedArrayBuffer.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td>ES2017 에서 초기 정의.</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.builtins.SharedArrayBuffer.prototype")}}</p> - -<h2 id="함께_보기">함께 보기</h2> - -<ul> - <li>{{jsxref("SharedArrayBuffer")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/string/prototype/index.html b/files/ko/web/javascript/reference/global_objects/string/prototype/index.html deleted file mode 100644 index fa32999954..0000000000 --- a/files/ko/web/javascript/reference/global_objects/string/prototype/index.html +++ /dev/null @@ -1,219 +0,0 @@ ---- -title: String.prototype -slug: Web/JavaScript/Reference/Global_Objects/String/prototype -tags: - - JavaScript - - Property - - Prototype - - String -translation_of: Web/JavaScript/Reference/Global_Objects/String -translation_of_original: Web/JavaScript/Reference/Global_Objects/String/prototype ---- -<div>{{JSRef("Global_Objects", "String")}}</div> - -<h2 id="Summary" name="Summary">요약</h2> - -<p><strong><code>String.prototype</code></strong> 프라퍼티는 {{jsxref("Global_Objects/String", "String")}} 프로토타입 오브젝트를 표현하고 있습니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="Description" name="Description">설명</h2> - -<p>모든 {{jsxref("Global_Objects/String", "String")}} 인스턴스들은 <code>String.prototype</code>를 상속합니다. <code>String</code> 프라퍼티 오브젝트를 변경하면, 그 변경은 모든 {{jsxref("Global_Objects/String", "String")}} 인스턴스들에 영향을 주게 됩니다.</p> - -<h2 id="Properties" name="Properties">Properties</h2> - -<dl> - <dt><code>String.prototype.constructor</code></dt> - <dd>오브젝트의 프로토타입을 생성하는 함수를 명세합니다.</dd> - <dt>{{jsxref("String.prototype.length")}}</dt> - <dd>문자열의 길이를 반영합니다.</dd> - <dt><code><em>N</em></code></dt> - <dd><em>N</em>번째 위치에 있는 문자에 접근하기 위해 사용합니다. <em>N</em> 은 0과 {{jsxref("String.length", "length")}}보다 작은 값 사이에 있는 양의 정수입니다. 이 퍼라퍼티들은 읽기 전용(read-only) 속성을 가지고 있습니다. </dd> -</dl> - -<h2 id="Methods" name="Methods">메서드</h2> - -<h3 id="Methods_unrelated_to_HTML" name="Methods_unrelated_to_HTML">HTML과 관련이 없는 메서드</h3> - -<dl> - <dt>{{jsxref("String.prototype.charAt()")}}</dt> - <dd>문자열 내 특정 위치(index)에 있는 문자를 반환합니다.</dd> - <dt>{{jsxref("String.prototype.charCodeAt()")}}</dt> - <dd>문자열 내 주어진 위치(index)에 있는 문자의 유니코드 값을 반환합니다.</dd> - <dt>{{jsxref("String.prototype.codePointAt()")}} {{experimental_inline}}</dt> - <dd>주어진 위치에 있는 UTF-16으로 인코딩된 코드 포인터값인 음수가 아닌 정수값을 반환합니다. </dd> - <dt>{{jsxref("String.prototype.concat()")}}</dt> - <dd>두 문자열의 문자를 합쳐서 새로운 문자열로 만든 다음, 그 새로운 문자열을 반환합니다. </dd> - <dt>{{jsxref("String.prototype.includes()")}} {{experimental_inline}}</dt> - <dd>문자열 내에 찾고자 하는 문자열이 있는지를 확인합니다. </dd> - <dt>{{jsxref("String.prototype.endsWith()")}} {{experimental_inline}}</dt> - <dd>문자열에서 특정 문자열로 끝나는지를 확인할 수 있습니다.</dd> - <dt>{{jsxref("String.prototype.indexOf()")}}</dt> - <dd>{{jsxref("Global_Objects/String", "String")}} 오브젝트에 있는 특정 값이 일치하는 첫 번째 인덱스 값을 반환하며, 일치하는 값이 없을 경우에는 -1을 반환합니다.</dd> - <dt>{{jsxref("String.prototype.lastIndexOf()")}}</dt> - <dd><a href="https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String" title="String 글로벌 오브젝트는 문자열의 생성자, 또는 문자열의 순서입니다."><code>String</code></a> 오브젝트에서 <code>fromIndex</code>로부터 반대방향으로 찾기 시작하여 특정 값이 일치하는 마지막 인덱스를 반환합니다. 문자열에서 일치하는 특정 값이 없으면 <code>-1</code>을 리턴합니다.</dd> - <dt>{{jsxref("String.prototype.localeCompare()")}}</dt> - <dd>Returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.</dd> - <dt>{{jsxref("String.prototype.match()")}}</dt> - <dd>Used to match a regular expression against a string.</dd> - <dt>{{jsxref("String.prototype.normalize()")}} {{experimental_inline}}</dt> - <dd>Returns the Unicode Normalization Form of the calling string value.</dd> - <dt><s class="obsoleteElement">{{jsxref("String.prototype.quote()")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement">Wraps the string in double quotes ("<code>"</code>").</s></dd> - <dt>{{jsxref("String.prototype.repeat()")}} {{experimental_inline}}</dt> - <dd>Returns a string consisting of the elements of the object repeated the given times.</dd> - <dt>{{jsxref("String.prototype.replace()")}}</dt> - <dd>Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.</dd> - <dt>{{jsxref("String.prototype.search()")}}</dt> - <dd>Executes the search for a match between a regular expression and a specified string.</dd> - <dt>{{jsxref("String.prototype.slice()")}}</dt> - <dd>Extracts a section of a string and returns a new string.</dd> - <dt>{{jsxref("String.prototype.split()")}}</dt> - <dd>Splits a {{jsxref("Global_Objects/String", "String")}} object into an array of strings by separating the string into substrings.</dd> - <dt>{{jsxref("String.prototype.startsWith()")}} {{experimental_inline}}</dt> - <dd>Determines whether a string begins with the characters of another string.</dd> - <dt>{{jsxref("String.prototype.substr()")}}</dt> - <dd>Returns the characters in a string beginning at the specified location through the specified number of characters.</dd> - <dt>{{jsxref("String.prototype.substring()")}}</dt> - <dd>Returns the characters in a string between two indexes into the string.</dd> - <dt>{{jsxref("String.prototype.toLocaleLowerCase()")}}</dt> - <dd>The characters within a string are converted to lower case while respecting the current locale. For most languages, this will return the same as {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}.</dd> - <dt>{{jsxref("String.prototype.toLocaleUpperCase()")}}</dt> - <dd>The characters within a string are converted to upper case while respecting the current locale. For most languages, this will return the same as {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}.</dd> - <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt> - <dd>Returns the calling string value converted to lower case.</dd> - <dt>{{jsxref("String.prototype.toSource()")}} {{non-standard_inline}}</dt> - <dd>Returns an object literal representing the specified object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.</dd> - <dt>{{jsxref("String.prototype.toString()")}}</dt> - <dd>Returns a string representing the specified object. Overrides the {{jsxref("Object.prototype.toString()")}} method.</dd> - <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt> - <dd>Returns the calling string value converted to uppercase.</dd> - <dt>{{jsxref("String.prototype.trim()")}}</dt> - <dd>Trims whitespace from the beginning and end of the string. Part of the ECMAScript 5 standard.</dd> - <dt>{{jsxref("String.prototype.trimLeft()")}} {{non-standard_inline}}</dt> - <dd>Trims whitespace from the left side of the string.</dd> - <dt>{{jsxref("String.prototype.trimRight()")}} {{non-standard_inline}}</dt> - <dd>Trims whitespace from the right side of the string.</dd> - <dt>{{jsxref("String.prototype.valueOf()")}}</dt> - <dd>Returns the primitive value of the specified object. Overrides the {{jsxref("Object.prototype.valueOf()")}} method.</dd> - <dt>{{jsxref("String.prototype.@@iterator()", "String.prototype[@@iterator]()")}} {{experimental_inline}}</dt> - <dd>Returns a new <code>Iterator</code> object that iterates over the code points of a String value, returning each code point as a String value.</dd> -</dl> - -<h3 id="HTML_wrapper_methods" name="HTML_wrapper_methods">HTML wrapper methods</h3> - -<p>These methods are of limited use, as they provide only a subset of the available HTML tags and attributes.</p> - -<dl> - <dt>{{jsxref("String.prototype.big()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("big")}}</dd> - <dt>{{jsxref("String.prototype.blink()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("blink")}}</dd> - <dt>{{jsxref("String.prototype.bold()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("b")}}</dd> - <dt>{{jsxref("String.prototype.fixed()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("tt")}}</dd> - <dt>{{jsxref("String.prototype.fontcolor()")}} {{deprecated_inline}}</dt> - <dd>{{htmlattrxref("color", "font", "<font color=\"color\">")}}</dd> - <dt>{{jsxref("String.prototype.fontsize()")}} {{deprecated_inline}}</dt> - <dd>{{htmlattrxref("size", "font", "<font size=\"size\">")}}</dd> - <dt>{{jsxref("String.prototype.italics()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("i")}}</dd> - <dt>{{jsxref("String.prototype.link()")}}</dt> - <dd>{{htmlattrxref("href", "a", "<a href=\"rul\">")}} (link to URL)</dd> - <dt>{{jsxref("String.prototype.small()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("small")}}</dd> - <dt>{{jsxref("String.prototype.strike()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("strike")}}</dd> - <dt>{{jsxref("String.prototype.sub()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("sub")}}</dd> - <dt>{{jsxref("String.prototype.sup()")}} {{deprecated_inline}}</dt> - <dd>{{HTMLElement("sup")}}</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>ECMAScript 1st Edition.</td> - <td>Standard</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.5.3.1', 'String.prototype')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-string.prototype', 'String.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="See_also" name="See_also">See also</h2> - -<ul> - <li>{{jsxref("Global_Objects/String", "String")}}</li> - <li>{{jsxref("Function.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/syntaxerror/prototype/index.html b/files/ko/web/javascript/reference/global_objects/syntaxerror/prototype/index.html deleted file mode 100644 index aa38e80799..0000000000 --- a/files/ko/web/javascript/reference/global_objects/syntaxerror/prototype/index.html +++ /dev/null @@ -1,127 +0,0 @@ ---- -title: SyntaxError.prototype -slug: Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError -translation_of_original: Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>SyntaxError.prototype </strong></code>속성은 {{jsxref("SyntaxError")}} 객체의 생성자 프로토타입을 표현합니다.</p> - -<h2 id="설명">설명</h2> - -<p>모든 {{jsxref("SyntaxError")}} 인스턴스는 <code>SyntaxError.prototype </code>객체로부터<code> </code>상속 받습니다. 또한, 속성이나 메소드를 추가할 때 모든 인스턴스에 프로토타입을 사용 할 수 있습니다.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>SyntaxError.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 생성하는 함수를 명시합니다.</dd> - <dt>{{jsxref("Error.prototype.message", "SyntaxError.prototype.message")}}</dt> - <dd>에러 메시지. 비록 ECMA-262는 {{jsxref("SyntaxError")}} 가 고유의 <code>message</code> 속성을 제공해야 한다고 명시하고 있지만, <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 에서는, {{jsxref("Error.prototype.message")}}를 상속 받습니다. </dd> - <dt>{{jsxref("Error.prototype.name", "SyntaxError.prototype.name")}}</dt> - <dd>에러명. {{jsxref("Error")}}로부터 상속 받습니다.</dd> - <dt>{{jsxref("Error.prototype.fileName", "SyntaxError.prototype.fileName")}}</dt> - <dd>에러를 발생시킨 파일의 경로. {{jsxref("Error")}}로부터 상속 받습니다.</dd> - <dt>{{jsxref("Error.prototype.lineNumber", "SyntaxError.prototype.lineNumber")}}</dt> - <dd>에러가 발생한 파일의 코드 라인 넘버. {{jsxref("Error")}}로부터 상속 받습니다.</dd> - <dt>{{jsxref("Error.prototype.columnNumber", "SyntaxError.prototype.columnNumber")}}</dt> - <dd>에러가 발생된 라인의 컬럼 넘버. {{jsxref("Error")}}로부터 상속 받습니다.</dd> - <dt>{{jsxref("Error.prototype.stack", "SyntaxError.prototype.stack")}}</dt> - <dd>스택 트레이스. {{jsxref("Error")}}로부터 상속 받습니다.</dd> -</dl> - -<h2 id="메소드">메소드</h2> - -<p>비록 {{jsxref("SyntaxError")}} 프로토타입 객체는 고유의 메소드를 가지고 있지는 않지만, {{jsxref("SyntaxError")}} 인스턴스는 몇 가지의 메소드를 프로토타입 체인을 통하여 상속 받습니다.</p> - -<h2 id="스펙">스펙</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES3')}}</td> - <td>{{Spec2('ES3')}}</td> - <td>초기 정의.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td><code><em>NativeError</em>.prototype</code>로 정의.</td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td><code><em>NativeError</em>.prototype</code>로 정의.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td><code><em>NativeError</em>.prototype</code>로 정의.</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="참조">참조</h2> - -<ul> - <li>{{jsxref("Error.prototype")}}</li> - <li>{{jsxref("Function.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/typedarray/prototype/index.html b/files/ko/web/javascript/reference/global_objects/typedarray/prototype/index.html deleted file mode 100644 index 75f63010bf..0000000000 --- a/files/ko/web/javascript/reference/global_objects/typedarray/prototype/index.html +++ /dev/null @@ -1,176 +0,0 @@ ---- -title: TypedArray.prototype -slug: Web/JavaScript/Reference/Global_Objects/TypedArray/prototype -tags: - - JavaScript - - Property - - TypedArray -translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray -translation_of_original: Web/JavaScript/Reference/Global_Objects/TypedArray/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>TypedArray</strong></code><strong><code>.prototype</code></strong> 속성(property)은 {{jsxref("TypedArray")}} 생성자에 대한 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="설명">설명</h2> - -<p>{{jsxref("TypedArray")}} 인스턴스는 {{jsxref("TypedArray.prototype")}}을 상속합니다. 모든 <em>TypedArray</em> 인스턴스에 속성 또는 메서드를 추가하기 위해 생성자의 프로토타입 객체를 사용할 수 있으며, <em>TypedArray</em>는 <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_객체">TypedArray 객체 유형</a> 중 하나입니다.</p> - -<p>상속에 관한 자세한 정보를 위해 <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#설명"><em>TypedArray</em></a>에 대한 설명도 참조하세요.</p> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>TypedArray.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 만든 함수를 반환합니다. 이는 기본으로 해당 <a href="/ko/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_객체">TypedArray 객체 유형</a> 함수 중 하나입니다.</dd> - <dt>{{jsxref("TypedArray.prototype.buffer")}} {{readonlyInline}}</dt> - <dd>형식화 배열에 의해 참조되는 {{jsxref("ArrayBuffer")}}를 반환합니다. 생성 시에 고정되기에 <strong>읽기 전용</strong>.</dd> - <dt>{{jsxref("TypedArray.prototype.byteLength")}} {{readonlyInline}}</dt> - <dd>{{jsxref("ArrayBuffer")}}의 시작점부터 형식화 배열의 길이(단위 바이트)를 반환합니다. 생성 시에 고정되기에 <strong>읽기 전용</strong>.</dd> - <dt>{{jsxref("TypedArray.prototype.byteOffset")}} {{readonlyInline}}</dt> - <dd>{{jsxref("ArrayBuffer")}}의 시작점부터 형식화 배열의 오프셋(단위 바이트)을 반환합니다. 생성 시에 고정되기에 <strong>읽기 전용</strong>.</dd> - <dt>{{jsxref("TypedArray.prototype.length")}} {{readonlyInline}}</dt> - <dd>형식화 배열 내 보유한 요소의 수를 반환합니다. 생성 시에 고정되기에 <strong>읽기 전용</strong>.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("TypedArray.prototype.copyWithin()")}}</dt> - <dd>배열 내부 일련의 배열 요소를 복사합니다. {{jsxref("Array.prototype.copyWithin()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.entries()")}}</dt> - <dd>배열 내 각 인덱스에 대한 키/값 쌍을 포함하는 새로운 <code>Array Iterator</code> 객체를 반환합니다. {{jsxref("Array.prototype.entries()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.every()")}}</dt> - <dd>배열의 모든 요소가 함수로 제공되는 테스트를 통과하는지를 테스트합니다. {{jsxref("Array.prototype.every()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.fill()")}}</dt> - <dd>시작 인덱스부터 끝 인덱스까지 배열의 모든 요소를 고정값으로 채웁니다. {{jsxref("Array.prototype.fill()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.filter()")}}</dt> - <dd>제공되는 필터링 함수가 true를 반환하는 이 배열의 모든 요소를 갖는 새로운 배열을 생성합니다. {{jsxref("Array.prototype.filter()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.find()")}}</dt> - <dd>배열 내 요소가 제공되는 테스트 함수를 만족하는 경우 배열 내 찾은 값 또는 못 찾은 경우 <code>undefined</code>를 반환합니다. {{jsxref("Array.prototype.find()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.findIndex()")}}</dt> - <dd>배열 내 요소가 제공되는 테스트 함수를 만족하는 경우 배열 내 찾은 인덱스 또는 못 찾은 경우 -1을 반환합니다. {{jsxref("Array.prototype.findIndex()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.forEach()")}}</dt> - <dd>배열 내 각 요소에 대해 함수를 호출합니다. {{jsxref("Array.prototype.forEach()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.includes()")}} {{experimental_inline}}</dt> - <dd>형식화 배열이 특정 요소를 포함하는지를 판단해, 적절히 <code>true</code> 또는 <code>false</code>를 반환합니다. {{jsxref("Array.prototype.includes()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.indexOf()")}}</dt> - <dd>지정된 값과 같은 배열 내부 요소의 첫(최소) 인덱스 또는 못 찾은 경우 -1을 반환합니다. {{jsxref("Array.prototype.indexOf()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.join()")}}</dt> - <dd>배열의 모든 요소를 문자열로 합칩니다. {{jsxref("Array.prototype.join()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.keys()")}}</dt> - <dd>배열의 각 인덱스에 대한 키를 포함하는 새로운 <code>Array Iterator</code>를 반환합니다. {{jsxref("Array.prototype.keys()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</dt> - <dd>지정된 값과 같은 배열 내부 요소의 끝(최대) 인덱스 또는 못 찾은 경우 -1을 반환합니다. {{jsxref("Array.prototype.lastIndexOf()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.map()")}}</dt> - <dd>이 배열의 모든 요소에 제공된 함수를 호출한 결과를 갖는 새로운 배열을 생성합니다. {{jsxref("Array.prototype.map()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> - <dd>{{jsxref("TypedArray.prototype.copyWithin()")}}의 이전 비표준 버전.</dd> - <dt>{{jsxref("TypedArray.prototype.reduce()")}}</dt> - <dd>누산기(accumulator) 및 배열의 각 값(좌에서 우로)에 대해 한 값으로 줄도록 함수를 적용합니다. {{jsxref("Array.prototype.reduce()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.reduceRight()")}}</dt> - <dd>누산기 및 배열의 각 값(우에서 좌로)에 대해 한 값으로 줄도록 함수를 적용합니다. {{jsxref("Array.prototype.reduceRight()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.reverse()")}}</dt> - <dd>배열 요소의 순서를 뒤집습니다 — 처음이 마지막이 되고 마지막이 처음이 됩니다. {{jsxref("Array.prototype.reverse()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.set()")}}</dt> - <dd>형식화 배열에 여러 값을 저장합니다, 지정된 배열에서 입력 값을 읽어.</dd> - <dt>{{jsxref("TypedArray.prototype.slice()")}}</dt> - <dd>배열의 한 부분을 추출하여 새로운 배열을 반환합니다. {{jsxref("Array.prototype.slice()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.some()")}}</dt> - <dd>이 배열의 적어도 한 요소가 제공된 테스트 함수를 만족하는 경우 true를 반환합니다. {{jsxref("Array.prototype.some()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.sort()")}}</dt> - <dd>배열의 요소를 적소에 정렬해 그 배열을 반환합니다. {{jsxref("Array.prototype.sort()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.subarray()")}}</dt> - <dd>주어진 시작 및 끝 요소 인덱스로부터 새로운 TypedArray를 반환합니다.</dd> - <dt>{{jsxref("TypedArray.prototype.values()")}}</dt> - <dd>배열의 각 인덱스에 대한 값을 포함하는 새로운 <code>Array Iterator</code> 객체를 반환합니다. {{jsxref("Array.prototype.values()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.toLocaleString()")}}</dt> - <dd>배열 및 그 요소를 나타내는 지역화된 문자열을 반환합니다. {{jsxref("Array.prototype.toLocaleString()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.toString()")}}</dt> - <dd>배열 및 그 요소를 나타내는 문자열을 반환합니다. {{jsxref("Array.prototype.toString()")}}도 참조.</dd> - <dt>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</dt> - <dd>배열의 각 인덱스에 대한 값을 포함하는 새로운 <code>Array Iterator</code> 객체를 반환합니다.</dd> -</dl> - -<h2 id="스펙">스펙</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">스펙</th> - <th scope="col">상태</th> - <th scope="col">설명</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-properties-of-the-%typedarrayprototype%-object', 'TypedArray prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>초기 정의.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-properties-of-the-%typedarrayprototype%-object', 'TypedArray prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>7.0</td> - <td>{{ CompatGeckoDesktop("2") }}</td> - <td>10</td> - <td>11.6</td> - <td>5.1</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>4.0</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{ CompatGeckoMobile("2") }}</td> - <td>10</td> - <td>11.6</td> - <td>4.2</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="참조">참조</h2> - -<ul> - <li><a href="/ko/docs/Web/JavaScript/Typed_arrays">JavaScript 형식화 배열</a></li> - <li>{{jsxref("TypedArray")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/weakmap/prototype/index.html b/files/ko/web/javascript/reference/global_objects/weakmap/prototype/index.html deleted file mode 100644 index fa2ad9691d..0000000000 --- a/files/ko/web/javascript/reference/global_objects/weakmap/prototype/index.html +++ /dev/null @@ -1,143 +0,0 @@ ---- -title: WeakMap.prototype -slug: Web/JavaScript/Reference/Global_Objects/WeakMap/prototype -tags: - - ECMAScript6 - - JavaScript - - Property - - WeakMap -translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap -translation_of_original: Web/JavaScript/Reference/Global_Objects/WeakMap/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>WeakMap.prototype</strong></code> 속성(property)은 {{jsxref("WeakMap")}} 생성자에 대한 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="설명">설명</h2> - -<p>{{jsxref("WeakMap")}} 인스턴스는 {{jsxref("WeakMap.prototype")}}에서 상속합니다. 모든 <code>WeakMap</code> 인스턴스에 속성 또는 메서드를 추가하기 위해 생성자의 프로토타입 객체를 사용할 수 있습니다.</p> - -<p><code>WeakMap.prototype</code>은 그 자체로 그냥 평범한 객체입니다:</p> - -<pre class="brush: js">Object.prototype.toString.call(WeakMap.prototype); // "[object Object]"</pre> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>WeakMap.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 생성한 함수를 반환합니다. 이는 기본으로 {{jsxref("WeakMap")}} 함수입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("WeakMap.delete", "WeakMap.prototype.delete(key)")}}</dt> - <dd><code>key</code>와 관련된 모든 값을 제거합니다. <code>WeakMap.prototype.has(key)</code>는 그 뒤에 <code>false</code>를 반환합니다.</dd> - <dt>{{jsxref("WeakMap.get", "WeakMap.prototype.get(key)")}}</dt> - <dd><code>key</code>와 관련된 값 또는 관련 값이 없는 경우 <code>undefined</code>를 반환합니다.</dd> - <dt>{{jsxref("WeakMap.has", "WeakMap.prototype.has(key)")}}</dt> - <dd><code>WeakMap</code> 객체 내 <code>key</code>와 관련된 값이 있는지 여부를 주장하는(asserting, 나타내는) boolean을 반환합니다.</dd> - <dt>{{jsxref("WeakMap.set", "WeakMap.prototype.set(key, value)")}}</dt> - <dd><code>WeakMap</code> 객체 내 <code>key</code>에 대해 값을 설정합니다. <code>WeakMap</code> 객체를 반환합니다.</dd> - <dt><s class="obsoleteElement">{{jsxref("WeakMap.prototype.clear()")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement"><code>WeakMap</code> 객체에서 모든 키/값 쌍을 제거합니다. 메서드가 없는 <code>WeakMap</code> 객체를 캡슐화하여 <code>.clear()</code> 메서드가 있는 <code>WeakMap</code> 같은 객체 구현이 가능함을 주의하세요 ({{jsxref("WeakMap")}} 페이지 예 참조)</s></dd> -</dl> - -<h2 id="스펙">스펙</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">스펙</th> - <th scope="col">상태</th> - <th scope="col">설명</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>초기 정의.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>36</td> - <td>{{CompatGeckoDesktop("6.0")}}</td> - <td>11</td> - <td>23</td> - <td>7.1</td> - </tr> - <tr> - <td>Ordinary object</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoDesktop("40")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatGeckoMobile("6.0")}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>8</td> - </tr> - <tr> - <td>Ordinary object</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("40")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="참조">참조</h2> - -<ul> - <li>{{jsxref("Map.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/weakset/prototype/index.html b/files/ko/web/javascript/reference/global_objects/weakset/prototype/index.html deleted file mode 100644 index 0c75408df5..0000000000 --- a/files/ko/web/javascript/reference/global_objects/weakset/prototype/index.html +++ /dev/null @@ -1,142 +0,0 @@ ---- -title: WeakSet.prototype -slug: Web/JavaScript/Reference/Global_Objects/WeakSet/prototype -tags: - - ECMAScript6 - - JavaScript - - Property - - WeakSet -translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet -translation_of_original: Web/JavaScript/Reference/Global_Objects/WeakSet/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>WeakSet.prototype</strong></code> 속성(property)은 {{jsxref("WeakSet")}} 생성자에 대한 프로토타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0,0,0)}}</div> - -<h2 id="설명">설명</h2> - -<p>{{jsxref("WeakSet")}} 인스턴스는 {{jsxref("WeakSet.prototype")}}에서 상속합니다. 모든 <code>WeakSet</code> 인스턴스에 속성 또는 메서드를 추가하기 위해 생성자의 프로토타입 객체를 사용할 수 있습니다.</p> - -<p><code>WeakSet.prototype</code>은 그 자체로 그냥 평범한 객체입니다:</p> - -<pre class="brush: js">Object.prototype.toString.call(WeakSet.prototype); // "[object Object]"</pre> - -<h2 id="속성">속성</h2> - -<dl> - <dt><code>WeakSet.prototype.constructor</code></dt> - <dd>인스턴스의 프로토타입을 생성한 함수를 반환합니다. 이는 기본으로 {{jsxref("WeakSet")}} 함수입니다.</dd> -</dl> - -<h2 id="메서드">메서드</h2> - -<dl> - <dt>{{jsxref("WeakSet.add", "WeakSet.prototype.add(value)")}}</dt> - <dd><code>WeakSet</code> 객체에 주어진 값을 갖는 새로운 객체를 추가합니다.</dd> - <dt>{{jsxref("WeakSet.delete", "WeakSet.prototype.delete(value)")}}</dt> - <dd><code>value</code>와 관련된 요소를 제거합니다. <code>WeakSet.prototype.has(value)</code>는 그 뒤에 <code>false</code>를 반환합니다.</dd> - <dt>{{jsxref("WeakSet.has", "WeakSet.prototype.has(value)")}}</dt> - <dd><code>WeakSet</code> 객체 내 주어진 값을 갖는 요소가 존재하는 지 여부를 주장하는(asserting, 나타내는) boolean을 반환합니다.</dd> - <dt><s class="obsoleteElement">{{jsxref("WeakSet.prototype.clear()")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement"><code>WeakSet</code> 객체에서 모든 요소를 제거합니다.</s></dd> -</dl> - -<h2 id="스펙">스펙</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">스펙</th> - <th scope="col">상태</th> - <th scope="col">설명</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-weakset.prototype', 'WeakSet.prototype')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>초기 정의.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-weakset.prototype', 'WeakSet.prototype')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>36</td> - <td>{{ CompatGeckoDesktop(34) }}</td> - <td>{{CompatNo}}</td> - <td>23</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td>Ordinary object</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoDesktop("40")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome for Android</th> - <th>Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{ CompatGeckoMobile(34) }}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td>Ordinary object</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("40")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="참조">참조</h2> - -<ul> - <li>{{jsxref("Set.prototype")}}</li> - <li>{{jsxref("WeakMap.prototype")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/global_objects/webassembly/global/prototype/index.html b/files/ko/web/javascript/reference/global_objects/webassembly/global/prototype/index.html deleted file mode 100644 index c7c1c54bab..0000000000 --- a/files/ko/web/javascript/reference/global_objects/webassembly/global/prototype/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: WebAssembly.Global.prototype -slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Global -translation_of_original: Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/prototype ---- -<div>{{JSRef}}</div> - -<p><code><strong>WebAssembly.Global</strong></code><strong><code>.prototype</code></strong> 속성은 {{jsxref("WebAssembly.Global()")}} 생성자의 프로토 타입을 나타냅니다.</p> - -<div>{{js_property_attributes(0, 0, 0)}}</div> - -<h2 id="Description">Description</h2> - -<p>모든 {{jsxref("WebAssembly.Global")}} 인스턴스는 <code>Global.prototype</code>에서 상속받습니다. {{jsxref("WebAssembly.Global()")}} 생성자의 프로토 타입 객체는 모든 {{jsxref( "WebAssembly.Global")}} 인스턴스에 영향을 미치도록 수정할 수 있습니다.</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt><code>Global.prototype.constructor</code></dt> - <dd>이 객체의 인스턴스를 생성 한 함수를 돌려줍니다. 기본적으로 이것은 {{jsxref("WebAssembly.Global()")}} 생성자입니다.</dd> - <dt><code>Global.prototype[@@toStringTag]</code></dt> - <dd><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol/toStringTag">@@toStringTag</a> 속성의 초기 값은 String 값인 "WebAssembly.Global"입니다.</dd> - <dt><code>Global.prototype.value</code></dt> - <dd>전역 변수에 포함 된 값 - 전역 값을 직접 설정하고 가져 오는 데 사용할 수 있습니다.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt><code>Global.prototype.valueOf()</code></dt> - <dd>전역 변수에 포함 된 값을 반환하는 Old-style 메서드입니다.</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('WebAssembly JS', '#globals', 'WebAssembly.Global()')}}</td> - <td>{{Spec2('WebAssembly JS')}}</td> - <td>Initial draft definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> - -<div> - - -<p>{{Compat("javascript.builtins.WebAssembly.Global.prototype")}}</p> -</div> - -<div> - -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{jsxref("WebAssembly.Global()")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/operators/arithmetic_operators/index.html b/files/ko/web/javascript/reference/operators/arithmetic_operators/index.html deleted file mode 100644 index 3e61415550..0000000000 --- a/files/ko/web/javascript/reference/operators/arithmetic_operators/index.html +++ /dev/null @@ -1,291 +0,0 @@ ---- -title: 산술 연산자 -slug: Web/JavaScript/Reference/Operators/Arithmetic_Operators -tags: - - JavaScript - - Operator - - Reference -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Arithmetic_Operators ---- -<div>{{jsSidebar("Operators")}}</div> - -<p><span class="seoSummary"><strong>산술 연산자는</strong> 숫자 값(리터럴 또는 변수)을 피연산자로 받아 하나의 숫자 값을 반환합니다.</span> 표준 산술 연산자는 덧셈(+), 뺄셈(-), 곱셈(*), 나눗셈(/)입니다.</p> - -<div>{{EmbedInteractiveExample("pages/js/expressions-arithmetic.html")}}</div> - - - -<h2 id="덧셈"><a id="Addition" name="Addition">덧셈 (+)</a></h2> - -<p>덧셈 연산자는 숫자 피연산자를 더한 값, 또는 문자열을 연결한 값을 생성합니다.</p> - -<h3 id="구문">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> x + y -</pre> - -<h3 id="예제">예제</h3> - -<pre class="brush: js">// Number + Number -> 합 -1 + 2 // 3 - -// Boolean + Number -> 합 -true + 1 // 2 - -// Boolean + Boolean -> 합 -false + false // 0 - -// Number + String -> 연결 -5 + "foo" // "5foo" - -// String + Boolean -> 연결 -"foo" + false // "foofalse" - -// String + String -> 연결 -"foo" + "bar" // "foobar" -</pre> - -<h2 id="뺄셈_-"><a id="Subtraction" name="Subtraction">뺄셈 (-)</a></h2> - -<p>뺄셈 연산자는 두 개의 피연산자를 뺀 값을 생성합니다.</p> - -<h3 id="구문_2">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> x - y -</pre> - -<h3 id="예제_2">예제</h3> - -<pre class="brush: js">5 - 3 // 2 -3 - 5 // -2 -"foo" - 3 // NaN</pre> - -<h2 id="나눗셈"><a id="Division" name="Division">나눗셈 (/)</a></h2> - -<p>나눗셈 연산자는 왼쪽 피연산자를 피제수로, 오른쪽 피연산자를 제수로 한 몫을 생성합니다.</p> - -<h3 id="구문_3">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> x / y -</pre> - -<h3 id="예제_3">예제</h3> - -<pre class="brush: js">1 / 2 // JavaScript에선 0.5 -1 / 2 // Java에선 0 -// (양쪽 피연산자 모두 명시적인 부동소수점 숫자가 아님) - -1.0 / 2.0 // JavaScript와 Java 둘 다 0.5 - -2.0 / 0 // JavaScript에서 Infinity -2.0 / 0.0 // 동일하게 Infinity -2.0 / -0.0 // JavaScript에서 -Infinity</pre> - -<h2 id="곱셈_*"><a id="Multiplication" name="Multiplication">곱셈 (*)</a></h2> - -<p>곱셈 연산자는 두 연산자의 곱을 생성합니다.</p> - -<h3 id="구문_4">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> x * y -</pre> - -<h3 id="예제_4">예제</h3> - -<pre class="brush: js">2 * 2 // 4 --2 * 2 // -4 -Infinity * 0 // NaN -Infinity * Infinity // Infinity -"foo" * 2 // NaN -</pre> - -<h2 id="나머지"><a id="Remainder" name="Remainder">나머지 (%)</a></h2> - -<p>나머지 연산자는 왼쪽 피연산자를 오른쪽 피연산자로 나눴을 때의 나머지를 반환합니다. 결과는 항상 피제수의 부호를 따라갑니다.</p> - -<h3 id="구문_5">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> var1 % var2 -</pre> - -<h3 id="예제_5">예제</h3> - -<pre class="brush: js">12 % 5 // 2 --1 % 2 // -1 -NaN % 2 // NaN -1 % 2 // 1 -2 % 3 // 2 --4 % 2 // -0 -5.5 % 2 // 1.5 -</pre> - -<h2 id="거듭제곱_**"><a name="Exponentiation">거듭제곱 (**)</a></h2> - -<p>거듭제곱 연산자는 첫 번째 피연산자를 밑으로, 두 번째 피연산자를 지수로 한 값을 생성합니다. 즉, <code>var1</code>과 <code>var2</code>가 변수일 때, <code>var1<sup>var2</sup></code>의 값을 생성합니다. 거듭제곱 연산자는 우결합성을 가집니다. 따라서 <code>a ** b ** c</code>는 <code>a ** (b ** c)</code>와 같습니다.</p> - -<h3 id="구문_6">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> var1 ** var2 -</pre> - -<h3 id="참고">참고</h3> - -<p>PHP와 Python 등 거듭제곱 연산자를 가진 대부분의 언어는 거듭제곱 연산자의 우선순위가 +와 - 등 단항 연산자보다 높습니다. 그러나 Bash는 단항 연산자가 거듭제곱 연산자보다 우선순위가 높은 등 일부 예외도 있습니다. JavaScript는 단항 연산자(<code>+/-/~/!/delete/void/typeof</code>)를 왼쪽 피연산자 앞에 배치할 수 없으므로, 모호한 표현도 작성할 수 없습니다.</p> - -<pre class="brush: js">-2 ** 2; -// Bash에서 4, 다른 언어에서는 -4. -// 모호한 표현이므로 JavaScript에서는 유효하지 않음 - - --(2 ** 2); -// JavaScript에서 -4, 작성자의 의도가 명확함 -</pre> - -<h3 id="예제_6">예제</h3> - -<pre class="brush: js">2 ** 3 // 8 -3 ** 2 // 9 -3 ** 2.5 // 15.588457268119896 -10 ** -1 // 0.1 -NaN ** 2 // NaN - -2 ** 3 ** 2 // 512 -2 ** (3 ** 2) // 512 -(2 ** 3) ** 2 // 64 -</pre> - -<p>결과의 부호를 뒤집으려면 다음과 같이 작성합니다.</p> - -<pre class="brush: js">-(2 ** 2) // -4 -</pre> - -<p>거듭제곱의 밑을 음수로 강제하려면 다음과 같이 작성합니다.</p> - -<pre class="brush: js">(-2) ** 2 // 4 -</pre> - -<div class="note"> -<p><strong>참고:</strong> JavaScript는 <a href="/ko/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#Bitwise_XOR">비트 연산자 ^ (논리 XOR)</a>도 가지고 있습니다. <code>**</code>와 <code>^</code>는 다릅니다. (예 : <code>2 ** 3 === 8</code>이지만 <code>2 ^ 3 === 1</code>)</p> -</div> - -<h2 id="증가"><a id="Increment" name="Increment">증가 (++)</a></h2> - -<p>증가 연산자는 피연산자를 증가(1을 덧셈)시키고, 그 값을 반환합니다.</p> - -<ul> - <li>피연산자 뒤에 붙여(예: <code>x++</code>) 접미사로 사용한 경우 증가하기 전의 값을 반환합니다.</li> - <li>피연산자 앞에 붙여(예: <code>++x</code>) 접두사로 사용한 경우 증가한 후의 값을 반환합니다.</li> -</ul> - -<h3 id="구문_7">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> x++ or ++x -</pre> - -<h3 id="예제_7">예제</h3> - -<pre class="brush: js">// 접미사 -var x = 3; -y = x++; // y = 3, x = 4 - -// 접두사 -var a = 2; -b = ++a; // a = 3, b = 3 -</pre> - -<h2 id="감소_--"><a id="Decrement" name="Decrement">감소 (--)</a></h2> - -<p>감소 연산자는 피연산자를 감소(1을 뺄셈)시키고, 그 값을 반환합니다.</p> - -<ul> - <li>피연산자 뒤에 붙여(예: <code>x--</code>) 접미사로 사용한 경우 감소하기 전의 값을 반환합니다.</li> - <li>피연산자 앞에 붙여(예: <code>--x</code>) 접두사로 사용한 경우 감소한 후의 값을 반환합니다.</li> -</ul> - -<h3 id="구문_8">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> x-- or --x -</pre> - -<h3 id="예제_8">예제</h3> - -<pre class="brush: js">// 접미사 -var x = 3; -y = x--; // y = 3, x = 2 - -// 접두사 -var a = 2; -b = --a; // a = 1, b = 1 -</pre> - -<h2 id="단항_부정_-"><a name="Unary_negation">단항 부정 (-)</a></h2> - -<p>단항 부정 연산자는 피연산자의 앞에 위치하며 부호를 뒤집습니다.</p> - -<h3 id="구문_9">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> -x -</pre> - -<h3 id="예제_9">예제</h3> - -<pre class="brush: js">var x = 3; -y = -x; // y = -3, x = 3 - -// 단항 부정 연산자는 숫자가 아닌 값을 숫자로 변환함 -var x = "4"; -y = -x; // y = -4</pre> - -<h2 id="단항_양부호"><a name="Unary_plus">단항 양부호 (+)</a></h2> - -<p>단항 양부호 연산자는 피연산자의 앞에 위치하며 피연산자의 값 그대로 평가되지만, 값이 숫자가 아닐 경우 숫자로 변환을 시도합니다. 단항 부정(-) 연산자도 숫자가 아닌 값을 변환할 수 있지만, 단항 양부호가 속도도 제일 빠르고 다른 연산도 수행하지 않으므로 선호해야 할 방법입니다. 문자열로 표현한 정수 및 부동소수점 실수, 문자열이 아닌 <code>true</code>, <code>false</code>, <code>null</code>도 변환할 수 있습니다. 10진수와 (앞에 "0x"가 붙은) 16진수 정수 모두 지원합니다. 음수도 지원하지만 16진수 음수에는 사용할 수 없습니다. 어떤 값을 분석할 수 없으면 {{jsxref("NaN")}}으로 평가됩니다.</p> - -<h3 id="구문_10">구문</h3> - -<pre class="syntaxbox"><strong>연산자:</strong> +x -</pre> - -<h3 id="예제_10">예제</h3> - -<pre class="brush: js">+3 // 3 -+"3" // 3 -+true // 1 -+false // 0 -+null // 0 -+function(val) { return val } // NaN -</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-additive-operators', 'Additive operators')}}</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-postfix-expressions', 'Postfix expressions')}}</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-11.5', 'Multiplicative operators')}}</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-11.4', 'Unary operator')}}</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.operators.arithmetic")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li><a href="/ko/docs/Web/JavaScript/Reference/Operators/Assignment_Operators">할당 연산자</a></li> -</ul> diff --git a/files/ko/web/javascript/reference/operators/assignment_operators/index.html b/files/ko/web/javascript/reference/operators/assignment_operators/index.html deleted file mode 100644 index 93146d63cf..0000000000 --- a/files/ko/web/javascript/reference/operators/assignment_operators/index.html +++ /dev/null @@ -1,395 +0,0 @@ ---- -title: 할당 연산자 -slug: Web/JavaScript/Reference/Operators/Assignment_Operators -tags: - - JavaScript - - Operator - - Reference -translation_of: Web/JavaScript/Reference/Operators#Assignment_operators -translation_of_original: Web/JavaScript/Reference/Operators/Assignment_Operators ---- -<div>{{jsSidebar("Operators")}}</div> - -<p><strong>할당 연산자</strong>는 오른쪽 피연산자의 값을 왼쪽 피연산자에 할당합니다.</p> - -<div>{{EmbedInteractiveExample("pages/js/expressions-assignment.html")}}</div> - - - -<h2 id="개요">개요</h2> - -<p>기본 할당연산자는 등호(<code>=</code>)로, 오른쪽 피연산자의 값을 왼쪽 피연산자에 할당합니다. 즉, <code>x = y</code>는 <code>y</code>의 값을 <code>x</code>에 할당힙니다. 다른 할당 연산자는 보통 표준 연산의 축약형으로, 다음 표에서 종류와 예시를 확인할 수 있습니다.</p> - -<table class="standard-table"> - <tbody> - <tr> - <th>이름</th> - <th>단축 연산자</th> - <th>의미</th> - </tr> - <tr> - <td><a href="#Assignment">할당</a></td> - <td><code>x = y</code></td> - <td><code>x = y</code></td> - </tr> - <tr> - <td><a href="#Addition_assignment">덧셈 할당</a></td> - <td><code>x += y</code></td> - <td><code>x = x + y</code></td> - </tr> - <tr> - <td><a href="#Subtraction_assignment">뺄셈 할당</a></td> - <td><code>x -= y</code></td> - <td><code>x = x - y</code></td> - </tr> - <tr> - <td><a href="#Multiplication_assignment">곱셈 할당</a></td> - <td><code>x *= y</code></td> - <td><code>x = x * y</code></td> - </tr> - <tr> - <td><a href="#Division_assignment">나눗셈 할당</a></td> - <td><code>x /= y</code></td> - <td><code>x = x / y</code></td> - </tr> - <tr> - <td><a href="#Remainder_assignment">나머지 연산 할당</a></td> - <td><code>x %= y</code></td> - <td><code>x = x % y</code></td> - </tr> - <tr> - <td><a href="#Exponentiation_assignment">지수 연산 할당</a></td> - <td><code>x **= y</code></td> - <td><code>x = x ** y</code></td> - </tr> - <tr> - <td><a href="#Left_shift_assignment">왼쪽 시프트 할당</a></td> - <td><code>x <<= y</code></td> - <td><code>x = x << y</code></td> - </tr> - <tr> - <td><a href="#Right_shift_assignment">오른쪽 시프트 할당</a></td> - <td><code>x >>= y</code></td> - <td><code>x = x >> y</code></td> - </tr> - <tr> - <td><a href="#Unsigned_right_shift_assignment">부호없는 오른쪽 시프트 할당</a></td> - <td><code>x >>>= y</code></td> - <td><code>x = x >>> y</code></td> - </tr> - <tr> - <td><a href="#Bitwise_AND_assignment">비트 AND 할당</a></td> - <td><code>x &= y</code></td> - <td><code>x = x & y</code></td> - </tr> - <tr> - <td><a href="#Bitwise_XOR_assignment">비트 XOR 할당</a></td> - <td><code>x ^= y</code></td> - <td><code>x = x ^ y</code></td> - </tr> - <tr> - <td><a href="#Bitwise_OR_assignment">비트 OR 할당</a></td> - <td><code>x |= y</code></td> - <td><code>x = x | y</code></td> - </tr> - </tbody> -</table> - -<h2 id="할당"><a name="Assignment">할당</a></h2> - -<p>단순 할당 연산자는 값을 변수에 할당합니다. 할당 연산자는 할당의 결과값으로 평가됩니다. 할당 연산자를 연속해서 사용해, 다수의 변수에 하나의 값을 한꺼번에 할당할 수 있습니다. 예제를 참고하세요.</p> - -<h4 id="구문">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x = y -</pre> - -<h4 id="예제">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// x = 5 -// y = 10 -// z = 25 - -x = y // x는 10 -x = y = z // x, y, z 모두 25 -</pre> - -<h3 id="덧셈_할당"><a name="Addition_assignment">덧셈 할당</a></h3> - -<p>덧셈 할당 연산자는 변수에 오른쪽 피연산자의 값을 더하고, 그 결과를 변수에 할당합니다. 두 피연산자의 자료형이 덧셈 할당 연산자의 행동을 결정합니다. 덧셈 연산자처럼 합 또는 연결이 가능합니다. 자세한 내용은 {{jsxref("Operators/Arithmetic_Operators", "덧셈 연산자", "#Addition", 1)}}를 참고하세요.</p> - -<h4 id="구문_2">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x += y -<strong>의미:</strong> x = x + y -</pre> - -<h4 id="예제_2">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// foo = "foo" -// bar = 5 -// baz = true - - -// Number + Number -> 합 -bar += 2 // 7 - -// Boolean + Number -> 합 -baz += 1 // 2 - -// Boolean + Boolean -> 합 -baz += false // 1 - -// Number + String -> 연결 -bar += 'foo' // "5foo" - -// String + Boolean -> 연결 -foo += false // "foofalse" - -// String + String -> 연결 -foo += 'bar' // "foobar" -</pre> - -<h3 id="뺄셈_할당"><a name="Subtraction_assignment">뺄셈 할당</a></h3> - -<p>뺄셈 할당 연산자는 변수에서 오른쪽 피연산자의 값을 빼고, 그 결과를 변수에 할당합니다. 더 자세한 내용은 {{jsxref("Operators/Arithmetic_Operators", "뺄셈 연산자", "#Subtraction", 1)}}를 참고하세요.</p> - -<h4 id="구문_3">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x -= y -<strong>의미:</strong> x = x - y -</pre> - -<h4 id="예제_3">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// bar = 5 - -bar -= 2 // 3 -bar -= "foo" // NaN -</pre> - -<h3 id="곱셈_할당"><a name="Multiplication_assignment">곱셈 할당</a></h3> - -<p>곱셈 할당 연산자는 변수에 오른쪽 피연산자의 값을 곱하고, 그 결과를 변수에 할당합니다. 더 자세한 내용은 {{jsxref("Operators/Arithmetic_Operators", "곱셈 연산자", "#Multiplication", 1)}}를 참고하세요.</p> - -<h4 id="구문_4">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x *= y -<strong>의미:</strong> x = x * y -</pre> - -<h4 id="예제_4">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// bar = 5 - -bar *= 2 // 10 -bar *= "foo" // NaN -</pre> - -<h3 id="나눗셈_할당"><a name="Division_assignment">나눗셈 할당</a></h3> - -<p>나눗셈 할당 연산자는 변수를 오른쪽 피연산자로 나누고, 그 결과를 변수에 할당합니다. 더 자세한 내용은 {{jsxref("Operators/Arithmetic_Operators", "나눗셈 연산자", "#Division", 1)}}를 참고하세요.</p> - -<h4 id="구문_5">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x /= y -<strong>의미:</strong> x = x / y -</pre> - -<h4 id="예제_5">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// bar = 5 - -bar /= 2 // 2.5 -bar /= "foo" // NaN -bar /= 0 // Infinity -</pre> - -<h3 id="나머지_연산_할당"><a name="Remainder_assignment">나머지 연산 할당</a></h3> - -<p>나머지 연산 할당은 변수를 오른쪽 피연산자로 나눈 나머지를 변수에 할당합니다. 더 자세한 내용은 {{jsxref("Operators/Arithmetic_Operators", "나머지 연산자", "#Remainder", 1)}}를 참고하세요.</p> - -<h4 id="구문_6">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x %= y -<strong>의미:</strong> x = x % y -</pre> - -<h4 id="예제_6">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// bar = 5 - -bar %= 2 // 1 -bar %= "foo" // NaN -bar %= 0 // NaN -</pre> - -<h3 id="거듭제곱_할당"><a id="Exponentiation_assignment" name="Exponentiation_assignment">거듭제곱 할당</a></h3> - -<p>거듭제곱 할당 연산자는 변수를 오른쪽 피연산자만큼 거듭제곱한 결과를 변수에 할당합니다. 자세한 내용은 {{jsxref("Operators/Arithmetic_Operators", "거듭제곱 연산자", "#Exponentiation", 1)}}를 참고하세요.</p> - -<h4 id="구문_7">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x **= y -<strong>의미:</strong> x = x ** y -</pre> - -<h4 id="예제_7">예제</h4> - -<pre class="brush: js">// 다음과 같은 변수를 가정 -// bar = 5 - -bar **= 2 // 25 -bar **= "foo" // NaN</pre> - -<h3 id="왼쪽_시프트_할당"><a name="Left_shift_assignment">왼쪽 시프트 할당</a></h3> - -<p>왼쪽 시프트 할당 연산자는 변수의 비트를 오른쪽 피연산자의 값만큼 왼쪽으로 이동하고, 그 결과를 변수에 할당합니다. 더 자세한 내용은 {{jsxref("Operators/Bitwise_Operators", "left shift operator", "#Left_shift", 1)}}를 참고하세요.</p> - -<h4 id="구문_8">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x <<= y -<strong>의미:</strong> x = x << y -</pre> - -<h4 id="예제_8">예제</h4> - -<pre class="brush: js">var bar = 5; // (00000000000000000000000000000101) -bar <<= 2; // 20 (00000000000000000000000000010100) -</pre> - -<h3 id="오른쪽_시프트_할당"><a name="Right_shift_assignment">오른쪽 시프트 할당</a></h3> - -<p>오른쪽 시프트 할당 연산자는 변수의 비트를 오른쪽 피연산자의 값만큼 우측으로 이동하고, 그 결과를 변수에 할당합니다. 자세한 내용은 {{jsxref("Operators/Bitwise_Operators", "right shift operator", "#Right_shift", 1)}}를 참고하세요.</p> - -<h4 id="구문_9">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x >>= y -<strong>의미:</strong> x = x >> y -</pre> - -<h4 id="예제_9">예제</h4> - -<pre class="brush: js">var bar = 5; // (00000000000000000000000000000101) -bar >>= 2; // 1 (00000000000000000000000000000001) - -var bar -5; // (-00000000000000000000000000000101) -bar >>= 2; // -2 (-00000000000000000000000000000010) -</pre> - -<h3 id="부호_없는_오른쪽_시프트_할당"><a name="Unsigned_right_shift_assignment">부호 없는 오른쪽 시프트 할당</a></h3> - -<p>부호 없는 오른쪽 시프트 할당 연산자는 변수의 비트를 오른쪽 피연산자의 값만큼 우측으로 이동하고, 그 결과를 변수에 할당합니다. 자세한 내용은 {{jsxref("Operators/Bitwise_Operators", " unsigned right shift operator", "#Unsigned_right_shift", 1)}}을 참고하세요.</p> - -<h4 id="구문_10">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x >>>= y -<strong>의미:</strong> x = x >>> y -</pre> - -<h4 id="예제_10">예제</h4> - -<pre class="brush: js">var bar = 5; // (00000000000000000000000000000101) -bar >>>= 2; // 1 (00000000000000000000000000000001) - -var bar = -5; // (-00000000000000000000000000000101) -bar >>>= 2; // 1073741822 (00111111111111111111111111111110)</pre> - -<h3 id="비트_AND_할당"><a name="Bitwise_AND_assignment">비트 AND 할당</a></h3> - -<p>비트 AND 할당 연산자는 양쪽 피연산자의 이진 표현을 AND 연산한 후, 그 결과를 변수에 할당합니다. 자세한 내용은{{jsxref("Operators/Bitwise_Operators", "bitwise AND operator", "#Bitwise_AND", 1)}}을 참고하세요.</p> - -<h4 id="구문_11">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x &= y -<strong>의미:</strong> x = x & y -</pre> - -<h4 id="예제_11">예제</h4> - -<pre class="brush: js">var bar = 5; -// 5: 00000000000000000000000000000101 -// 2: 00000000000000000000000000000010 -bar &= 2; // 0 -</pre> - -<h3 id="비트_XOR_할당"><a name="Bitwise_XOR_assignment">비트 XOR 할당</a></h3> - -<p>비트 XOR 할당 연산자는 양쪽 피연산자의 이진 표현을 XOR 연산한 후, 그 결과를 변수에 할당합니다. 자세한 내용은 {{jsxref("Operators/Bitwise_Operators", "bitwise XOR operator", "#Bitwise_XOR", 1)}}를 참고하세요.</p> - -<h4 id="구문_12">구문</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x ^= y -<strong>의미:</strong> x = x ^ y -</pre> - -<h4 id="예제_12">예제</h4> - -<pre class="brush: js">var bar = 5; -bar ^= 2; // 7 -// 5: 00000000000000000000000000000101 -// 2: 00000000000000000000000000000010 -// ----------------------------------- -// 7: 00000000000000000000000000000111 -</pre> - -<h3 id="비트_OR_할당"><a name="Bitwise_OR_assignment">비트 OR 할당</a></h3> - -<p>비트 OR 할당 연산자는 양쪽 피연산자의 이진 표현을 OR 연산한 후, 그 결과를 변수에 할당합니다. 자세한 내용은 {{jsxref("Operators/Bitwise_Operators", "bitwise OR operator", "#Bitwise_OR", 1)}}를 참고하세요.</p> - -<h4 id="문법">문법</h4> - -<pre class="syntaxbox"><strong>연산자:</strong> x |= y -<strong>의미:</strong> x = x | y -</pre> - -<h4 id="예제_13">예제</h4> - -<pre class="brush: js">var bar = 5; -bar |= 2; // 7 -// 5: 00000000000000000000000000000101 -// 2: 00000000000000000000000000000010 -// ----------------------------------- -// 7: 00000000000000000000000000000111 -</pre> - -<h2 id="예제_14">예제</h2> - -<h3 id="다른_할당_연산자를_갖는_왼쪽_피연산자">다른 할당 연산자를 갖는 왼쪽 피연산자</h3> - -<p>드물게, 할당 연산자(예: <code>x += y</code>)와 그 의미를 나타낸 표현(<code>x = x + y</code>)이 동일하지 않은 경우가 있습니다. 할당 연산자의 왼쪽 피연산자가 다른 할당 연산자를 포함할 때, 왼쪽 피연산자는 한 번만 평가됩니다. 예를 들면 다음과 같습니다.</p> - -<pre class="brush: js">a[i++] += 5 // i는 한 번만 평가됨 -a[i++] = a[i++] + 5 // i는 두 번 평가됨 -</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-assignment-operators', 'Assignment operators')}}</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.operators.assignment")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li><a href="/ko/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators">산술 연산자</a></li> -</ul> diff --git a/files/ko/web/javascript/reference/operators/bitwise_operators/index.html b/files/ko/web/javascript/reference/operators/bitwise_operators/index.html deleted file mode 100644 index 4cc5ab7b5a..0000000000 --- a/files/ko/web/javascript/reference/operators/bitwise_operators/index.html +++ /dev/null @@ -1,541 +0,0 @@ ---- -title: 비트 연산자 -slug: Web/JavaScript/Reference/Operators/Bitwise_Operators -tags: - - JavaScript - - Operator - - Reference -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators ---- -<div>{{jsSidebar("Operators")}}</div> - -<p><strong>비트 연산자</strong>는 피연산자를 10진수, 16진수, 8진수가 아니라, 32개의 비트(0과 1) 집합으로 취급합니다. 예를 들어, 10진수 9의 2진수 표기법은 1001입니다. 이렇게, 비트 연산자는 값의 2진수 표현을 사용해 연산하지만, 결과는 표준 JavaScript 숫자 값으로 반환합니다.</p> - -<div>{{EmbedInteractiveExample("pages/js/expressions-bitwiseoperators.html")}}</div> - - - -<p>다음은 JavaScript의 비트 연산자를 요약한 표입니다.</p> - -<table class="standard-table"> - <tbody> - <tr> - <th>연산자</th> - <th>사용방법</th> - <th>설명</th> - </tr> - <tr> - <td><a href="#Bitwise_AND">비트 AND</a></td> - <td><code>a & b</code></td> - <td>피연산자를 비트로 바꿨을 때 각각 대응하는 비트가 모두 1이면 그 비트값에 1을 반환.</td> - </tr> - <tr> - <td><a href="#Bitwise_OR">비트 OR</a></td> - <td><code>a | b</code></td> - <td>피연산자를 비트로 바꿨을 때 각각 대응하는 비트가 모두 1이거나 한 쪽이 1이면 1을 반환.</td> - </tr> - <tr> - <td><a href="#Bitwise_XOR">비트 XOR</a></td> - <td><code>a ^ b</code></td> - <td>피연산자를 비트로 바꿨을 때 대응하는 비트가 서로 다르면 1을 반환.</td> - </tr> - <tr> - <td><a href="#Bitwise_NOT">비트 NOT</a></td> - <td><code>~ a</code></td> - <td>피연산자의 반전된 값을 반환.</td> - </tr> - <tr> - <td><a href="#Left_shift">왼쪽 시프트</a></td> - <td><code>a << b</code></td> - <td>Shifts <code>a</code> in binary representation <code>b</code> (< 32) bits to the left, shifting in zeros from the right.</td> - </tr> - <tr> - <td><a href="#Right_shift">부호 유지 오른쪽 시프트</a></td> - <td><code>a >> b</code></td> - <td>Shifts <code>a</code> in binary representation <code>b</code> (< 32) bits to the right, discarding bits shifted off.</td> - </tr> - <tr> - <td><a href="#Unsigned_right_shift">부호 버림 오른쪽 시프트</a></td> - <td><code>a >>> b</code></td> - <td>Shifts <code>a</code> in binary representation <code>b</code> (< 32) bits to the right, discarding bits shifted off, and shifting in zeros from the left.</td> - </tr> - </tbody> -</table> - -<h2 id="부호_있는_32비트_정수">부호 있는 32비트 정수</h2> - -<p>The operands of all bitwise operators are converted to signed 32-bit integers in two's <a href="https://en.wikipedia.org/wiki/Method_of_complements">complement format</a>, except for zero-fill right shift which results in an unsigned 32-bit integer.</p> - -<p><em>Two's complement format</em> means that a number's negative counterpart (e.g. <code>5</code> vs. <code>-5</code>) is all the number's bits inverted (bitwise NOT of the number, or <em>ones' complement</em> of the number) plus one.</p> - -<p>For example, the following encodes the integer <code>314</code>:</p> - -<pre>00000000000000000000000100111010 -</pre> - -<p>The following encodes <code>~314</code>, i.e. the one's complement of <code>314</code>:</p> - -<pre>11111111111111111111111011000101 -</pre> - -<p>Finally, the following encodes <code>-314,</code> i.e. the two's complement of <code>314</code>:</p> - -<pre>11111111111111111111111011000110 -</pre> - -<p>The two's complement guarantees that the left-most bit is 0 when the number is positive and 1 when the number is negative. Thus, it is called the <em>sign bit</em>.</p> - -<p>The number <code>0</code> is the integer that is composed completely of 0 bits.</p> - -<pre>0 (base 10) = 00000000000000000000000000000000 (base 2) -</pre> - -<p>The number <code>-1</code> is the integer that is composed completely of 1 bits.</p> - -<pre>-1 (base 10) = 11111111111111111111111111111111 (base 2) -</pre> - -<p>The number <code>-2147483648</code> (hexadecimal representation: <code>-0x80000000</code>) is the integer that is composed completely of 0 bits except the first (left-most) one.</p> - -<pre>-2147483648 (base 10) = 10000000000000000000000000000000 (base 2) -</pre> - -<p>The number <code>2147483647</code> (hexadecimal representation: <code>0x7fffffff</code>) is the integer that is composed completely of 1 bits except the first (left-most) one.</p> - -<pre>2147483647 (base 10) = 01111111111111111111111111111111 (base 2) -</pre> - -<p>The numbers <code>-2147483648</code> and <code>2147483647</code> are the minimum and the maximum integers representable throught a 32bit signed number.</p> - -<h2 id="비트_논리_연산자">비트 논리 연산자</h2> - -<p>비트 논리 연산자는 다음과 같이 사용됩니다.</p> - -<ul> - <li>피연산자는 32비트 정수로 변환되고, 이진법으로 표현됩니다 (0과 1).</li> - <li>이진법으로 표현된 첫 번째 피연산자는 두 번째 피연산자와 쌍을 이룹니다: 첫 번째는 첫 번째 비트끼리, 두 번째는 두 번째 비트끼리...</li> - <li>연산자는 각각의 비트쌍에 적용되고, 결과 또한 이진법으로 구성됩니다.</li> -</ul> - -<h3 id="비트_AND"><a id="Bitwise_AND" name="Bitwise_AND">& (비트 AND)</a></h3> - -<p>비트 연산자 AND를 비트 쌍으로 실행합니다.</p> - -<p>Performs the AND operation on each pair of bits. <code>a</code> AND <code>b</code> yields 1 only if both <code>a</code> and <code>b</code> are 1. The truth table for the AND operation is:</p> - -<table class="standard-table"> - <tbody> - <tr> - <td class="header">a</td> - <td class="header">b</td> - <td class="header">a AND b</td> - </tr> - <tr> - <td>0</td> - <td>0</td> - <td>0</td> - </tr> - <tr> - <td>0</td> - <td>1</td> - <td>0</td> - </tr> - <tr> - <td>1</td> - <td>0</td> - <td>0</td> - </tr> - <tr> - <td>1</td> - <td>1</td> - <td>1</td> - </tr> - </tbody> -</table> - -<pre> 9 (base 10) = 00000000000000000000000000001001 (base 2) - 14 (base 10) = 00000000000000000000000000001110 (base 2) - -------------------------------- -14 & 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10) -</pre> - -<p>Bitwise ANDing any number <code>x</code> with <code>0</code> yields <code>0</code>. <span style="letter-spacing: -0.00278rem;">Bitwise ANDing any number <code>x</code> with <code>-1</code> yields <code>x</code>.</span></p> - -<h3 id="비트_OR"><a id="Bitwise_OR" name="Bitwise_OR">| (비트 OR)</a></h3> - -<p>Performs the OR operation on each pair of bits. <code>a</code> OR <code>b</code> yields 1 if either <code>a</code> or <code>b</code> is 1. The truth table for the OR operation is:</p> - -<table class="standard-table"> - <tbody> - <tr> - <td class="header">a</td> - <td class="header">b</td> - <td class="header">a OR b</td> - </tr> - <tr> - <td>0</td> - <td>0</td> - <td>0</td> - </tr> - <tr> - <td>0</td> - <td>1</td> - <td>1</td> - </tr> - <tr> - <td>1</td> - <td>0</td> - <td>1</td> - </tr> - <tr> - <td>1</td> - <td>1</td> - <td>1</td> - </tr> - </tbody> -</table> - -<pre> 9 (base 10) = 00000000000000000000000000001001 (base 2) - 14 (base 10) = 00000000000000000000000000001110 (base 2) - -------------------------------- -14 | 9 (base 10) = 00000000000000000000000000001111 (base 2) = 15 (base 10) -</pre> - -<p>Bitwise ORing any number x with 0 yields x.</p> - -<p>Bitwise ORing any number x with -1 yields -1.</p> - -<h3 id="비트_XOR"><a id="Bitwise_XOR" name="Bitwise_XOR">^ (비트 XOR)</a></h3> - -<p>Performs the XOR operation on each pair of bits. <code>a</code> XOR <code>b</code> yields 1 if <code>a</code> and <code>b</code> are different. The truth table for the XOR operation is:</p> - -<table class="standard-table"> - <tbody> - <tr> - <td class="header">a</td> - <td class="header">b</td> - <td class="header">a XOR b</td> - </tr> - <tr> - <td>0</td> - <td>0</td> - <td>0</td> - </tr> - <tr> - <td>0</td> - <td>1</td> - <td>1</td> - </tr> - <tr> - <td>1</td> - <td>0</td> - <td>1</td> - </tr> - <tr> - <td>1</td> - <td>1</td> - <td>0</td> - </tr> - </tbody> -</table> - -<pre> 9 (base 10) = 00000000000000000000000000001001 (base 2) - 14 (base 10) = 00000000000000000000000000001110 (base 2) - -------------------------------- -14 ^ 9 (base 10) = 00000000000000000000000000000111 (base 2) = 7 (base 10) -</pre> - -<p>Bitwise XORing any number x with 0 yields x.</p> - -<p>Bitwise XORing any number x with -1 yields ~x.</p> - -<h3 id="비트_NOT"><a id="Bitwise_NOT" name="Bitwise_NOT">~ (비트 NOT)</a></h3> - -<p>Performs the NOT operator on each bit. NOT <code>a</code> yields the inverted value (a.k.a. one's complement) of <code>a</code>. The truth table for the NOT operation is:</p> - -<table class="standard-table"> - <tbody> - <tr> - <td class="header">a</td> - <td class="header">NOT a</td> - </tr> - <tr> - <td>0</td> - <td>1</td> - </tr> - <tr> - <td>1</td> - <td>0</td> - </tr> - </tbody> -</table> - -<pre> 9 (base 10) = 00000000000000000000000000001001 (base 2) - -------------------------------- -~9 (base 10) = 11111111111111111111111111110110 (base 2) = -10 (base 10) -</pre> - -<p>Bitwise NOTing any number x yields -(x + 1). For example, ~5 yields -6.</p> - -<h2 id="비트_시프트_연산자">비트 시프트 연산자</h2> - -<p>The bitwise shift operators take two operands: the first is a quantity to be shifted, and the second specifies the number of bit positions by which the first operand is to be shifted. The direction of the shift operation is controlled by the operator used.</p> - -<p>Shift operators convert their operands to 32-bit integers in big-endian order and return a result of the same type as the left operand. The right operand should be less than 32, but if not only the low five bits will be used.</p> - -<h3 id="<<_Left_shift"><a id="Left_shift" name="Left_shift"><< (Left shift)</a></h3> - -<p>This operator shifts the first operand the specified number of bits to the left. Excess bits shifted off to the left are discarded. Zero bits are shifted in from the right.</p> - -<p>For example, <code>9 << 2</code> yields 36:</p> - -<pre> 9 (base 10): 00000000000000000000000000001001 (base 2) - -------------------------------- -9 << 2 (base 10): 00000000000000000000000000100100 (base 2) = 36 (base 10) -</pre> - -<p>Bitwise shifting any number <strong>x</strong> to the left by <strong>y</strong> bits yields <strong>x * 2^y</strong>.</p> - -<h3 id=">>_Sign-propagating_right_shift"><a id="Right_shift" name="Right_shift">>> (Sign-propagating right shift)</a></h3> - -<p>This operator shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Copies of the leftmost bit are shifted in from the left. Since the new leftmost bit has the same value as the previous leftmost bit, the sign bit (the leftmost bit) does not change. Hence the name "sign-propagating".</p> - -<p>For example, <code>9 >> 2</code> yields 2:</p> - -<pre> 9 (base 10): 00000000000000000000000000001001 (base 2) - -------------------------------- -9 >> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10) -</pre> - -<p>Likewise, <code>-9 >> 2</code> yields -3, because the sign is preserved:</p> - -<pre> -9 (base 10): 11111111111111111111111111110111 (base 2) - -------------------------------- --9 >> 2 (base 10): 11111111111111111111111111111101 (base 2) = -3 (base 10) -</pre> - -<h3 id=">>>_Zero-fill_right_shift"><a id="Unsigned_right_shift" name="Unsigned_right_shift">>>> (Zero-fill right shift)</a></h3> - -<p>This operator shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Zero bits are shifted in from the left. The sign bit becomes 0, so the result is always non-negative.</p> - -<p>For non-negative numbers, zero-fill right shift and sign-propagating right shift yield the same result. For example, <code>9 >>> 2</code> yields 2, the same as <code>9 >> 2</code>:</p> - -<pre> 9 (base 10): 00000000000000000000000000001001 (base 2) - -------------------------------- -9 >>> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10) -</pre> - -<p>However, this is not the case for negative numbers. For example, <code>-9 >>> 2</code> yields 1073741821, which is different than <code>-9 >> 2</code> (which yields -3):</p> - -<pre> -9 (base 10): 11111111111111111111111111110111 (base 2) - -------------------------------- --9 >>> 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741821 (base 10) -</pre> - -<h2 id="예제">예제</h2> - -<h3 id="Flags_and_bitmasks">Flags and bitmasks</h3> - -<p>The bitwise logical operators are often used to create, manipulate, and read sequences of <em>flags</em>, which are like binary variables. Variables could be used instead of these sequences, but binary flags take much less memory (by a factor of 32).</p> - -<p>Suppose there are 4 flags:</p> - -<ul> - <li>flag A: we have an ant problem</li> - <li>flag B: we own a bat</li> - <li>flag C: we own a cat</li> - <li>flag D: we own a duck</li> -</ul> - -<p>These flags are represented by a sequence of bits: DCBA. When a flag is <em>set</em>, it has a value of 1. When a flag is <em>cleared</em>, it has a value of 0. Suppose a variable <code>flags</code> has the binary value 0101:</p> - -<pre class="brush: js">var flags = 5; // binary 0101 -</pre> - -<p>This value indicates:</p> - -<ul> - <li>flag A is true (we have an ant problem);</li> - <li>flag B is false (we don't own a bat);</li> - <li>flag C is true (we own a cat);</li> - <li>flag D is false (we don't own a duck);</li> -</ul> - -<p>Since bitwise operators are 32-bit, 0101 is actually 00000000000000000000000000000101, but the preceding zeroes can be neglected since they contain no meaningful information.</p> - -<p>A <em>bitmask</em> is a sequence of bits that can manipulate and/or read flags. Typically, a "primitive" bitmask for each flag is defined:</p> - -<pre class="brush: js">var FLAG_A = 1; // 0001 -var FLAG_B = 2; // 0010 -var FLAG_C = 4; // 0100 -var FLAG_D = 8; // 1000 -</pre> - -<p>New bitmasks can be created by using the bitwise logical operators on these primitive bitmasks. For example, the bitmask 1011 can be created by ORing FLAG_A, FLAG_B, and FLAG_D:</p> - -<pre class="brush: js">var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 => 1011 -</pre> - -<p>Individual flag values can be extracted by ANDing them with a bitmask, where each bit with the value of one will "extract" the corresponding flag. The bitmask <em>masks</em> out the non-relevant flags by ANDing with zeros (hence the term "bitmask"). For example, the bitmask 0100 can be used to see if flag C is set:</p> - -<pre class="brush: js">// if we own a cat -if (flags & FLAG_C) { // 0101 & 0100 => 0100 => true - // do stuff -} -</pre> - -<p>A bitmask with multiple set flags acts like an "either/or". For example, the following two are equivalent:</p> - -<pre class="brush: js">// if we own a bat or we own a cat -if ((flags & FLAG_B) || (flags & FLAG_C)) { // (0101 & 0010) || (0101 & 0100) => 0000 || 0100 => true - // do stuff -} -</pre> - -<pre class="brush: js">// if we own a bat or cat -var mask = FLAG_B | FLAG_C; // 0010 | 0100 => 0110 -if (flags & mask) { // 0101 & 0110 => 0100 => true - // do stuff -} -</pre> - -<p>Flags can be set by ORing them with a bitmask, where each bit with the value one will set the corresponding flag, if that flag isn't already set. For example, the bitmask 1100 can be used to set flags C and D:</p> - -<pre class="brush: js">// yes, we own a cat and a duck -var mask = FLAG_C | FLAG_D; // 0100 | 1000 => 1100 -flags |= mask; // 0101 | 1100 => 1101 -</pre> - -<p>Flags can be cleared by ANDing them with a bitmask, where each bit with the value zero will clear the corresponding flag, if it isn't already cleared. This bitmask can be created by NOTing primitive bitmasks. For example, the bitmask 1010 can be used to clear flags A and C:</p> - -<pre class="brush: js">// no, we don't have an ant problem or own a cat -var mask = ~(FLAG_A | FLAG_C); // ~0101 => 1010 -flags &= mask; // 1101 & 1010 => 1000 -</pre> - -<p>The mask could also have been created with <code>~FLAG_A & ~FLAG_C</code> (De Morgan's law):</p> - -<pre class="brush: js">// no, we don't have an ant problem, and we don't own a cat -var mask = ~FLAG_A & ~FLAG_C; -flags &= mask; // 1101 & 1010 => 1000 -</pre> - -<p>Flags can be toggled by XORing them with a bitmask, where each bit with the value one will toggle the corresponding flag. For example, the bitmask 0110 can be used to toggle flags B and C:</p> - -<pre class="brush: js">// if we didn't have a bat, we have one now, and if we did have one, bye-bye bat -// same thing for cats -var mask = FLAG_B | FLAG_C; -flags = flags ^ mask; // 1100 ^ 0110 => 1010 -</pre> - -<p>Finally, the flags can all be flipped with the NOT operator:</p> - -<pre class="brush: js">// entering parallel universe... -flags = ~flags; // ~1010 => 0101 -</pre> - -<h3 id="Conversion_snippets">Conversion snippets</h3> - -<p>Convert a binary <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">string</a></code> to a decimal <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Number" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number">number</a></code>:</p> - -<pre class="brush: js">var sBinString = "1011"; -var nMyNumber = parseInt(sBinString, 2); -alert(nMyNumber); // prints 11, i.e. 1011 -</pre> - -<p>Convert a decimal <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Number" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number">number</a></code> to a binary <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">string</a></code>:</p> - -<pre class="brush: js">var nMyNumber = 11; -var sBinString = nMyNumber.toString(2); -alert(sBinString); // prints 1011, i.e. 11 -</pre> - -<h3 id="Automate_Mask_Creation">Automate Mask Creation</h3> - -<p>If you have to create many masks from some <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean" title="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean">boolean</a></code> values, you can automatize the process:</p> - -<pre class="brush: js">function createMask () { - var nMask = 0, nFlag = 0, nLen = arguments.length > 32 ? 32 : arguments.length; - for (nFlag; nFlag < nLen; nMask |= arguments[nFlag] << nFlag++); - return nMask; -} -var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011 -var mask2 = createMask(false, false, true); // 4, i.e.: 0100 -var mask3 = createMask(true); // 1, i.e.: 0001 -// etc. - -alert(mask1); // prints 11, i.e.: 1011 -</pre> - -<h3 id="Reverse_algorithm_an_array_of_booleans_from_a_mask">Reverse algorithm: an array of booleans from a mask</h3> - -<p>If you want to create an <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array">array</a></code> of <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean" title="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean">booleans</a></code> from a mask you can use this code:</p> - -<pre class="brush: js">function arrayFromMask (nMask) { - // nMask must be between -2147483648 and 2147483647 - if (nMask > 0x7fffffff || nMask < -0x80000000) { throw new TypeError("arrayFromMask - out of range"); } - for (var nShifted = nMask, aFromMask = []; nShifted; aFromMask.push(Boolean(nShifted & 1)), nShifted >>>= 1); - return aFromMask; -} - -var array1 = arrayFromMask(11); -var array2 = arrayFromMask(4); -var array3 = arrayFromMask(1); - -alert("[" + array1.join(", ") + "]"); -// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011 -</pre> - -<p>You can test both algorithms at the same time…</p> - -<pre class="brush: js">var nTest = 19; // our custom mask -var nResult = createMask.apply(this, arrayFromMask(nTest)); - -alert(nResult); // 19 -</pre> - -<p>For didactic purpose only (since there is the <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Number/toString" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number/toString">Number.toString(2)</a></code> method), we show how it is possible to modify the <code>arrayFromMask</code> algorithm in order to create a <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">string</a></code> containing the binary representation of a <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Number" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number">number</a></code>, rather than an <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array">array</a></code> of <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean" title="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean">booleans</a></code>:</p> - -<pre class="brush: js">function createBinaryString (nMask) { - // nMask must be between -2147483648 and 2147483647 - for (var nFlag = 0, nShifted = nMask, sMask = ""; nFlag < 32; nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1); - return sMask; -} - -var string1 = createBinaryString(11); -var string2 = createBinaryString(4); -var string3 = createBinaryString(1); - -alert(string1); -// prints 00000000000000000000000000001011, i.e. 11 -</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-bitwise-not-operator', 'Bitwise NOT Operator')}}</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-binary-bitwise-operators', 'Binary Bitwise Operators')}}</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-bitwise-shift-operators', 'Bitwise Shift Operators')}}</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{Compat("javascript.operators.bitwise")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li><a href="/ko/docs/Web/JavaScript/Reference/Operators/%EB%85%BC%EB%A6%AC_%EC%97%B0%EC%82%B0%EC%9E%90(Logical_Operators)">논리 연산자</a></li> -</ul> diff --git a/files/ko/web/javascript/reference/operators/comparison_operators/index.html b/files/ko/web/javascript/reference/operators/comparison_operators/index.html deleted file mode 100644 index cf5ae3afa2..0000000000 --- a/files/ko/web/javascript/reference/operators/comparison_operators/index.html +++ /dev/null @@ -1,216 +0,0 @@ ---- -title: 비교 연산자 -slug: Web/JavaScript/Reference/Operators/Comparison_Operators -tags: - - JavaScript - - Operator - - Reference -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Comparison_Operators ---- -<div>{{jsSidebar("Operators")}}</div> - -<p>JavaScript는 엄격한 비교와 형변환 비교 두 가지의 비교 방법을 모두 가지고 있습니다. 엄격(일치) 비교(<code>===</code>)는 두 피연산자가 같은 자료형에, 그 내용도 일치해야만 참입니다. 추상(동등) 비교(<code>==</code>)는 비교 전에 두 피연산자를 동일한 자료형으로 변환합니다. 관계 추상 비교(<code><=</code>)의 경우 {{glossary("primitive", "원시값")}}으로 바꾸고, 같은 자료형으로 다시 바꾼후 비교를 수행합니다.</p> - -<p>문자열의 경우 {{glossary("unicode", "유니코드")}} 값을 사용한 사전순으로 비교합니다.</p> - -<div>{{EmbedInteractiveExample("pages/js/expressions-comparisonoperators.html")}}</div> - - - -<p>비교 연산의 특징은 다음과 같습니다.</p> - -<ul> - <li>두 문자열이 같은 문자 시퀀스로 구성되고, 같은 길이를 가지며, 같은 위치에 같은 문자가 존재하면 일치합니다.</li> - <li>두 숫자는 숫자로서 같은 값(같은 숫자 값)이면 일치합니다. {{jsxref("NaN")}}은 자기 자신을 포함한 그 무엇과도 동등하지 않습니다. <code>+0</code>과 <code>-0</code>은 서로 일치합니다.</li> - <li>두 불리언은 둘 다 <code>true</code>거나 <code>false</code>이면 일치합니다.</li> - <li>서로 다른 두 객체는 절대 일치하지도, 동등하지도 않습니다.</li> - <li>객체를 비교하는 표현식은 두 피연산자가 동일한 객체를 참조하는 경우에만 참입니다.</li> - <li>{{jsxref("null")}}과 {{jsxref("undefined")}}는 자기 자신과 일치하며, 서로 동등합니다.</li> -</ul> - -<h2 id="동치_연산자">동치 연산자</h2> - -<h3 id="동등_연산자"><a name="Equality">동등 연산자 (==)</a></h3> - -<p>동등 연산자는 두 피연산자의 자료형이 같지 않은 경우 같아지도록 변환한 후, 엄격 비교를 수행합니다. 피연산자가 모두 객체라면, JavaScript는 내부 참조를 보고, 둘 다 메모리의 같은 객체를 바라보고 있는지 판별합니다.</p> - -<h4 id="구문">구문</h4> - -<pre class="syntaxbox">x == y -</pre> - -<h4 id="예제">예제</h4> - -<pre class="brush: js"> 1 == 1 // true - "1" == 1 // true - 1 == '1' // true - 0 == false // true - 0 == null // false - - 0 == undefined // false -null == undefined // true -</pre> - -<h3 id="부등_연산자_!"><a name="Inequality">부등 연산자 (!=)</a></h3> - -<p>부등 연산자는 두 피연산자가 같지 않은 경우 참을 반환합니다. 피연산자의 자료형이 일치하지 않는 경우 적절한 자료형으로의 변환을 시도합니다. 피연산자가 모두 객체라면, JavaScript는 내부 참조를 보고, 서로 메모리의 다른 객체를 바라보고 있는지 판별합니다.</p> - -<h4 id="구문_2">구문</h4> - -<pre class="syntaxbox">x != y</pre> - -<h4 id="예제_2">예제</h4> - -<pre class="brush: js">1 != 2 // true -1 != "1" // false -1 != '1' // false -1 != true // false -0 != false // false -</pre> - -<h3 id="일치_연산자"><a name="Identity">일치 연산자 (===)</a></h3> - -<p>일치 연산자는 자료형 변환 없이 두 연산자가 엄격히 같은지 판별합니다.</p> - -<h4 id="구문_3">구문</h4> - -<pre class="syntaxbox">x === y</pre> - -<h4 id="예제_3">예제</h4> - -<pre class="brush: js ">3 === 3 // true -3 === '3' // false</pre> - -<h3 id="불일치_연산자_!"><a name="Nonidentity">불일치 연산자 (!==)</a></h3> - -<p>일치 연산자는 두 연산자가 같지 않거나, 같은 자료형이 아닐 때 참을 반환합니다.</p> - -<h4 id="구문_4">구문</h4> - -<pre class="syntaxbox">x !== y</pre> - -<h4 id="예제_4">예제</h4> - -<pre class="brush: js">3 !== '3' // true -4 !== 3 // true -</pre> - -<h2 id="관계_연산자">관계 연산자</h2> - -<p>이 항목의 모든 연산자는 비교 전에 피연산자를 {{glossary("primitive", "원시값")}}으로 <a href="/ko/docs/Glossary/Type_coercion">변환</a>합니다. 둘 다 문자열이 되는 경우 사전순으로 비교하고, 그렇지 않으면 숫자로 변환합니다. {{jsxref("NaN")}}과의 비교는 항상 <code>false</code>를 반환합니다.</p> - -<h3 id="초과_연산자_>"><a name="Greater_than_operator">초과 연산자 (>)</a></h3> - -<p>초과 연산자는 왼쪽 피연산자가 오른쪽 피연산자보다 큰 경우 참을 반환합니다.</p> - -<h4 id="구문_5">구문</h4> - -<pre class="syntaxbox">x > y</pre> - -<h4 id="예제_5">예제</h4> - -<pre class="brush: js">4 > 3 // true -</pre> - -<h3 id="이상_연산자_>"><a name="Greater_than_or_equal_operator">이상 연산자 (>=)</a></h3> - -<p>이상 연산자는 왼쪽 피연산자가 오른쪽 피연산자보다 크거나 같으면 참을 반환합니다.</p> - -<h4 id="구문_6">구문</h4> - -<pre class="syntaxbox"> x >= y</pre> - -<h4 id="예제_6">예제</h4> - -<pre class="brush: js">4 >= 3 // true -3 >= 3 // true -</pre> - -<h3 id="미만_연산자_<"><a name="Less_than_operator">미만 연산자 (<)</a></h3> - -<p>미만 연산자는 왼쪽 피연산자가 오른쪽 피연산자보다 작은 경우 참을 반환합니다.</p> - -<h4 id="구문_7">구문</h4> - -<pre class="syntaxbox">x < y</pre> - -<h4 id="예제_7">예제</h4> - -<pre class="brush: js">3 < 4 // true</pre> - -<h3 id="이하_연산자_<"><a id="Less_than_or_equal_operator" name="Less_than_or_equal_operator">이하 연산자 (<=)</a></h3> - -<p>이하 연산자는 왼쪽 피연산자가 오른쪽 피연산자보다 작거나 같으면 참을 반환합니다.</p> - -<h4 id="구문_8">구문</h4> - -<pre class="syntaxbox"> x <= y</pre> - -<h4 id="예제_8">예제</h4> - -<pre class="brush: js">3 <= 4 // true -</pre> - -<h2 id="동치_연산자_사용하기">동치 연산자 사용하기</h2> - -<p>표준 동치, 동등 연산자(<code>==</code>, <code>!=</code>)는 두 피연산자를 비교하기 위해 <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.3">추상 동치 비교 알고리즘</a>(Abstract Equlity Comparison Algorithm)을 사용합니다. 피연산자 간 자료형이 일치하지 않으면 우선 변환을 시도합니다. 예를 들어 표현식 <code>5 == '5'</code>에서는 비교 전 오른쪽 문자열을 {{jsxref("Number")}}로 변환합니다.</p> - -<p>엄격 동치, 일치 연산자(<code>===</code>, <code>!==</code>)는 <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.6">엄격 동치 비교 알고리즘</a>(Strict Equality Comparison Algorithm)을 사용하며, 같은 자료형을 가진 피연산자를 비교하기 위해 사용합니다. 피연산자 간 자료형이 일치하지 않으면 항상 <code>false</code>이므로, <code>5 !== '5'</code>입니다.</p> - -<p>피연산자의 값은 물론 특정 자료형이어야 하는 경우 일치 연산자를 사용하세요. 그렇지 않은 경우 형변환을 자동으로 해주는 동등 연산자를 사용할 수도 있습니다.</p> - -<p>비교 과정에 자료형 변환이 필요한 경우 JavaScript는 {{jsxref("String")}}, {{jsxref("Number")}}, {{jsxref("Boolean")}}, {{jsxref("Object")}} 자료형을 다음과 같이 변환합니다.</p> - -<ul> - <li>숫자와 문자열을 비교할 땐 문자열을 숫자로 변환합니다. 우선, 문자열에서 수학적 값을 도출합니다. 그 후 가장 가까운 <code>Number</code> 자료형 값으로 반올림합니다.</li> - <li>하나의 연산자가 <code>Boolean</code>인 경우, <code>true</code>는 <code>1</code>, <code>false</code>는 <code>0</code>으로 변환합니다.</li> - <li>객체를 문자열이나 숫자와 비교하는 경우, JavaScript는 객체의 기본값을 사용합니다. 연산자는 우선 객체의 <code>valueOf()</code> 또는 <code>toString()</code> 메서드를 사용해 문자열 혹은 숫자 값을 받으려 시도합니다. 실패할 경우 런타임 오류가 발생합니다.</li> - <li>객체를 원시값과 비교하는 경우에만 객체의 변환이 발생합니다. 두 연산자가 모두 객체인 경우 변환하지 않으며, 둘 다 같은 객체를 참조하는 경우 참을 반환합니다.</li> -</ul> - -<div class="note"><strong>참고:</strong> <code>String</code> 객체는 자료형 객체지, 문자열이 아닙니다! <code>String</code> 객체는 거의 쓰이지 않으며, 이런 성질로 인해 아래의 결과는 예상치 못한 값일 수 있습니다.</div> - -<pre class="brush:js">// true as both operands are type String (i.e. string primitives): -'foo' === 'foo' - -var a = new String('foo'); -var b = new String('foo'); - -// false as a and b are type Object and reference different objects -a == b - -// false as a and b are type Object and reference different objects -a === b - -// true as a and 'foo' are of different type and, the Object (a) -// is converted to String 'foo' before comparison -a == 'foo'</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Status</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-equality-operators', 'Equality Operators')}}</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-relational-operators', 'Relational Operators')}}</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{Compat("javascript.operators.comparison")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("Object.is()")}}</li> - <li>{{jsxref("Math.sign()")}}</li> - <li><a href="/ko/docs/Web/JavaScript/Equality_comparisons_and_sameness">동치 비교와 동일성</a></li> -</ul> diff --git a/files/ko/web/javascript/reference/operators/연산자_우선순위/index.html b/files/ko/web/javascript/reference/operators/operator_precedence/index.html index 7a82346d09..7a82346d09 100644 --- a/files/ko/web/javascript/reference/operators/연산자_우선순위/index.html +++ b/files/ko/web/javascript/reference/operators/operator_precedence/index.html diff --git a/files/ko/web/javascript/reference/operators/논리_연산자(logical_operators)/index.html b/files/ko/web/javascript/reference/operators/논리_연산자(logical_operators)/index.html deleted file mode 100644 index b442b1d7bd..0000000000 --- a/files/ko/web/javascript/reference/operators/논리_연산자(logical_operators)/index.html +++ /dev/null @@ -1,250 +0,0 @@ ---- -title: 논리 연산자 -slug: Web/JavaScript/Reference/Operators/논리_연산자(Logical_Operators) -tags: - - JavaScript - - Logic - - Not - - Operator - - Reference - - and - - or - - 논리 -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators ---- -<div>{{jsSidebar("Operators")}}</div> - -<p>논리 연산자는 보통 {{jsxref("Boolean")}}(논리적) 값과 함께 쓰이며, 불리언 값을 반환합니다. 그런데, <code>&&</code>과 <code>||</code> 연산자는 사실 피연산자 중 하나의 값을 반환합니다. 그러므로 불리언 외의 다른 값과 함께 사용하면 불리언 값이 아닌 것을 반환할 수 있습니다.</p> - -<div>{{EmbedInteractiveExample("pages/js/expressions-logicaloperator.html")}}</div> - - - -<h2 id="설명">설명</h2> - -<p>다음 표는 논리 연산자의 종류입니다. (<code><em>expr</em></code>은 불리언을 포함해서 아무 자료형이나 가능합니다)</p> - -<table class="fullwidth-table"> - <tbody> - <tr> - <th>연산자</th> - <th>구문</th> - <th>설명</th> - </tr> - <tr> - <td>논리 AND (<code>&&</code>)</td> - <td><code><em>expr1</em> && <em>expr2</em></code></td> - <td><code>expr1</code>을 <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">true</span></font>로 변환할 수 있는 경우 <code>expr2</code>을 반환하고, 그렇지 않으면 <code>expr1</code>을 반환합니다.</td> - </tr> - <tr> - <td>논리 OR (<code>||</code>)</td> - <td><code><em>expr1</em> || <em>expr2</em></code></td> - <td> - <p><code>expr1</code>을 <code>true</code>로 변환할 수 있으면 <code>expr1</code>을 반환하고, 그렇지 않으면 <code>expr2</code>를 반환합니다.</p> - </td> - </tr> - <tr> - <td>논리 NOT (<code>!</code>)</td> - <td><code>!<em>expr</em></code></td> - <td>단일 피연산자를 <code>true</code>로 변환할 수 있으면 <code>false</code>를 반환합니다. 그렇지 않으면 <code>true</code>를 반환합니다.</td> - </tr> - </tbody> -</table> - -<p>값을 <code>true</code>로 변환하면 값이 {{Glossary("truthy", "참")}}인 것입니다.<br> - 값을 <code>false</code>로 변환할 수 있으면 값이 {{Glossary("falsy", "거짓")}}인 것입니다.</p> - -<p>거짓으로 변환할 수 있는 표현의 예는 다음과 같습니다.</p> - -<ul> - <li><code>null</code></li> - <li><code>NaN</code></li> - <li><code>0</code></li> - <li>빈 문자열 (<code>"",</code> <code>''</code>, <code>``</code>)</li> - <li><code>undefined</code></li> -</ul> - -<p><code>&&</code> 연산자와 <code>||</code> 연산자를 불리언 값이 아닌 피연산자와 함께 사용될 수 있지만, 반환 값을 항상 <a href="/ko/docs/Web/JavaScript/Data_structures#Boolean_%ED%83%80%EC%9E%85">불리언 원시값</a>으로 변환할 수 있으므로 불리언 연산자로 생각할 수 있습니다. 반환 값을 직접 불리언으로 바꾸려면 {{jsxref("Boolean")}} 함수나 이중 부정 연산자를 사용하세요.</p> - -<h3 id="단락_평가">단락 평가</h3> - -<p>논리 표현식을 좌측부터 평가하므로, 아래 규칙에 따라 단락(short-circuit) 평가를 수행합니다.</p> - -<ul> - <li><code>(거짓 표현식) && expr</code>은 거짓 표현식으로 단락 평가됩니다.</li> - <li><code>(참 표현식) || expr</code>은 참 표현식으로 단락 평가됩니다.</li> -</ul> - -<p>"단락"이란, 위 규칙에서 <code>expr</code>을 평가하지 않는다는 뜻입니다. 따라서 평가 중 발생해야 할 부작용(예: <code>expr</code>이 함수 호출이면 절대 호출하지 않음)도 나타나지 않습니다. 단락 평가가 발생하는 원인은 첫 번째 피연산자를 평가한 순간 이미 연산자의 결과가 정해지기 때문입니다. 다음 예제를 살펴보세요.</p> - -<pre>function A(){ console.log('A 호출'); return false; } -function B(){ console.log('B 호출'); return true; } - -console.log( A() && B() ); -// 함수 호출로 인해 콘솔에 "A 호출" 기록 -// 그 후 연산자의 결과값인 "false" 기록 - -console.log( B() || A() ); -// 함수 호출로 인해 콘솔에 "B 호출" 기록 -// 그 후 연산자의 결과인 "true" 기록 -</pre> - -<h3 id="연산자_우선순위">연산자 우선순위</h3> - -<p>다음 두 식은 똑같아 보이지만, <code>&&</code> 연산자는 <code>||</code> 이전에 실행되므로 서로 다릅니다. <a href="/ko/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">연산자 우선순위</a>를 참고하세요.</p> - -<pre class="brush: js">true || false && false // returns true, because && is executed first -(true || false) && false // returns false, because operator precedence cannot apply</pre> - -<h3 id="논리_AND_()"><a name="Logical_AND">논리 AND (<code>&&</code>)</a></h3> - -<p>다음은 <code>&&</code>(논리 AND) 연산자의 예제입니다.</p> - -<pre class="brush: js">a1 = true && true // t && t returns true -a2 = true && false // t && f returns false -a3 = false && true // f && t returns false -a4 = false && (3 == 4) // f && f returns false -a5 = 'Cat' && 'Dog' // t && t returns "Dog" -a6 = false && 'Cat' // f && t returns false -a7 = 'Cat' && false // t && f returns false -a8 = '' && false // f && f returns "" -a9 = false && '' // f && f returns false</pre> - -<h3 id="논리_OR_()"><a name="Logical_OR">논리 OR (<code>||</code>)</a></h3> - -<p>다음은 <code>||</code>(논리 OR) 연산자의 예제입니다.</p> - -<pre class="brush: js">o1 = true || true // t || t returns true -o2 = false || true // f || t returns true -o3 = true || false // t || f returns true -o4 = false || (3 == 4) // f || f returns false -o5 = 'Cat' || 'Dog' // t || t returns "Cat" -o6 = false || 'Cat' // f || t returns "Cat" -o7 = 'Cat' || false // t || f returns "Cat" -o8 = '' || false // f || f returns false -o9 = false || '' // f || f returns "" -o10 = false || varObject // f || object returns varObject -</pre> - -<h3 id="논리_NOT_(!)"><a name="Logical_NOT">논리 NOT (<code>!</code>)</a></h3> - -<p>다음은 <code>!</code>(논리 NOT) 연산자의 예제입니다.</p> - -<pre class="brush: js">n1 = !true // !t returns false -n2 = !false // !f returns true -n3 = !'' // !f returns true -n4 = !'Cat' // !t returns false -</pre> - -<h4 id="이중_NOT_(!!)">이중 NOT (<code>!!</code>)</h4> - -<p>NOT 연산자 다수를 연속해서 사용하면 아무 값이나 불리언 원시값으로 강제 변환할 수 있습니다. 변환 결과는 피연산자 값의 "참스러움"이나 "거짓스러움"에 따릅니다. ({{Glossary("truthy", "참")}}과 {{Glossary("falsy", "거짓")}}을 참고하세요)</p> - -<p>동일한 변환을 {{jsxref("Boolean")}} 함수로도 수행할 수 있습니다.</p> - -<pre class="brush: js">n1 = !!true // !!truthy returns true -n2 = !!{} // !!truthy returns true: any object is truthy... -n3 = !!(new Boolean(false)) // ...even Boolean objects with a false .valueOf()! -n4 = !!false // !!falsy returns false -n5 = !!"" // !!falsy returns false -n6 = !!Boolean(false) // !!falsy returns false -</pre> - -<h3 id="불리언_변환_규칙">불리언 변환 규칙</h3> - -<h4 id="AND에서_OR로_변환">AND에서 OR로 변환</h4> - -<p>불리언 계산에서, 다음 두 코드는 항상 같습니다.</p> - -<pre class="brush: js">bCondition1 && bCondition2 -</pre> - -<pre class="brush: js">!(!bCondition1 || !bCondition2)</pre> - -<h4 id="OR에서_AND로_변환">OR에서 AND로 변환</h4> - -<p>불리언 계산에서, 다음 두 코드는 항상 같습니다.</p> - -<pre class="brush: js">bCondition1 || bCondition2 -</pre> - -<pre class="brush: js">!(!bCondition1 && !bCondition2)</pre> - -<h4 id="NOT_간_변환">NOT 간 변환</h4> - -<p>불리언 계산에서, 다음 두 코드는 항상 같습니다.</p> - -<pre class="brush: js">!!bCondition -</pre> - -<pre class="brush: js">bCondition</pre> - -<h3 id="중첩_괄호_제거">중첩 괄호 제거</h3> - -<p>논리 표현식은 항상 왼쪽에서 오른쪽으로 평가되므로, 몇 가지 규칙을 따르면 복잡한 표현식에서 괄호를 제거할 수 있습니다.</p> - -<h4 id="중첩_AND_제거">중첩 AND 제거</h4> - -<p>불리언의 합성 계산에서, 다음 두 코드는 항상 같습니다.</p> - -<pre class="brush: js">bCondition1 || (bCondition2 && bCondition3) -</pre> - -<pre class="brush: js">bCondition1 || bCondition2 && bCondition3</pre> - -<h4 id="중첩_OR_제거">중첩 OR 제거</h4> - -<p>불리언의 합성 계산에서, 다음 두 코드는 항상 같습니다.</p> - -<pre class="brush: js">bCondition1 && (bCondition2 || bCondition3) -</pre> - -<pre class="brush: js">!(!bCondition1 || !bCondition2 && !bCondition3)</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES1')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-11.11')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td>Defined in several sections of the specification: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4.9">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.11">Binary Logical Operators</a></td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-binary-logical-operators')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>Defined in several sections of the specification: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-binary-logical-operators">Binary Logical Operators</a></td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-binary-logical-operators')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td>Defined in several sections of the specification: <a href="http://tc39.github.io/ecma262/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://tc39.github.io/ecma262/#sec-binary-logical-operators">Binary Logical Operators</a></td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.operators.logical")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li><a href="/ko/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">비트 연산자</a></li> - <li>{{jsxref("Boolean")}}</li> - <li>{{Glossary("truthy", "참")}}</li> - <li>{{Glossary("falsy", "거짓")}}</li> -</ul> diff --git a/files/ko/web/javascript/reference/statements/default/index.html b/files/ko/web/javascript/reference/statements/default/index.html deleted file mode 100644 index 4fe127b7db..0000000000 --- a/files/ko/web/javascript/reference/statements/default/index.html +++ /dev/null @@ -1,122 +0,0 @@ ---- -title: default -slug: Web/JavaScript/Reference/Statements/default -tags: - - JavaScript - - Keyword - - Reference -translation_of: Web/JavaScript/Reference/Statements/switch -translation_of_original: Web/JavaScript/Reference/Statements/default ---- -<div>{{jsSidebar("Statements")}}</div> - -<p><code><strong>default</strong></code> 키워드는 {{jsxref("Statements/switch", "switch")}} 구문과 {{jsxref("Statements/export", "export")}} 구문에서 사용할 수 있습니다.</p> - -<div>{{EmbedInteractiveExample("pages/js/statement-default.html")}}</div> - - - -<h2 id="구문">구문</h2> - -<p>{{jsxref("Statements/switch", "switch")}} 구문 내에서는 다음과 같이 사용합니다.</p> - -<pre class="syntaxbox">switch (expression) { - case value1: - //Statements executed when the result of expression matches value1 - [break;] - default: - //Statements executed when none of the values match the value of the expression - [break;] -}</pre> - -<p>{{jsxref("Statements/export", "export")}} 구문 내에서는 다음과 같이 사용합니다.</p> - -<pre class="syntaxbox">export default <em>nameN</em> </pre> - -<h2 id="설명">설명</h2> - -<p>세부사항을 보려면,</p> - -<ul> - <li>{{jsxref("Statements/switch", "switch")}} 구문,</li> - <li>{{jsxref("Statements/export", "export")}} 구문 페이지를 확인하세요.</li> -</ul> - -<h2 id="예제">예제</h2> - -<h3 id="switch에서_default_사용"><code>switch</code>에서 <code>default</code> 사용</h3> - -<p>아래 예제에서 <code>expr</code> 이 "오렌지" 또는 "사과"일 때, 프로그램은 값을 "오렌지" 또는 "사과"와 일치시키고 해당 명령문을 실행합니다. 기본(<code>default</code>) 키워드는 다른 경우에 도움이 되며 연관된 명령문을 실행합니다.</p> - -<pre class="brush: js">switch (expr) { - case '오렌지': - console.log('오렌지는 1000원입니다.'); - break; - case '사과': - console.log('사과는 500원입니다.'); - break; - default: - console.log('죄송합니다. ' + expr + '의 재고가 다 떨어졌습니다.'); -}</pre> - -<h3 id="export에서_default_사용"><code>export</code>에서 <code>default</code> 사용</h3> - -<p>단일 값을 내보내거나 모듈의 기본 값이 필요한 경우, 기본 내보내기를 사용할 수 있습니다.</p> - -<pre class="brush: js">// module "my-module.js" -let cube = function cube(x) { - return x * x * x; -}; -export default cube;</pre> - -<p>다른 스크립트에서 가져오는 건 간단합니다.</p> - -<pre class="brush: js">// module "my-module.js" -import cube from 'my-module'; //default export gave us the liberty to say import cube, instead of import cube from 'my-module' -console.log(cube(3)); // 27 -</pre> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-switch-statement', 'switch statement')}}</td> - <td>{{Spec2('ES6')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-exports', 'Exports')}}</td> - <td>{{Spec2('ES6')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-switch-statement', 'switch statement')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-exports', 'Exports')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - - - -<p>{{Compat("javascript.statements.default")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li>{{jsxref("Statements/export", "export")}}</li> - <li>{{jsxref("Statements/switch", "switch")}}</li> -</ul> diff --git a/files/ko/web/javascript/쉘/index.html b/files/ko/web/javascript/shells/index.html index 718fa8bdc2..718fa8bdc2 100644 --- a/files/ko/web/javascript/쉘/index.html +++ b/files/ko/web/javascript/shells/index.html diff --git a/files/ko/web/javascript/시작하기/index.html b/files/ko/web/javascript/시작하기/index.html deleted file mode 100644 index 4eeb42cae2..0000000000 --- a/files/ko/web/javascript/시작하기/index.html +++ /dev/null @@ -1,328 +0,0 @@ ---- -title: 시작하기 (자바스크립트 튜토리얼) -slug: Web/JavaScript/시작하기 -translation_of: Learn/Getting_started_with_the_web/JavaScript_basics -translation_of_original: Web/JavaScript/Getting_Started ---- -<h2 id="Why_JavaScript.3F" name="Why_JavaScript.3F">왜 자바스크립트인가?</h2> -<p>자바스크립트는 종종 오해할 수 있는 강력하고 복잡한 컴퓨터 언어이다. 사용자가 쉽게 데이터를 입력하고 결과를 볼 수 있게 어플리케이션을 빠르게 개발 할 수 있다.</p> -<p> 웹브라우저를 중심으로 또한 ECMAScript로 알려진 자바스크립트의 주요 장점은 이와 같이 브라우저를 지원하는 모든 플랫폼에 동일한 결과를 만들 수 있다. 이 페이지의 예제는 구글 맵스처럼 맥 OS와 윈도우, 리눅스에서 실행한다. 수많은 자바스크립트 라이브러리의 최근 성장과 함께 AJax 어플리케이션을 개발하거나 이벤트 처리하기, 에니메이션 만들기, DOM 엘리먼트 선택하기, 도큐먼트 탐색하기가 이제 더욱 쉬워졌다. 다양한 소유권의 이익에 의해 추진된 다른 기술의 과대 광고와는 달리 자바스크립트는 모두 무료이면서 보편적으로 채택된 클라이언트 사이드 프로그래밍 언어이면서 정말이지 유일한 크로스 플래폼이다.</p> -<h2 id="What_you_should_already_know" name="What_you_should_already_know">당신이 이미 알아야 하는 것</h2> -<p>자바스크립트는 프로그래밍을 같이 시작하기 위해 매우 쉬운 언어이다. 시작하기 위해서 당신이 필요한 모든 것은 텍스트 에디터와 웹브라우저이다. </p> -<p>이 문서의 범위를 벗어나는 자바스크립트와 함께 개발되고 통합 할 수 있는 다른 기술은 많이 있다. 첫날부터 구글맵스과 같이 완전한 어플리케이션을 만들 것이라고 기대하지 마라!</p> -<p>시작하기</p> -<p>자바스크립트로 시작하기는 매우 쉽다. 당신은 복잡한 개발 프로그램 설치가 필요가 없다. 컴파일러를 사용하거나 프로그램 만들기, 쉘을 어떻게 사용하는지 알 필요가 없다. 자바스크립트는 당신의 웹 브라우저에서 해석 된다. 당신이 해야 할 모든 일은 텍스트 파일에 당신의 프로그램을 저장하고 당신의 웹브라우저를 연다. 단지 그 것이다!</p> -<p>자바스크립트는 입문 컴퓨터 언어로서 최고의 프로그래밍 언어이다. 새로운 학생에게 즉시 피드백 할 수 있게 하고 그들이 아마도 그들의 실생활에 유용한 것을 발견할 수 있는 도구들에 관한 것을 그들에게 가르친다. 이것은 전용 소프트웨어 개발자를 위해 정말 유용한 C, C++, JAVA 와는 뚜렷하게 대조적이다. </p> -<h2 id="Browser_Compatibility_Issues" name="Browser_Compatibility_Issues">브라우저 호환성 이슈들</h2> -<p>다른 브라우저에서 사용이 가능한 어떤 기능 중에는 차이가 있다. Mozilla, Chrome, Microsoft IE, Apple Safari, Opera에서 가동하는 것에 따라 변동될 수 있다. 이런 <a href="/en-US/docs/JavaScript/Compatibility">변동사항</a>을 문서화 하려고 한다. 사용 가능한 다양한 크로스 플랫폼 자바스크립트 API 사용하여 이런 이슈들을 완하시킬 수 있다. 이런 API는 공통 기능으로 제공하고 이 브라우저의 변동된 것을 숨긴다. </p> -<h2 id="How_to_try_the_Examples" name="How_to_try_the_Examples">예제를 시도하는 방법</h2> -<p>아래의 예제들은 몇가지 샘플 코드를 가지고 있다. 이 예제들을 시도하는 방법은 여러가지가 있다. 만약 당신이 이미 당신의 웹사이트를 가지고 있다면 당신은 당신의 웹사이트에 새로운 웹 페이지로써 이 예제들을 저장할 수 있어야 한다.</p> -<p>만약 당신이 당신의 웹사이트를 가지고 있지 않다면 당신의 컴퓨터에 파일로써 이 예제들을 저장할 수 있고 당신이 현재 사용하고 있는 웹브라우저를 통해 예제들을 열 수 있다. 자바스크립트는 이런 이유로 시작하려는 프로그래머가 사용하기 매운 쉬운 언어이다. 당신은 컴파일러 또는 개발 환경이 필요하지 않다. 그리고 당신과 당신의 브라우저가 시작하기 위해서 필요한 모든 것이다!</p> -<h2 id="Example:_Catching_a_mouse_click" name="Example:_Catching_a_mouse_click">예제 : 마우스 클릭 잡기</h2> -<p>이벤트 핸들링(이벤트 타입들, 핸들러 등록, 전파 등)의 특성은 이 간단한 예제들을 완전히 적용하기에는 너무 광범위하다. 그런데 이 예제는 자바스크립트 이벤트 시스템에 대한 조금의 탐구도 없이 마우스 클릭을 잡기를 설명할 수 없다. 이 예제는 자바스크립트 이벤트에 관해 전체 자세한 내용을 가볍게 스쳐 지나 갈 것이고 만약 당신이 여기 설명된 기본 기능의 범위를 넘어서고 싶다면 자바스크립트 이벤트 시스템에 관해 더 자세히 읽어야 함을 명심하라.</p> -<p>'마우스'이벤트들은 사용자 동작에 반응한 웹브라우저에 의해 발생된 전체 이벤트의 집합이다.<span style="line-height: 1.5;">다음은 사용자의 마우스 동작에 대한 응답으로 방출되는 이벤트의 목록이다.</span></p> -<ul> - <li>Click - 사용자가 마우스를 클릭했을 때 발생</li> - <li>DblClick - 사용자가 마우스를 더블 클릭했을 때 발생</li> - <li>MouseDown - 사용자가 마우스 버튼을 눌렀을 때 발생(클릭의 전반부)</li> - <li>MouseUp - 사용자가 마우스 버튼을 해제했을 때 발생(클릭의 후반후)</li> - <li>MouseOut - 마우스 포인터가 객체의 그래픽 범위를 떠나려고 할때 발생</li> - <li>MouseOver - 마우스 포인터가 객체의 그래픽 범위를 진입하려고 할때 발생</li> - <li>MouseMove - 마우스 포인터가 객체의 그래픽 범위 안에서 마우스 포인터를 움직이려 할때 발생</li> - <li>ContextMenu - 사용자가 오른쪽 마우스 버튼을 클릭했을 때 발생</li> -</ul> -<p>인라인 이벤트 핸들러, HTML의 최신버전에서 주의할 것은 다시 말하면 하나가 태그 애트리뷰트들로써 추가 되었다는 것은 모두 소문자 이고 스크립트의 이벤트 핸들러가 항상 모든 소문자이어야 하는 것을 예상된다.</p> -<p>이벤트 핸들러를 등록하려는 이러한 이벤트들을 캡처하기 위해 가장 간단한 방법은 HTML을 사용하여 당신의 엘리먼트의 애트리뷰트들로서 개별적인 이벤트들을 지정하는 것이다.</p> -<p>예제:</p> -<pre class="brush:js"> <span onclick="alert('Hello World!');">Click Here</span></pre> -<p>당신이 실행하기 원하는 자바스크립트 코드를 애트리뷰트 값으로서 그때마다 처리할 수 있다. 또는 당신은 HTML 페이지안에 <script> 블록에 정의되어진 함수를 호출 할 수 있다 :</p> -<pre class="brush:js"><script> - function clickHandler() { - alert("Hello, World!"); - } -</script> -<span onclick="clickHandler();">Click Here</span></pre> -<p>또한 발생된 이벤트 객체는 캡처하거나 참조할 수 있으며 <span style="line-height: 1.5;">객체가 이벤트를 받거나 이벤트 타입 그리고 마우스가 클릭됐을 때 그러한 이벤트에 관한 특성을 접근하는 무언가 개발하는 것을 제공할 수 있다. </span><span style="line-height: 1.5;">인라인 예제를 다시 사용 하라:</span></p> -<pre class="brush:js"><script> - function clickHandler(event) { - var eType = event.type; - /* 다음은 호환성을 위한 것이다. */ - /* Moz는 이벤트 객체의 target 프로퍼티로 채운다. */ - /* IE는 <span style="font-size: 1rem;">srcElement 프로퍼티로 채운다.</span><span style="font-size: 1rem;">*/</span> - var eTarget = event.target || event.srcElement; - - alert( "Captured Event (type=" + eType + ", target=" + eTarget ); - } -</script> -<span onclick="clickHandler(event);">Click Here</span></pre> -<p>당신의 HTML안에 이벤트를 수신 등록 이외에 당신은 당신의 자바스크립트에 의해 생성된 어떠한 HTML엘리먼트 객체의 똑같은 이름으로 애트리뷰트들을 마찬가지로 설정할 수 있다. 아래의 예는 span 객체를 인스터트화하고 페이지의 body에 추가하고 mouse-over, mouse-out, mouse-down, mouse-up 이벤트들을 수신하기위해 span 객체를 등록한다. </p> -<pre class="brush:js"><body></body> -<script> - function mouseeventHandler(event) { - /*<span style="font-size: 1rem;">다음은 호환성을 위한 것이다.</span><span style="font-size: 1rem;"> */</span> - /* IE는 기본적으로 이벤트 객체를 전달하지 않는다. */ - if (!event) event = window.event; - - /* 미리 이벤트 타입과 타켓 얻기 */ - var eType = event.type; - var eTarget = event.target || event.srcElement; - alert(eType +' event on element with id: '+ eTarget.id); - } - - function onloadHandler() { - /* 페이지의 body 엘리먼트를 참조하여 얻기 */ - var body = document.body; - /* 클릭되기 위한 span 엘리먼트 생성하기 */ - var span = document.createElement('span'); - span.id = 'ExampleSpan'; - span.appendChild(document.createTextNode ('Click Here!')); - - /* 특정 마우스 이벤트를 받기 위해 spna 객체 등록하기 - 이벤트들의 소문자에 유의하라 그러나 당신이 그것을 치환하기 위한 이름의 선택은 자유다. - */ - span.onmousedown = mouseeventHandler; - span.onmouseup = mouseeventHandler; - span.onmouseover = mouseeventHandler; - span.onmouseout = mouseeventHandler; - - /* 페이지에 span 보여주기 */ - body.appendChild(span); -} - -window.onload = onloadHandler; // 우리가 핸들러를 치환한 이후에는 우리는 함수 이름 뒤에 ()을 붙여서는 안된다. -</script></pre> -<h2 id="Example:_Catching_a_keyboard_event" name="Example:_Catching_a_keyboard_event">예제: 키보드 이벤트 잡기</h2> -<p>위의 예제인 "마우스 이벤트 잡기"와 유사하게 키보드 이벤트 잡기는 자바스크립트 이벤트 시스템 탐험에 의존한다. 키보드 이벤트들은 어떤 키든 키보드에서 사용될 때마다 발생한다.</p> -<p>키보드 동작에 반응하여 방출 가능한 키보드 이벤트 목록들은 마으스로 사용 가능한 것보다 상당히 작다. </p> -<ul> - <li>KeyPress - 키보드를 누르거나 해제할때 발생</li> - <li>KeyDown - 키보드를 눌렀지만 아직 해제 않지 않았을때 발생</li> - <li>KeyUp - 키보드가 해제 되었을때 발생</li> - <li>TextInput (글을 썼던 시점에는 웹킷 브라우저에서만 가능) - 텍스트에 붙여넣기나 말하기를 하거나 또는 키보드로 입력했을 때 발생. 이 이벤트는 이 문서에 포함하지 않을 것이다.</li> -</ul> -<p><a class="new " href="/en-US/docs/DOM/event/keypress" rel="internal">keypress</a> 이벤트는 키를 눌렀을 때의 Unicode값이 keycode나 <a href="/en-US/docs/DOM/event.charCode" rel="internal" style="line-height: 1.5; font-family: 'Courier New', 'Andale Mono', monospace;">charCode</a> 프로퍼티에 둘다 저장되어 있다. 만약 키가 문자로 생성되어 눌러졌을때 (예를 들어 'a') <code style="font-style: normal; line-height: 1.5;">charCode는 문자의 경우를 반영하여 문자의 코드를 설정한다.(즉, charCode은 Shift 키를 누르고 있는지 여부를 고려한다)그렇지 않으면, 누른 키의 코드가 keyCode에 저장된다.</code></p> -<p>키보드 이벤트들을 캡쳐하기 위한 가장 간단한 방법은 당신의 엘리먼트를 애트리뷰트들로써 개별적인 이벤트들을 지정한 HTML안에 이벤트 핸들러들을 다시 저장하는 것이다.</p> -<p>예:</p> -<pre class="brush:js"> <input type="text" onkeypress="alert ('Hello World!');"> -</pre> -<p>마우스 이벤트들과 마찬가지로 당신이 실행하기 원하는 자바스크립트 코드는 그때마다 처리할 수 있다. 또는 당신은 HTML 페이지안에 <script> 블록에 정의되어진 함수를 호출 할 수 있다 :</p> -<pre class="brush:js"><script> - function keypressHandler() { - alert ("Hello, World!"); - } -</script> - -<input onkeypress="keypressHandler();" /> -</pre> -<p>타겟을 참조하거나 이벤트를 캡쳐 하는 것은 (즉, 눌러진 실제 키) 마우스 이벤트를 비슷한 방법으로 이룰 수 있다.</p> -<p> <span style="font-family: 'Courier New', 'Andale Mono', monospace; font-size: 1rem; line-height: 19px; background-color: rgb(246, 246, 242);"><script type="text/javascript"></span></p> -<pre class="brush:js"> function keypressHandler(evt) { - var eType = evt.type; // 이벤트 타입으로써 <span style="font-size: 1rem;">"keypress"를 반환할 것이다.</span></pre> -<pre class="brush:js"> - /* <span style="font-size: 1rem;">여기에 우리는 </span><span style="font-size: 1rem;">which 나 다른 </span><span style="font-size: 1rem;">keyCode로 반환되는 모질라 기반으로 된 브라우저를 크로스 브라우저 방법으로 사용할 필요가 있다. </span><a href="/en-US/docs/JavaScript/Reference/Operators/Conditional_Operator" style="font-size: 1rem;" title="/en-US/docs/JavaScript/Reference/Operators/Conditional_Operator">조건 연산자</a><span style="font-size: 1rem;"> 또는 삼항식이 </span><span style="font-size: 1rem;">좋은 방법이다.</span> - var keyCode = evt.which?evt.which:evt.keyCode; - var eCode = 'keyCode is ' + keyCode; - var eChar = 'charCode is ' + .fromCharCode(keyCode); // 또는 evt.charCode - alert ("Captured Event (type=" + eType + ", key Unicode value=" + eCode + ", ASCII value=" + eChar + ")"); - } -</script> -<input onkeypress="keypressHandler(event);" /></pre> -<p>페이지로 부터 어떤 키 이벤트를 캡처하기 위해서는 문서 레벨에서 이벤트를 등록하거나 함수안에서 처리하여 마칠 수 있다. </p> -<pre class="brush:js"><script> - document.onkeypress = keypressHandler; - document.onkeydown = keypressHandler; - document.onkeyup = keypressHandler; -</script></pre> -<p><span style="line-height: 1.5;">여기에 키 이벤트 처리하기 보여주는 완벽한 예제가 있다.</span></p> -<pre class="brush:js"><!DOCTYPE html> -<html> -<head> - <script> - var metaChar = false; - var exampleKey = 16; - function keyEvent(event) { - var key = event.keyCode || event.which; // alternative to ternary - if there is no keyCode, use which - var keychar = String.fromCharCode(key); - if (key == exampleKey) { - metaChar = true; - } - if (key != exampleKey) { - if (metaChar) { - alert("Combination of metaKey + " + keychar) - metaChar = false; - } else { - alert("Key pressed " + key); - } - } - } - function metaKeyUp(event) { - var key = event.keyCode || event.which; - if (key == exampleKey) { metaChar = false; } - } - </script> -</head> -<body onkeydown="keyEvent(event)" onkeyup="metaKeyUp(event)"> - Try pressing any key! -</body> -</html></pre> -<h3 id="브라우저_버그들과_이상한_점">브라우저 버그들과 이상한 점</h3> -<p>키 이벤트를 통해서 사용 가능하게 만들어진 두개의 프로퍼티들은 keycode와 charCode이다. 단순한 용어로 keyCode는 사용자에 의해 눌러진 실제 키보드 키를 의미하는데 반하여 charCode는 키의 ASCII 값을 반환한다. 이 두 값들은 반드시 동일하지 않을 수 있다. 예를 들어 소문자 'a'와 대문자 'A'는 같은 keyCode를 가지고 있다. 왜냐하면 사용자는 같은 키를 누르기 때문이다. 하지만 다른 charCode를 가지는 것은 왜냐하면 결과 문자가 다르기 때문이다.</p> -<p>charCode가 해석되는 브라우저의 방법은 일관되게 적용되는 방법이 아니다. 예를 들어 Internet Explorer 와 Opera는 charCode를 지원하지 않는다. 그런데 그들은 keyCode안에 문자 정보를 준다. onkeypress만 아니라 onkeydown 와 onkeyup의 keyCode가 키 정보를 가지고 있다. Firefox 는 "which", 문자를 구별하기 위해 다른 단어를 사용한다. </p> -<p>더 나아가 키 이벤트들을 다루는 것에 관해서는 <span style="line-height: 1.5;"> </span><a href="/en-US/docs/DOM/Event/UIEvent/KeyboardEvent" style="line-height: 1.5;" title="https://developer.mozilla.org/en-US/docs/DOM/Event/UIEvent/KeyEvent">Keyboard Events</a>에 대한<span style="line-height: 1.5;"> </span><span style="line-height: 1.5;">Mozilla 문서를 참조하시오.</span></p> -<p>{{ draft() }}</p> -<h2 id="Example:_Dragging_images_around" name="Example:_Dragging_images_around">예제: 이미지 주변에 드래그하기</h2> -<p>다음 예제는 페이지 근처의 firefox의 이미지를 이동할 수 있다.</p> -<pre class="brush:js"><!DOCTYPE html> -<html> -<head> -<style> -img { position: absolute; } -</style> - -<script> -window.onload = function() { - - movMeId = document.getElementById("ImgMov"); - movMeId.style.top = "80px"; - movMeId.style.left = "80px"; - - document.onmousedown = coordinates; - document.onmouseup = mouseup; - - function coordinates(e) { - if (e == null) { e = window.event;} - - // <span style="font-size: 1rem;">e.srcElement은 IE에서 타겟 엘리먼트로 가지고 있고 반면 </span><span style="font-size: 1rem;">e.target은 firefox에서 타겟 엘리먼트로 가지고 있다.</span> -// 두 프로퍼티들은 이벤트가 일어난 HTML 엘리먼트를 반환한다. - var sender = (typeof( window.event ) != "undefined" ) ? e.srcElement : e.target; - - if (sender.id=="ImgMov") { - mouseover = true; - pleft = parseInt(movMeId.style.left); - ptop = parseInt(movMeId.style.top); - xcoor = e.clientX; - ycoor = e.clientY; - document.onmousemove = moveImage; - return false; - } - return false; - } - - function moveImage(e) { - if (e == null) { e = window.event; } - movMeId.style.left = pleft+e.clientX-xcoor+"px"; - movMeId.style.top = ptop+e.clientY-ycoor+"px"; - return false; - } - - function mouseup(e) { - document.onmousemove = null; - } -} -</script> -</head> - -<body> - <img id="ImgMov" src="http://placehold.it/100x100&text=JS" width="64" height="64"> - <p>Drag and drop around the image in this page.</p> -</body> - -</html></pre> -<h2 id="Example:_Resizing_things" name="Example:_Resizing_things">예제: 크기 조정하기</h2> -<div> - <p>이미지 크기 조정하는 예제(실제 이미지가 크기가 조정되는 것이 아니고, 이미지의 랜더링만 되는 것이다.)</p> - <pre class="brush:js"> <!DOCTYPE html> - <html> - <head> - <style> - #resizeImage { - margin-left: 100px; - } - </style> - <script> - window.onload = function() { - - var resizeId = document.getElementById("resizeImage"); - var resizeStartCoordsX, - resizeStartCoordsY, - resizeEndCoordsX, - resizeEndCoordsY; - - var resizeEndCoords; - var resizing = false; - - document.onmousedown = coordinatesMousedown; - document.onmouseup = coordinatesMouseup; - - function coordinatesMousedown(e) { - if (e == null) { - e = window.event; - } - - var element = (typeof( window.event ) != 'undefined' ) ? e.srcElement : e.target; - - if (element.id == "resizeImage") { - resizing = true; - resizeStartCoordsX = e.clientX; - resizeStartCoordsY = e.clientY; - } - return false; - } - - function coordinatesMouseup(e) { - if (e == null) { - e = window.event; - } - - if (resizing === true) { - var currentImageWidth = parseInt(resizeId.width); - var currentImageHeight = parseInt(resizeId.height); - - resizeEndCoordsX = e.clientX; - resizeEndCoordsY = e.clientY; - - resizeId.style.height = currentImageHeight - (resizeStartCoordsY - resizeEndCoordsY) + 'px'; - resizeId.style.width = currentImageWidth - (resizeStartCoordsX - resizeEndCoordsX) + 'px'; - - resizing = false; - } - return false; - } - } - </script> - </head> - - <body> - <img id="resizeImage" src="http://upload.wikimedia.org/wikipedia/commons/e/e7/Mozilla_Firefox_3.5_logo_256.png" -width="64" height="64"> - <p>Click on the image and drag for resizing.</p> - </body> - - </html></pre> -</div> -<h2 id="Example:_Drawing_Lines" name="Example:_Drawing_Lines">예제: 라인 그리기</h2> -<pre class="brush: html"><!DOCTYPE html> -<html> -<head> -<script> -function linedraw(ax,ay,bx,by) -{ - if(ay>by) - { - bx=ax+bx; - ax=bx-ax; - bx=bx-ax; - by=ay+by; - ay=by-ay; - by=by-ay; - } - var calc=Math.atan((ay-by)/(bx-ax)); - calc=calc*180/Math.PI; - var length=Math.sqrt((ax-bx)*(ax-bx)+(ay-by)*(ay-by)); - document.body.innerHTML += "<div id='line' style='height:" + length + "px;width:1px;background-color:black;position:absolute;top:" + (ay) + "px;left:" + (ax) + "px;transform:rotate(" + calc + "deg);-ms-transform:rotate(" + calc + "deg);transform-origin:0% 0%;-moz-transform:rotate(" + calc + "deg);-moz-transform-origin:0% 0%;-webkit-transform:rotate(" + calc + "deg);-webkit-transform-origin:0% 0%;-o-transform:rotate(" + calc + "deg);-o-transform-origin:0% 0%;'></div>" -} -</script> -</head> -<body onload="linedraw(200,400,500,900);"> <!--당신의 좌표 교체하기 --> -</body> -</html></pre> -<p> </p> |