Jaddong's Lab

더보기 primitives : 원시형 explicitly : 명쾌하게 exclusively : 독점으로 intuitively : 직관으로 대부분의 경우, 연산자와 함수들은 자동적으로 주어진 값을 적절한 형태로 변환한다. 예를 들면, alert은 값을 보여주기 위해 어떤 값을 문자열 형태 자동 변환한다. 수학적 연산자는 값을 숫자형으로 변환한다. 우리가 값을 기대한 형태로 명확하게 변환할 필요가 있을 때도 형변환 하는 경우이다. 아직 객체에 대해서 얘기하고 있진 않다. 이 챕터에서 우리는 객체는 다루지 않을 것이다. 지금부터 우리는 원시형에 대해서만 다룰 것이다. 객체를 원시형태로 변화하는 건, 객체에 대한 것을 배우고 이 후에 볼 것이다. 문자형으로 변환 문자형으로 형 변환은 문자형태의 값이 필요할 때 ..

alert 메시지가 있는 작은 창을 modal window라고 부른다. "modal"이란 단어는 방문자가 "OK"를 누를때까지 나머지 페이지와 인터렉션을 할 수 없고, 버튼을 못 누르는 등의 의미를 말한다. alert("Hello"); prompt prompt 함수는 두 개의 인수를 받는다. result = prompt(title, [default]); 텍스트 메세지와 입력할 수 있는 input 필드 그리고 OK/Cancel버튼이 modal 창에 보여진다. title 방문자가 보는 텍스트이다. default 두번째 파라미터로 옵션사항이고 input 필드의 초기 값을 나타낸다. 위에서 예시의 []대괄호(square brackets)는 필수 값이 아님을 나타낸다.(denote) 사용자는 prompt 인풋에 ..

자바스트립트 값은 항상 특정한 타입에 속한다. (ex. 문자열, 숫자형 등) 8개의 자료형이 있다. 아래와 같이 변수에 어떤 형의 값을 넣느냐에 따라서 변수의 형태가 정해진다. (=동적타입) // no error let message = "hello"; message = 123456; 숫자형 정수형(integer) : 우리 아는 단순한 정수이다. 부동소수점 숫자(floating point numbers) : 우리가 아는 소수이다. Infinity : 어떤 수보다 더 큰 수로 무한대를 의미한다. alert( 1 / 0 ); // 숫자를 0으로 나누면 무한대이다. alert( Infinity ); // Infinity 로 값을 할당할 수 있다. -Infinity : 어떤 수보다 더 작은 수로 마이너스 무한대..

변수 변수(variable)는 데이터를 저장할 때 쓰이는 ‘이름이 붙은 저장소’ 이다. var, let, const를 사용해 변수를 선언할 수 있다. let : 모던한 변수 선언 키워드 var : 오래된 변수 선언 키워드 (잘 사용하지 않음) const : let과 비슷하지만, 변수의 값을 변경할 수 없음 아래 문(statement)은 'message’라는 이름을 가진 변수를 생성(선언)한다. let message; 이제 할당 연산자 =를 사용해 변수 안에 데이터를 저장해 봅시다. let message; message = 'Hello'; // 문자열을 저장합니다. 문자열이 변수와 연결된 메모리 영역에 저장되었고 변수명을 이용해 문자열에 접근할 수 있다. let message; message = 'Hell..

use strict 이 지시자가 스크립트 최상단에 오면 스크립트 전체가 “모던한” 방식으로 동작한다. 예시: "use strict"; // 이 코드는 모던한 방식으로 실행됩니다. ... "use strict"는 스크립트 최상단이 아닌 함수 본문 맨 앞에 올 수도 있다. 이렇게 하면 오직 해당 함수만 엄격 모드로 실행된다. ✅ "use strict"는 반드시 최상단에 위치시키세요. "use strict"는 스크립트 최상단에 있지 않으면 엄격 모드가 활성화되지 않을 수도 있다. 다음 코드에서는 엄격 모드가 활성화되지 않는다. alert("some code"); // 하단에 위치한 "use strict"는 스크립트 상단에 위치하지 않으므로 무시됩니다. "use strict"; // 엄격 모드가 활성화되지 않습..

문 문(statement)은 어떤 작업을 수행하는 문법 구조(syntax structure)와 명령어(command)를 의미한다. 이때, 서로 다른 문은 세미콜론으로 구분합니다. alert('Hello'); alert('World'); 코드의 가독성을 높이기 위해 각 문은 서로 다른 줄에 작성하는 것이 일반적이다. alert('Hello'); alert('World'); 세미콜론 줄 바꿈이 있다면 세미콜론(semicolon)을 생략할 수 있고 이런 방식을 '암시적'세미콜론 또는 세미콜론 자동 삽입(automatic semicolon insertion)이라 한다. alert('Hello') alert('World') 아래와 같이 줄 바꿈이 세미콜론을 의미하지 않는 경우가 있다. 이는 '불완전한 표현식’이므..

‘script’ 태그 자바스크립트는 HTML 문서 어느 곳에나 삽입할 수 있다. 브라우저는 이 자바스크립트 태그를 만나면 안의 코드를 자동으로 처리한다. 예시: 스크립트 전 스크립트 후 모던 마크업 자바스크립트 태그엔 몇 가지 속성(attribute)이 있습니다. 요즘엔 잘 사용하진 않지만, 오래된 코드에서 종종 이 속성을 발견할 수 있습니다.1. type 속성:HTML4에선 스크립트에 type을 명시하는 것이 필수였으나 지금은 타입 명시가 필수가 아니다. 게다가 모던 HTML 표준에선 이 속성의 의미가 바뀌었습니다.2. language 속성:이 속성은 현재 사용하고 있는 스크립트 언어를 나타내지만 지금은 자바스크립트가 기본 언어이므로 속성의 의미가 퇴색되어 더이상 사용할 필요가 없어졌다.3. 스크립트 ..

브라우저엔 '개발자 도구’라는 것이 내장되어 있고 이 도구를 이용하면 에러를 확인할 수 있다. 대부분의 개발자는 개발자 도구때문에 Chrome이나 Firefox를 이용해 개발하는 걸 선호한다. 개발자 도구에서 지원하는 기능을 잘 활용하면 개발 효율이 상당히 올릴 수 있다. Chrome F12 또는 Mac 사용자라면 Cmd+Opt+J를 누르면 개발자 도구가 뜬다. 예로 위와 같이 빨간색 에러 메시지가 보이는 경우 'lalala’가 정의되지 않았다(not defined)라는 메시지이고, 에러 메시지 우측에 링크 bug.html:12 는 해당 에러가 발생한 파일에서 12줄에 에러가 발생함을 나타낸다. 에러 메시지 아래에 파란색 기호 >가 있는데, 이를 '커맨드 라인(command line)'이라 부르고 커맨드..

코드 에디터는 크게 통합 개발 환경(IDE)과 경량 에디터로 나뉘는데, 많은 개발자가 둘 중 하나를 택해 작업한다. 통합 개발 환경 통합 개발 환경 (Integrated Development Environment, IDE)는 '프로젝트 전체’를 관장하는 다양한 기능을 제공하고 '개발 환경’을 쾌적하게 해주는 통합 환경을 제공합니다. IDE를 이용하면 수많은 파일로 구성된 프로젝트를 불러오고, 파일 간의 탐색 작업이 수월해진다. 전체 프로젝트에 기반한 자동 완성 기능도 사용할 수 있고 git과 같은 버전 관리 시스템, 테스팅 환경 등, '프로젝트 수준’의 작업도 IDE에서 할 수 있다. Visual Studio Code (크로스 플랫폼, 무료) WebStorm (크로스 플랫폼, 유료) 경량 에디터 '경량 ..

명세서 ECMA-262 명세서(specification)는 자바스크립트와 관련된 가장 심도 있고 신뢰할만한 정보를 담고 있는 공식 문서로 자바스크립트라는 언어를 정의한다. 하지만 일상적인 참고자료로는 적합하지 않다. ECMA-262명세서는 새로운 버전이 매년 나오고 공식 버전이 나오기 이전의 최신 초안은 https://tc39.es/ecma262/ 에서 확인할 수 있다. 갓 명세서에 등록된 기능이나 '등록되기 바로 직전’에 있는 기능(스테이지(stage)3 상태의 기능), 제안 목록은 https://github.com/tc39/proposals 에서 확인할 수 있다. 매뉴얼 Mozilla 재단이 운영하는 MDN JavaScript Reference(https://developer.mozilla.org/e..