-
new 연산자와 생성자 함수개발 지식/자바스크립트 2022. 7. 25. 09:39
다음 내용은 모던 자바스크립트(https://ko.javascript.info)를 참고로 하였다. 생성자 함수(constructor function)와 일반 함수에 기술적인 차이는 없다. 다만 생성자 함수는 아래 두 관례를 따른다. 함수 이름의 첫 글자는 대문자로 시작합니다. 반드시 'new' 연산자를 붙여 실행합니다. function User(name) { this.name = name; this.isAdmin = false; } let user = new User("보라"); new User(...)를 써서 함수를 실행하면 아래와 같은 알고리즘이 동작합니다. 빈 객체를 만들어 this에 할당합니다. 함수 본문을 실행합니다. this에 새로운 프로퍼티를 추가해 this를 수정합니다. this를 반환합니..
-
this개발 지식/자바스크립트 2022. 7. 24. 14:02
모던 자바스크립트(https://ko.javascript.info)를 참고로 하여 작성하였습니다. this 값은 런타임에 결정된다. 컨텍스트에 따라 달라지는 것이다. 동일한 함수라도 다른 객체에서 호출했다면 'this’가 참조하는 값이 달라진다. 다른 객체에서 동일한 함수를 메서드로 사용하였을 때 this는 해당 객체를 의미한다. user.f = sayHi; admin.f = sayHi; let user = { name: "John" }; let admin = { name: "Admin" }; function sayHi() { alert( this.name ); } // 별개의 객체에서 동일한 함수를 사용함 user.f = sayHi; admin.f = sayHi; // 'this'는 '점(.) 앞의' ..
-
참조에 의한 객체 복사개발 지식/자바스크립트 2022. 7. 23. 14:14
이 글은 모던 자바스크립트(https://ko.javascript.info)에서 참조하였습니다. 객체와 원시 타입의 차이 중 하나는 객체는 ‘참조에 의해(by reference)’ 저장되고 복사된다는 것입니다. 원시값(문자열, 숫자, 불린 값)은 ‘값 그대로’ 저장·할당되고 복사되는 반면에 말이죠. let message = "Hello!"; let message2 = message; 그런데 객체는 이와 다르게 동작합니다. 변수엔 객체가 그대로 저장되는 것이 아니라, 객체가 저장되어있는 '메모리 주소’인 객체에 대한 '참조 값’이 저장됩니다. 그림을 통해 변수 user에 객체를 할당할 때 무슨 일이 일어나는지 알아봅시다. let user = { name: "John" }; 객체는 메모리 내 어딘가의 부분에..
-
객체개발 지식/자바스크립트 2022. 7. 22. 16:52
let fruit = prompt("어떤 과일을 구매하시겠습니까?", "apple"); let bag = { [fruit]: 5, // 변수 fruit에서 프로퍼티 이름을 동적으로 받아 옵니다. }; alert(bag.apple); 위 예시에서 [fruit]는 프로퍼티 이름을 변수 fruit에서 가져오겠다는 것을 의미한다. 사용자가 프롬프트 대화상자에 apple을 입력했다면 bag엔 {apple: 5}가 할당되었을 것이다. function makeUser(name, age) { return { name: name, age: age, // ...등등 }; } let user = makeUser("John", 30); console.log(user.name);// "John" console.log(user...
-
화살표 함수 기본개발 지식/자바스크립트 2022. 7. 22. 16:27
이 글은 모던 자바스크립트(https://ko.javascript.info/)를 참고로 하였다. 함수 표현식보다 단순하고 간결한 문법으로 함수를 만들 수 있는 방법이 있다. arrow function 이 그 대안이라고 할 수 있다. let sum = (a, b) => a + b; /* 위 화살표 함수는 아래 함수의 축약 버전입니다. let sum = function(a, b) { return a + b; }; */ alert( sum(1, 2) ); // 3 let age = prompt("나이를 알려주세요.", 18); let welcome = (age alert('안녕') : () => alert("안녕하세요!"); welcome(); 함수 본문이 한 줄인 간단한 함수는 화살..
-
형 변환개발 지식/자바스크립트 2022. 7. 22. 16:11
이 글의 출처는 모던 자바스크립트(https://ko.javascript.info/) 을 따릅니다. To 문자형 let value = true; alert(typeof value); // boolean value = String(value); // 변수 value엔 문자열 "true"가 저장됩니다. alert(typeof value); // string let value2 = false; value2 = String(value2); alert(typeof value2); To 숫자형 숫자형으로의 변환은 수학과 관련된 함수와 표현식에서 자동으로 일어난다. alert( "6" / "2" ); // 3, 문자열이 숫자형으로 자동변환된 후 연산이 수행됩니다. let str = "123"; // 4, 문자열 ..