강의 | Chap 18 JS 데이터

#2. 숫자와 수학

1. 숫자

알아둘 종류

  • 변수.toFixed(a) 대상 변수의 a번째(포함) 소숫점 자리까지 남기고 나머지는 버림.
    - 예: const num1= 8.439804589 를 num1.toFixed(3)하여 console.log 한다면 8.439가 출력됨.
    • 주의할 점은 위 8.439는 typeof로 확인해보면 string이 되어있을 것이다. 이럴 경우 parseInt를 사용하면 된다.
  • parseInt(변수이름) 문자데이터로 출력되는 숫자여야할 데이터를 숫자로 만듦.
    - 형식: const integer = parseInt(str)

추가 전역(global)함수 :

setTimeout, setInterval, clearTimeout, clearInterval

2. 수학

. 앞에 변수 대신 Math를 붙인다.

알아둘 종류

  • Math.abs(a) a 의 절대값을 반환함.
  • Math.min(a,b) 인수들 (a,b) 중 가장 작은 숫자를 반환함.
  • Math.max(a,b) 인수들 (a,b) 중 가장 큰 숫자를 반환함.
  • Math.ceil(a) 인수 a를 올림함.
  • Math.floor(a) 인수 a를 내림함.
  • Math.round(a) 인수 a를 반올림함.
  • Math.random() 0과 1 사이의 무작위 숫자(난수) 하나를 반환함.
    예시:
export default function random() { // random 함수에 대한 내용을 다른 파일로 넘겨라.
    return Math.floor(Math.random) * 10 // 추출한 난수를 내림하고 10을 곱한 값을 반환해라.
}

#3. 배열(1)

zero-based numbering

  • 배열array 데이터 내 요소element들의 n번째 숫자를 0번째부터 item을 셈.
  • 이 n번째 숫자를 index라고 부름.
  • index를 fruits[2]처럼 대괄호 안에 넣어 조회하는 것을 indexing이라고 함.
  • 참고: 배열 내 테이터들은 요소element 말고 item라고도 부를 수 있다.

알아둘 종류

  • 배열이름.find(element => element > n)
    지정 배열 내 요소들 중 (예시로) n보다 값이 큰 요소가 있는지 찾는다.
    있을 경우 위 기준을 만족하는 첫 번째 요소의 값을 반환하며, 없을 경우 undefined를 반환.
  • 배열이름.length
    지정 배열의 길이를 반환한다.
    빈 배열[] 말고는 1부터 시작. (공백도 문자니까 길이는 1)
    배열이름 대신 배열 리터럴에도 직접적으로 .length 사용 가능함.
    예시: [1,2,3,4,5,9].length // 6
  • 배열이름1.concat(배열이름2)
    2가지 배열을 합쳐서 반환한다. (서로 다른 데이터 종류의 배열이라도 합치기가 가능.)
    원본 데이터 손상 x
  • 배열이름.forEach()
    배열 데이터 내 아이템 갯수만큼 forEach 함수를 실행한다.
    아래 참고. element, index, array의 자리는 고정되어 있는 점 유의.
    팁 1. 매개변수의 이름은 잘 이해할 수 있는 것으로 쓰는 것이 좋음.
    (가령 element 대신 fruit. 저 자리는 각 item/element의 자리이기 때문에)
    팁 2. function 내 매개변수 array는 잘 쓰지 않음. (생략 가능)
    팁 3. index는 줄여서 i 라고 쓰면 됨.

    '참조'는 JS 데이터 불변성 시간에 더 자세히 다룰 예정.

복습. 화살표 함수 쓰기

아래는 화살표 함수를 사용했을 때 바뀌는 형식.

const b = fruits.map((fruit, index) => ({ //3 . 객체 데이터라 붙는 {} 양 옆에 () 필요함
  // 1. 중괄호`{` 를 return과 함께 생략(중간 추가 로직 없음)
  // 2. 화살표 함수로 바꾸기 :
  // function 키워드 생략, 매개변수의 () 생략 : 불가(2개), 매개변수 뒤에 => 쓰기
  // `this`를 쓰지 않아서 일반/화살표 여부 중요치 않으나, 단축해서 쓸 수 있음.
  // 1. return (중략제외) } : 위의 중괄호`{`와 함께 생략(중간 추가 로직 없음)
  id: index,
  name: fruit
})) //3 . 객체 데이터라 붙는 {} 양 옆에 () 필요함
profile
프론트엔드 개발 입문자입니다. 오타, 틀린 내용 피드백 환영합니다.

0개의 댓글