spread operator(...)copy목적으로 씁니다.length를 갖고 있는, 즉 순회를 할 수 있는 대상들(배열, 문자열)에 적용가능합니다. 12345678const defaultColors = ['red', 'green'];const userFavoriteColors =['yellow', &
rest parameter(나머지 파라미터 ...)일정하지 않은 갯수의 파라미터를 넘길 때 유용합니다. 1234567function addNum(...numbers) { return numbers.reduce((sum, number) => { return sum + number; }, 0);}addNum(
반복자 함수 2. find, every, some, reduce (추후 추가)목차find 메소드 find 메소드콜백함수가 요구하는 조건을 만족하는 첫번째 값을 하나 반환합니다. 없으면 undefined를 반환합니다. 1arr.find(callback[, thisArg]) 예: 특정 프로퍼티, 값을 가지는 첫번재 객체를 찾는 함수를 완성해보세요.주어진 문제
반복자 함수 1. forEach, map, filter목차forEach 메소드map 메소드filter 메소드 forEach 메소드배열의 각 요소에 대해 한번씩 순서대로 콜백함수를 실행합니다. 1arr.forEach(callback[, thisArg]) callback 함수 : 배열의 각 요소에 대해 실행할 함수로 다음 세 가지 인수를 가집니다.1) cur
이번주에 우리 스터디모임에서 나눈 주제는 크로스브라우징, JS ES6 - Arrow Function, 원시데이터와 참조데이터였습니다.Arrow Function에 대해서는 제가 발표자였는데, JavaScript의 this에 대해 좀 더 자세하게 다뤄야할 필요성이 느껴지더라고요. 잘 알고있다고 생각했는데 클래스, 인스턴스, 메소드 등의 this에 대해서 정
Class 클래스자바스크립트 ES5 문법으로 class를 만들기 위해서 prototype 상속을 이용하는 방법을 사용하였습니다. 해당 포스팅 바로가기ES6 문법에서는 class 문법을 지원함으로서 이를 좀 더 쉽게 만들게 해줍니다. ES5 와 ES6 비교1_ ES5123456789101112131415// Person 클래스. 생성자 함수var Perso
캡슐화 (encapsulation)객체의 중요한 프로퍼티(데이터)와 메소드(기능)를 외부에서 접근하지 못하게 하는 작업을 말합니다. 일반적으로 객체 내부의 프로퍼티, 메소드는 1)객체 내부, 2)객체 외부, 3)자식 객체에서 접근해 사용합니다. ES5 소스 예시1234567891011121314151617181920// MyParent 클래스functio
추상화 (abstraction)객체의 프로퍼티와 메소드를 정의 하는 작업으로, 이름을 작성하는 선언 부분만 만들 뿐 구현부분은 작업하지 않습니다. 자바스크립트에서는 인터페이스와 추상클래스를 제공하지 않기 때문에 클래스만을 이용해서 추상화 작업을 해야합니다. 예: 이미지 슬라이더 추상화 하기 ImgSlider 프로퍼티 현재 선택된 이미지 인덱스
설연휴로 인해 2주만에 만난 스터디모임 ^^ 알차고 재밋었던 시간이었습니다~이번엔 이벤트 버블링, 이벤트 객체, 이벤트 위임, ES6, 알고리즘 등을 나눴는데,그 중 이벤트에 대해 포스팅해보려합니다. 이벤트 버블링 (Event Bubbling)이벤트 버블링이란 자식노드에서 부모노드 순으로 이벤트가 전파되는 것으로, 반대방향으로 전파되는 것은 캡쳐링이라
Template StringsES5에서 문자열을 변수, 함수와 함께 쓰고자 할 때 +기호를 씁니다.12345678910let firstName = 'John';let lastName = 'Smith';const yearOfBirth = 1990;function calcAge(year) { return 2017
Blocks and IIFEsES5 이하에서는 var 변수 선언을 하면 전역변수가 되기 때문에 전역을 오염시키지 않기 위해 IIFE패턴을 썼습니다.1234// ES5(function(){ var a = 5;})(); 그러나 ES6에서 제공하는 let, const 선언은 지역변수이므로, 블록으로 묶어주기만 하면 IIFE패턴을 쓰지 않고도
스터디 모임 때 객체지향 프로그래밍의 개념에 대해 이야기를 나누었습니다.진행할 프로젝트에서 객체지향으로 짜보고 싶어 좀 더 깊게 공부해보려합니다. 객체지향 프로그래밍(Object-Oriented Programming)절차지향 프로그래밍과 비교해 보자절차지향은 문제를 순차적으로 호출해 처리하는 방식으로, 함수 단위 코딩을 하는 경우가 대표적인 예입니다.