본문 바로가기
Elice SW 2/TIL

DAY 13 - TIL

by 자이구 2022. 4. 22.

점 표기법과 괄호 표기법

자바스크립트에서 객체 내부 프로퍼티에 접근하는 방법엔 점 표기법 / 괄호 표기법 존재

let likelion = {
    number: '9th',
    member: 21,
    univ: "pnu"
}

// 점 표기법
likelion.number // 9th
likelion.member // 21

// 괄호 표기법
likelion['univ'] // 'pnu'

점 표기법의 한계

let likelion = {
    number: '9th',
    member: 21,
    univ: "pnu"
}
const changeProperty = (object, property, changingValue) => {
    object.property = changingValue
}

changeProperty(likelion, member, 300) // Uncaught ReferenceError: member is not defined

 

괄호 표기법으로 극복

let likelion = {
    number: '9th',
    member: 21,
    univ: "pnu"
}
const changeProperty = (object, property, changingValue) => {
    object[property] = changingValue
}

changeProperty(likelion, "member", 300) 
console.log(likelion)

 

참고 자료 : https://junior-datalist.tistory.com/157

 

filter()

filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환

const words = ['나', '는', '야', '멋쟁이', '개발자'];

const result = words.filter(word => word.length > 2);

console.log(result);
// expected output: Array ["멋쟁이", "개발자"]

 

Spread 연산자

...

Spread 연산자는 연산자의 대상 배열 또는 이터러블(iterable)을 "개별" 요소로 분리해줍니다.

// 배열
console.log(...[1, 2, 3]); // -> 1, 2, 3
 
// 문자열
console.log(...'jaeku');  // j a e k u 
 
// Map과 Set
console.log(...new Map([['a', '1'], ['b', '2']]));  // [ 'a', '1' ] [ 'b', '2' ]
console.log(...new Set([1, 2, 3]));  // 1 2 3

Rest Parameter

Rest Parameter는 위의 Spread 연산자를 사용하여 함수의 parameter로 오는 값들을 배열로 전달받습니다. 사용 방법은 파라미터 앞에 (...)을 붙이면 됩니다.

function logger(...rest) {
  console.log(rest); // [ 1, 2, 3, 4, 5 ]
}

logger(1, 2, 3, 4, 5);

유의점:

  • function foo(param1, param2, ...rest) 처럼 앞에 파라미터는 일반적인 파라미터로 받을 수 있고 그 뒤부터는 Rest 파라미터로 받을 수 있습니다.
  • 다만, Rest파라미터는 항상 제일 마지막 파라미터로 있어야 합니다 예를들어 function foo(...rest, param1, param2){~}는 사용할 수 없습니다.

구조 분해 할당

객체나 배열을 변수로 분해할 수 있게 해주는 특별한 문법

// 이름과 성을 요소로 가진 배열
let arr = ["jaeku", "Kwon"]

// 구조 분해 할당을 이용해
// firstName엔 arr[0]을
// surname엔 arr[1]을 할당하였습니다.
let [firstName, surname] = arr;

alert(firstName); // Bora
alert(surname);  // Lee

 

split()

split() 메서드는 받은 문자열을 인수에 있는 문자열로 나눠서 배열로 만듭니다.

let str = '나는 감자다.';
console.log(str.split(' '));
// ['나는' '감자다.']

 

join()

join() 메서드는 배열의 값 사이에 인자값을 넣은 문자열을 만들어 줍니다.

let str = '나는 감자다.';
console.log(str.split(' ').join(' 맛있는 '));

 

every()

join() 메서드는 배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트합니다. Boolean 값을 반환합니다.

const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// expected output: true

 

'Elice SW 2 > TIL' 카테고리의 다른 글

DAY 15 - TIL  (0) 2022.04.26
DAY 14 - TIL  (0) 2022.04.25
DAY 12 - TIL  (0) 2022.04.21
DAY 11 - TIL  (0) 2022.04.19
DAY 9 - TIL  (0) 2022.04.17

댓글