자바스크립트 17

자바스크립트 Class 이해하기

Classes are essentially blueprints for objects. Class는 Object의 필수적인 설계이다. Class는 class 이름이 있고 프로퍼티와 메소드를 둘 다 가지고 있을 수 있다. constructor 디폴트 메소드로 해당 class를 인스턴스화할 때마다 실행된다. class Human { constructor(){ this.gender = 'male'; } printGender() { console.log(this.gender) } } class Person extends Human { constructor(){ super(); // extends를 쓸 때 이것이 없으면 상의 클래스인 Human의 constructor가 실행되지 않아 에러가 발생한다. this.na..

2.7 형 변환

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

2.6 상호작용 : alert, prompt, confirm

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

2.5 자료형

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

2.3 엄격 모드

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

🎂 (덕질)생일축하 웹사이트 만들기(ง •_•)ง

프롤로그 벨로그를 만든 지 얼마 안되서 '트렌딩'과 '최신'메뉴를 둘러보다가,,,, 어떤 분이 친구에게 생일 선물이 웹사이트를 선물한 걸 포스팅한 걸 보았다.(⊙o⊙) 너무 좋은 아이디어라고 생각이 들었고, 한 번 나도 해보기로 했다....! 근데 지인보다는 내가 좋아하는 연예인?가수?의 생일 팬페이지 면 좋을 것 같다는 생각이 들어서 개발에 돌입했다. 계획 디자인 우선 디자인부터 해야하는데,,,, 넘나 막막한거다ㅠㅠ 그런데 안그래도 요즘 자바스크립트로 만드는 다이나믹한 인터렉션에 관심이 생겨(사실 예전부터 있었음 ㅎ.ㅎ) 수강신청해놨던 '1분코딩'강의를 들으면서 만들어보기로 했다. 메뉴구성 Home : 말 그대로 인덱스 페이지로 휘황찬란한 인터렉션을 넣어보는 거 목표로 했다. Letter : 친구의 아..