20200917 TIL Javascript3

ToastEggsToast·2020년 9월 18일
0

We!

목록 보기
19/33
post-thumbnail

Javascript

Math Object

Math.random

0 이상 1미만의 실수들 중 하나를 랜덤하게 리턴해준다.

 console.log(Math.random());

응용해서 로또 생성기를 만들거나, 숫자 야구 등을 만들 수 있고
불규칙적으로 움직임을 생성하는 경우에도 만들 수 있을 것 같다 :)

Math.round

Math.round에 넘겨진 값의 가장 가까운 값을 리턴해준다.
반올림 해주는 함수

console.log(Math.round(4.4));   // 4
console.log(Math.round(4.6));   // 5

Math.ceil

받은 수의 가장 가까운 높은 수를 리턴해준다.
올림 해주는 함수.

console.log(Math.ceil(4.2)); // 5
console.log(Math.ceil(4.6)); // 5

Math.floor

받은 수의 가장 가까운 낮은 수를 리턴해준다.
내림 해주는 함수.

console.log(Math.floor(4.2));  // 4 
console.log(Math.floor(4.6));  // 4

string과 관련된 함수

startsWith

객체로 받아진 문자, 또는 문장이 매개변수의 인자로 받은 값으로 시작하는지 체크해주는 메소드이다. 리턴값은 bool형이다.

let sentence = "Hello Wecode!";
let word = "Wecode";

console.log(sentence.startsWith("Hello"));  // true
console.log(word.startsWith("We"));  // true

console.log(sentence.startsWith("Wecode!"));  // false
console.log(word.startsWith("code")); // false

endsWith

startsWith와는 반대로 문자 또는 문장이 인자로 받은 값으로 끝나는지 체크해주는 메소드이다. 리턴값은 마찬가지로 bool형이다.

let sentence = "Hello Wecode!";
let word = "Wecode";

console.log(sentence.endsWith("Hello"));  // false
console.log(word.endsWith("We"));  // false

let sentence = "Hello Wecode!";
let word = "Wecode";

console.log(sentence.endsWith("Wecode!"));  // true
console.log(word.endsWith("de"));  // true

substring

String.substring(a,b); 형태로 작성되며 a번째부터 시작해 b번째 직전까지의 문자열을 반환해준다. blank가 포함되고, b,a가 되어도 자동으로 swap되어 인식해준다.

let sentence = "Hello Wecode!";

sentence.substring(0,5)  // 'Hello'
sentence.substring(5,0)  // 'Hello'

개별

이전에

2. formatDate 함수에 날짜가 담긴 배열을 전달드립니다.
날짜의 data type은 string이며, 
보내는 날짜 타입은 'YYYY-MM-DD' 입니다.

해당 날짜의 형식을 'YYYY년 MM월 DD일' 로 바꿔서
새로운 배열을 return 해주세요.

위와 같은 문제를 받아서 처음에는

const formatDate = dates => {
  let newFormDates = dates.map(form);

  function form(date){
    return `${date.substring(0,4)}년 ${date.substring(5,7)}월 ${date.substring(8,date.length)}일`
  }
  
  return newFormDates;
}

이렇게 풀이법을 작성했었다.
다른 동기님이 map에 대해 어려워하셔서 설명을 도와드리는 과정에서 'split'을 사용할 수 있다는 것을 깨닳았고, split은 쪼개진 문자열을 "배열"로 리턴해준다는 점이 떠올라 새로운 풀이법을 작성해보았다.

const formatDate = dates => {
  let newFormDates = dates.map(date=>{
    let [year,month,day] = date.split("-");
    return `${year}년 ${month}월 ${day}일`
  });

코드가 조금 더 간결해지고, 보기도 편했다.
우선 map 함수 안에 function을 함께 넣음으로써 코드를 줄이고,
split을 통해 들어오는 배열의 문자를 - 단위로 쪼갠다.
쪼개진 단어는 각각 순서대로 year, month, day라는 변수에 담기게 되고,
변수들을 백틱을 사용하는 Template literals 형식으로 리턴값을 작성 마무리하였다 :)

순서대로 변수에 담는 방법은 이전에 리액트를 학습 할 때,
스터디 선생님께서 자주 사용해주셨던 방법이었다.
처음 해당 방법을 봤을 때 충격도 크고 저걸 어떻게 써..! 라고 생각했었는데
막상 사용해보니 정말 별거 없더라ㅋㅋㅋㅋㅋㅋ
앞으로는 좀 더 자신감과 용기를 가져보기로 :)

profile
개발하는 반숙계란 / 하고싶은 공부를 합니다. 목적은 흥미입니다.

0개의 댓글