개발하는 냥이 (=ↀωↀ=)

디스트럭처링(Destructuring) - 객체(배열, 객체)에 입력된 값을 개별적인 변수에 핼당하는 간편 방식 제공 - 배열이나 객체에서 필요한 값을 추출해서 변수에 할당하거나 반환할 때 유용하게 사용함 - 배열일경우 [] = [], 객체일경우 {} = {} 소스 "use strict"; var arr1 = [1, 2, 3]; var a = arr1[0]; var b = arr1[1]; var c = arr1[2]; console.log(a, b, c); var arr2 = [10, 20, 30]; // arr2 배열의 요소들을 순서대로 대입 [a, b, c] = arr2; console.log(a, b, c); // 10, 20, 30 // 값을 대입받는 선언식이 있으나, 받을 값이 없을 경우 und..

개발/JavaScript 2018. 12. 4. 11:15

ES6 에서 제공되는 객체 추가 문법 객체의 프로퍼티를 단축해서 사용 소스 var id = "hong", name = "홍길동", age = 33; var member1 = { id: id, name: name, age: age }; console.log(member1); // 변수의 입력된 값을 객체에 설정할 때 변수의 이름을 프로퍼티 명으로 설정하는 상황 // ES6에서 추가 var member2 = { id, // id라는 이름으로 프로퍼티명을 설정 name, age, info: function() { console.log("info"); } }; console.log(member2); // 함수를 객체에 추가할때, ES6부터 var member3 = { id, // id라는 이름으로 프로퍼티명을 ..

개발/JavaScript 2018. 12. 4. 11:06

프로토타입(prototype)의 이해... - 객체들의 공유 공간 모든 객체들은 생성시 부모가 생긴다. 소스 // new Member로 생성된 객체에 대한 부모가됨 // function Member 함수 객체에 대한 프로토타입의 공간이 있다. Member의 프로토타입의 객체 function Member(id, name, email) { this.id = id; this.name = name; this.email = email; // 모든 객체에서 동일하게 쓰이는 info에 대한 프로토타입 활용 this.info = function() { console.log(this.id, this.name, this.email); }; } // 자식인 new Member 객체는 부모인 function Member의 프..

개발/JavaScript 2018. 12. 4. 11:02

자바스크립트의 생성자 이해 - 일반 함수와 동일하게 선언 - 생성자는 함수 이름의 첫글자를 대문자로 시작하는것을 권장한다. Number, Date, Object - 일반 함수가 아닌 생성자로 사용하기 위해서는 "new"와 함께 사용해야 한다. - new와 함께 사용하는 함수는 this의 해석이 달라진다. 소스 "use strict"; function Member() { console.log(this); } // 일반 함수의 호출일 경우에는 undefined가 반환됨 var m1 = Member(); // Member가 return하는 값이 없을 경우에는 undefined 출력됨 console.log(m1); // m1을 호출하는 객체가 없어 undefined 출력 console.log("m1 : ", m..

개발/JavaScript 2018. 12. 4. 10:47

- 여러개의 동일한 형태의 데이터를 관리하려면 회원 정보를 관리하려 한다. 조조 33 남 성남 유비 44 여 현덕 장비 22 남 장수 관우 11 남 관소 소스 var m1 = { name : "조조", age : 33, gender : "남", addr : "성남" }; var m2 = { name : "유비", age : 44, gender : "여", addr : "현덕" }; var m3 = { name : "장비", age : 22, gender : "남", addr : "장수" }; var m4 = { name : "관우", age : 11, gender : "남", addr : "관소" }; function createMember(name, age, gender, addr) { // 프로퍼티명..

개발/JavaScript 2018. 12. 4. 10:45

- 객체는 연관성 있는 데이터를 묶어서 관리하고 싶을때 - 데이터와 기능을 묶어서 관리할때.. 소스 "use strict"; var member = { // setter id : "hong", name : "홍길동", setId : function(id) { this.id = id; }, // getter getId : function() { return this.id; } }; console.log(member.id, member.getId()); // 아이디 변경 member.setId("kang"); console.log(member.id, member.getId()); 결과 hong hong kang kang

개발/JavaScript 2018. 12. 4. 10:41

일반적으로 함수내에서의 this는 함수를 호출한 객체이다. 소스 "use strict"; var m1 = { name : "이동욱" }; var m2 = { name : "배수지" }; function msg() { console.log(this.name); // this는 msg를 호출한 객체를 가르킴 } // m1.msg = "aaa"; // m1.msg = msg(); // 함수의 return이 없으니 undefined // var m = msg; m1.msg = msg; // 함수참조를 m1.msg에 줌 m2.msg = msg; // 함수참조를 m2.msg에 줌 m1.msg(); // msg는 함수니까 ()로 호출 m2.msg(); // msg(); // Cannot read property 'n..

개발/JavaScript 2018. 12. 4. 10:38

객체를 변수에 저장하게 되면 변수에는 객체의 주소가 저장됨 소스 "use strict"; /* * var hong = 'aaa'; var member1 = {id:hong} -> hong의 값을 id에 대입 */ var member1 = { id : "hong", email : "hong@a.com" }; var member2 = member1; // member1과 2는 같은 주소를 참조 member2.id = "kang"; console.log("member1 : ", member1); console.log("member2 : ", member2); //객체일 때 내용을 확인 //for ~ in 객체의 키를 반환 for ( var key in member1) { console.log("key : ",..

개발/JavaScript 2018. 12. 4. 10:34