자바스크립트
-
[JavaScript] 자바스크립트 전개 구문(spread syntax) 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 31. 00:05
전개 구문(Spread Syntax)란? 전개 구문(Spread Syntax)는 ECMAScript6(2015)에서 새로 추가된 문법으로 간단하게 이 문법은 문법 이름 그대로 객체 혹은 배열들을 펼칠 수 있게 해 준다. 문법 // 펼칠 대상이 객체인 경우 {...obj} // 펼칠 대상이 배열인 경우 [...arr] // 혹은 {...arr} 전개 구문의 문법 자체는 정말 간단하다. 그저 배열이나 객체 앞에 점 세 개를 붙여주면 된다. 단, 위 코드에서 확인할 수 있는 것처럼 펼쳐진 객체나 배열을 담을 바구니가 필요하다. 객체는 객체로, 배열은 객체나 배열로 담아낼 수 있다. 예시로 바로 살펴보자. [ 1. 펼칠 대상이 객체인 경우 ] const myObject1 = { laptop: 'MacBook P..
-
[Javascript] 자바스크립트 Object.values 메서드 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 27. 00:44
Object.values 메서드란? Obejct.values() 메서드는 메서드를 호출할 때 파라미터로 전달한 객체가 가지는 프로퍼티들의 프로퍼티 값들만 묶어서 배열로 반환해주는 메서드이다. Object.keys()와 거의 비슷하다고 볼 수 있다. 메서드 이름 따라 keys는 key들을 모아서 배열로, Object.values는 value들을 모아서 배열로 만들어 주는 메서드라고 생각하면 되겠다. 문법 Object.values(obj); Object.values 메서드의 기본 문법도 keys메서드와 동일하게 그냥 이름 그대로 Object 객체에 values 메서드를 호출하고 파라미터로 프로퍼티 값을 알아내고자 하는 객체를 전달해주면 된다. const myObject = { name: '싹쓰리', enNa..
-
[Javascript] 자바스크립트 Object.keys 메서드 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 26. 02:37
Object.keys() 메서드란? 객체를 만들다 보면 상황에 따라서는 객체의 key값만 가지고 오고 싶을 때도 있다. Object.keys() 메서드는 객체(typeof 연산자로 확인했을 때 object가 반환되는)의 프로퍼티들 중에서 key값, 다른 말로 프로퍼티 네임들만 묶어서 배열로 반환하는 메서드이다. 문법 Object.keys(obj); Object.keys 메서드의 기본 문법은 그냥 메서드 그대로 Object 객체에 keys 메서드를 호출하고 파라미터로 Key값을 알아내고자 하는 객체를 전달해주면 된다. const myObject = { name: '싹쓰리', enName: 'SSAK3', members: ['유두래곤', '린다G', '비룡'], genre: 'Dance & pop', age..
-
[JavaScript] 자바스크립트 for...of 반복문 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 24. 00:14
for.. of 반복문이란? for.. of 반복문은 일반적으로 배열에 많이 사용되는데, 배열의 요소 개수만큼 반복하고, 반복 때마다 각 요소들을 사용할 수 있는 변수가 주어지는 독특한 반복문이라고 할 수 있다. map메서드와 forEach메서드의 콜백 함수 내에 있는 element를 사용하는 것과 비슷하다고 생각하면 좋을 것 같다. 문법 for (변수 of 배열) { 반복동작부분 } 기본적으로 for 문과 비슷한 모양을 하고 있지만 소괄호 내부에 세미콜론으로 구분되는 구간이 없고, 변수 하나와 of 키워드, 그리고 반복 할 배열을 입력해주고, 매 반복 때마다 동작할 구문은 중괄호 안에 넣어주면 된다. 그래서 map이나 forEach의 콜백 함수 내에 있는 element 파라미터처럼, 소괄호 안에 선언한..
-
[JavaScript] 자바스크립트 forEach 메서드 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 22. 23:54
ForEach 메서드란? forEach() 메서드는 배열에 활용이 가능한 메서드로, 파라미터로 주어진 함수를 배열 요소 각각에 대해 실행하는 메서드이다. map() 메서드와 거의 비슷하지만 차이점은 따로 return 하는 값이 없다는 점이다. 문법 const myArr = [1, 2, 3, 4, 5]; const newMyArr = myArr.forEach((currentElement, index, array) => { console.log(`요소: ${currentElement}`); console.log(`index: ${index}`); console.log(array); }); console.log(newMyArr); // undefined forEach 메서드도 map메서드와 동일하게 파라미터로..
-
[JavaScript] 자바스크립트 map 메서드 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 22. 00:23
map 메서드란? map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환하는 메서드이다. for of 문이나 forEach처럼 배열 내 요소들을 반복하는 반복문의 한 종류인데, 조금 독특한 부분은 매 반복마다 return 되는 결과에 따라 새로운 배열을 만들어낸다는 것이다. 문법 const myArr = [1, 2, 3, 4, 5]; const newMyArr = myArr.map((currentElement, index, array) => { return currentElement * 2 }); console.log(newMyArr); // [2, 4, 6, 8, 10] map메서드는 파라미터로 콜백함수를 받는데, 그 콜백 함수의 파라미터는 요소, ..
-
[JavaScript] 자바스크립트 concat 메서드 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 20. 02:33
conat 메서드란? concat 메서드는 파라미터로 전달되는 값들을 기존 배열에 합쳐서 새로운 배열을 반환해주는 배열의 메서드들 중 하나이다. 한 가지 특별한 점은, 만약 파라미터로 전달되는 인자 값이 배열일 경우에는 해당 배열이 펼쳐지면서 기존 배열에 합쳐진다. 참고로, concat은 concatenation이라는 단어의 줄임말이라고 한다. 문법 concat 메서드는 배열에 사용되고, 파라미터로 어떤 값이든 전달할 수 있다. const myArr = [1, 2, 3]; // arr.concat(value1, value2, ...) console.log(myArr.concat(4, 5)); // [1, 2, 3, 4, 5] console.log(myArr.concat('육', '칠')); // [1, ..
-
[JavaScript] 자바스크립트 slice 메서드 이해하기프로그래밍 이야기/JavaScript 공부 2020. 7. 19. 00:41
slice 메서드란? slice 메서드는 배열의 일부 요소를 제거한 새로운 배열을 반환한다. 그래서 slice 메서드는 splice 메서드와 다르게 원래의(기존의) 배열 값을 수정하지 않는다. 다른 면에서 생각하면, 결과적으로 slice메서드는 부분 요소에 접근하는 것이라고 할 수 있다. 문법 slice는 시작 index와 마지막 index, 두 개의 파라미터를 가지고 있다. 첫 번째 파라미터로 들어가는 파라미터는 말 그대로 시작 index인데, 독특하게 음수 값이 들어갈 수도 있다. 그래서 만약 첫번째 파라미터로 음수 값이 전달될 경우 이 값에 배열의 길이를 더한 값을 시작 위치로 평가된다. 두 번째 파라미터는 마지막 index인데, 해당 값의 바로 직전까지의 요소를 잘라낸다. 여기서도 당연히 음수가 ..