분류 전체보기 썸네일형 리스트형 [Javascript] 객체지향 자바스크립트 [컬렉션] 컬렉션 (Collection) Map Set WeakMap WeakSet 왜 WeakMap 과 WeakSet은 Iterable 하지 않은가? 메모리 누수? 일반적인 Object 도 key 와 value 의 쌍을 계속 추가할 수 있는 일종의 컬렉션이다. 하지만 몇가지 문제들이 있다. 기본적으로 Object 는 Object 의 Key 는 문자열과 Symbol만이 사용될 수 있고, [Symbol.iterator] 를 추가하지않는 한 이터러블하지 않다. ES6 컬렉션은 사용자의 데이터와 빌트인(built-in) 메서드의 이름이 충돌되지 않기 위해 설계되었다. 즉, 컬렉션의 key는 빌트인 메서드들과 분리되어있기 때문에 컬렉션 내의 멤버 데이터를 드러내지 않는다. 이러한 이유로 직접적으로 obj.[key] obj.. 마크다운(Mark Down) 이렇게 편했다니! 지금까지 글을 작성하다가 마크다운 양식을 썻는데 신세계.... 훨씬 깔끔하고 사용법도 간편하다. 소스코드도 언어별로 지원되고 유용한듯 앞으로는 마크다운 양식으로 업로드할 예정이다. 그리고 공부의 깊이에 너무 안일해있었기에 좀더 심도있게 들어가야겠다 [Javascript] 객체지향 자바스크립트 [이터레이터, 이터러블, 제너레이터] 이터레이터, 이터러블, 제너레이터 for forEach() for...in for...of 심볼(Symbol) 인터페이스(Interface) 이터레이터(Iterator) 이터러블(Iterable) 제너레이터(Generator) for 배열루프를 순회하기위한 일반적인 방법 for(var i = 0; i = 0){ console.log(arr.pop());} while 문을 살펴보도록 하자 while( 계속 반복할지 판단 ) { 반복시마다 처리할 것}데이터에 대한 공급 : 계속 반복할지 판단 부분과 반복시마다 처리할 것 데이터에 대한 소비 : while문 자체는 데이터 공급에대한 소비이다.이터레이터 인터페이스 에 맞춰서 본다면 var obj = { array: [1, 2, 3, 4], next: functi.. [Javascript] 객체지향 자바스크립트 [소괄호의 의미와 IIFE] 소괄호의 의미 소괄호 () 가 의미하는 바가 무엇인지 알아보고, 즉시실행함수(IIFE)가 무엇인지 알아보도록한다. 함수 선언과 표현 먼저 함수 선언과 표현에대한 차이점을 알아보도록 한다. 함수선언 (Function Declarations) function name (parameter){ statements} name : 함수이름 parameter : 함수의 인자이며 255개까지 인자를 가질 수 있습니다 statements : 함수의 본문을 기술합니다함수의 선언은 이름을 가지며 선언시 자동으로 호이스팅(hoisting) 됩니다. foo(); function foo(){ console.log("hello");}// "hello" 함수 선언을 뒤에 했음에도 불구하고 foo() 호출시에 정상적으로 작동 함수표현.. [Javascript] 객체지향 자바스크립트 [객체 part3, 내장객체] # Function * 함수는 실제로 객체다 * Function() 이라는 내장 생성자 함수가 존재* Function() 생성자는 eval() 과 동일한 단점을 가지므로 피하는 것이 좋다function sum(a, b){ // 함수 선언 return a + b; } console.log(sum(1, 2)) // 3 var sub = function(a, b){ // 함수 표현식 return a - b; } console.log(sub(2, 1)) // 1 var multi = new Function('a', 'b', 'return a * b'); // Function() 생성자 이용 console.log(multi(1, 2)); // 2* Function() 생성자 함수에 대한 참조를 가진 constru.. [Javascript] 객체지향 자바스크립트 [객체 part 2] # ES6 객체 리터럴 * 변수의 이름과 속성 키가 같은 경우 ES6에서 약식구문 사용 가능/* 일반적인 방법 let a = 1; let b = 2; let val = {a: a, b: b}; console.log(val); // { a: 1, b: 2 } */ // ES6 let a = 1; let b = 2; let val = {a, b}; console.log(val); // { a: 1, b: 2 } * function 과 : 를 생략 가능/* 일반적인 방법 var obj = { num: 1, get: function(){ console.log(this.num); } } */ // ES6 var obj = { num: 1, get(){ console.log(this.num); } } obj.get.. [Javascript] 객체지향 자바스크립트 [객체 part 1] # 배열에서 객체로 * 배열은 값의 목록일 뿐이다 var myarr = ['red', 'blue', 'yellow']; // 키(index) = 0, 1, 2 // 값 = red, blue, yellow * 키와 값이 쌍의 테이블이다 var hero = { name : 'heecheol', job : 'ninja' }; /* 객체를 참조하는 변수의 이름은 hero 배열은 [], 객체는 {} 사용 []로 배열을 정의하는것 - 배열 리터럴 표기법(array literal notation) {}로 객체를 정의하는것 - 객체 리터럴 표기법(object literal notation) 요소(property)는 쉼표( , )로 구분 key : value 와 같이 콜론으로 키와 값을 나눈다 key의 이름이 변수로 유.. [Javascript] 객체지향 자바스크립트 [클로저] # 클로저(closure) 범위체인 (scope chain) 자바스크립트의 범위에는 중괄호 범위가 아닌 함수범위가 존재한다. (ES6부터는 let, const 키워드 도입으로 블록단위 사용가능) 예) 클로저는 해당 함수에대한 환경을 기억한다, 자바스크립트는 객체단위이다 예) a() 를 두번호출한 후 b() 를 호출하면 addOne() 의 함수이름이 같기때문에 b() 의 호출값은 3 이 되어야 맞지만 1 이 출력된다 그 이유는 변수 a 와 변수 b 는 다른 객체이기 때문에 서로 다른 환경을 가지고 있다. 루프의 클로저 클로저는 외부함수의 변수에대한 참조를 기억한다 예) 예상한 결과와 다르게 나온다, 그 이유가 무엇일까? 함수는 값을 기억하지 못하고, 생성된 환경에대한 참조(링크)만 기억한다 그렇기때문에 함.. 이전 1 ··· 3 4 5 6 7 8 9 다음
