Phot_o_matic Programming

고정 헤더 영역

글 제목

메뉴 레이어

Phot_o_matic Programming

메뉴 리스트

  • 홈
  • 태그
  • 방명록
  • 분류 전체보기
    • Programming
      • TIL
      • Concept
      • Algorithm
      • Hello, stranger
      • Mindchain
      • Python
      • Vue
      • React
      • Git
      • GraphQL
      • Database
      • Twittler
      • Typescript
    • Photography
      • Olympus
      • Canon
    • IT
    • Daily
      • Yummy

검색 레이어

Phot_o_matic Programming

검색 영역

컨텐츠 검색

Programming/Concept

  • Tagged Template literals - HTML, Javascript ES6

    2019.04.19 by 쌩우

  • Set으로 로또 추첨기 만들기 - Javascript ES6

    2019.04.19 by 쌩우

  • WeakMap으로 class의 instance 변수 보호하기 - Javascript ES6

    2019.04.19 by 쌩우

  • Map 과 WeakMap - Javascript ES6

    2019.04.19 by 쌩우

  • WeakSet으로 효과적인 객체 타입 저장 - Javascript ES6

    2019.04.19 by 쌩우

  • Set으로 유니크한 배열 생성하기 - Javascript ES6

    2019.04.19 by 쌩우

  • Destructuring Object - Javascript ES6

    2019.04.19 by 쌩우

  • Destructuring Array - Javascript ES6

    2019.04.19 by 쌩우

Tagged Template literals - HTML, Javascript ES6

const data = [ { name : 'starbucks', order : true, items : ['americano', 'ice coffee', 'caffelatte'] }, { name : 'ediya', order : false } ] //Tagged template literals function fn(tags, name, items){ if(typeof items === "undefined"){ items = "주문가능한 상품이 없습니다" } return (tags[0] + name + tags[1] + items + tags[2]); } 이 때, fn의 tags 파라미터는 변수가 아닌 문자열 값들로 구성된 배열이 된다 변수가 사용된 순서대로 파라미터가 할당된다 => name === $..

Programming/Concept 2019. 4. 19. 16:17

Set으로 로또 추첨기 만들기 - Javascript ES6

set은 중복되지 않은 값을 가진 배열을 만들 때 좋다! let condition = { name : "LUCKY LOTTO!", count : 6, maxNumber : 45 } let {name, count, maxNumber} = condition; function getRandomNumber(maxNumber){ let set = new Set(); for(let i=0; i < count; i++){ set.add(Math.floor(Math.random() * maxNumber + 1)); } return set; }

Programming/Concept 2019. 4. 19. 15:36

WeakMap으로 class의 instance 변수 보호하기 - Javascript ES6

기존의 방법으로, 어떠한 height와 width가 주어졌을 때 area를 구하는 instance 생성 방법은 아래와 같다. //Area class 생성 function Area(height, width){ this.height = height; this.width = width; } //getArea instance 생성 Area.prototype.getArea = function(){ return this.height * this.width; } //적용 let myArea = new Area(30, 10); console.log(myArea.getArea()); // 300 console.log(myArea.height); // 30 WeakMap으로 외부 접근이 불가능하게 관리하는 instance..

Programming/Concept 2019. 4. 19. 15:13

Map 과 WeakMap - Javascript ES6

Map과 WeakMap은 Set과는 차이점이 있다. key와 value 구조 특정 객체의 부연 설명을 할 때 사용 가능 key에 적용한 객체에 null 할당 시 가비지 컬렉션으로 간주 WeakMap WeakMap의 key는 오직 Object type만! Primitive type은 허용되지 않는다.(Symbol도 WeakMap key가 될 수 없다) 객체 정보만 넣을수 있다. private 변수 만들기. 객체가 필요없어질 때에는 가비지컬렉션 대상이 됨. Set 사용으로 모자라면 map을 사용 함수의 호출 횟수를 세는 WeakMap 활용을 해 보자. let weakMap = new WeakMap(); let myFun = function(){}; //myFun 함수가 몇 번 실행 되었는지를 세 볼 것이다...

Programming/Concept 2019. 4. 19. 14:14

WeakSet으로 효과적인 객체 타입 저장 - Javascript ES6

*WeakSet은 * 참조를 가지고 있는 객체형태만 저장 가능하다. 저장된 객체가 더이상의 참조를 가지지 않을때는 가비지컬렉션의 대상이 된다. 객체 관련 된 것을 넣을때 weakSet을 사용 하면 좋다. 참조를 하지 않는 객체가 들어있다면 자동으로 없애준다. 객체의 형태만 따로 관리 해준다. 객체만 관리할 경우 weekSet을 사용하는 것이 좋다. //객체형태를 중복없이 저장하려 할 때 유용한 WeakSet let arr = [1, 2, 3, 4]; let arr2 = [5, 6, 7, 8]; let obj = {arr, arr2}; let ws = new WeakSet(); wa.add(arr); ws.add(arr2); ws.add(obj); arr = null; console.log(ws.has(a..

Programming/Concept 2019. 4. 19. 13:18

Set으로 유니크한 배열 생성하기 - Javascript ES6

Set을 이용하면 중복된 값을 제외한 배열 생성을 쉽게 할 수 있다. let mySet = new Set(); //class처럼 new Set()으로 지정해준다. mySet는 "Set"이라는 새로운 타입으로 정의된다. //.add를 통해서 mySet에 값을 넣을 수 있다. mySet.add("canon"); mySet.add("nikon"); mySet.add("canon"); mySet.forEach(function(value){ console.log(value); }) //"canon" "nikon" 두 개의 값만 나올 것이다. 중복된 값은 제외되었기 때문이다. //Set 타입에서 어떤 값을 가지고 있는지 확인하는 쉬운 방법은 .has console.log(mySet.has("canon"); // t..

Programming/Concept 2019. 4. 19. 12:09

Destructuring Object - Javascript ES6

Destructuring은 Object에서도 유용하게 사용할 수 있다. let obj = { name : "swoo", address : "Seoul", age : 29 } let {name:myName, age:myAge} = obj; console.log(myName, myAge); // "swoo", 29 . obj의 name과 age key의 value에 해당하는 것들이 myNmae과 myAge에 할당된다. 1) Destructuring을 활용한 JSON 파싱 Ajax 등을 통해서 받은 정보를 파싱하는 경우에도 활용할 수 있다. var channel = [ { "title" : "kbs", "number" : "7" }, { "title" : "mbc", "number" : "11" } ]; /*..

Programming/Concept 2019. 4. 19. 11:14

Destructuring Array - Javascript ES6

Array의 특정 인덱스의 값을 쉽게 지정해 줄 수 있다. //Destructuring let dat = ["a", "b", "c", "d"]; let [zero,,second] = data; console.log(zero, second); // "a" "c" 가 data의 0번째, 2번째 index의 값이므로 각각 zero, second에 대입되어 나올 것이다.

Programming/Concept 2019. 4. 19. 11:08

추가 정보

인기글

최신글

페이징

이전
1 ··· 4 5 6 7 8 9 10
다음
Phot_o_matic Programming © phot_o_matic
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바