[자바스크립트] repl-it 배운 내용이 뭐가 있더라🤔 part.2 배열(array), 데이터타입 등

Array

let cities= ["서울", "대전", "대구", "부산", "광주"]

대괄호로 감싸진 데이터의 묶음.
배열의 값 하나 하나는 Element(요소)라고 부른다.
배열의 요소는 순서(index)를 갖고 있어서 0부터 시작하는 순서를 가지고 특정한 요소를 가져올 수 있다.
cities[0] = "서울"

배열조작하기

빈 배열에 인덱스로 접근해서 요소를 추가할 수도 있다.
cities[6] = '제주도';

혹은 배열에서 사용할 수 있는 함수(메서드)를 이용해서 배열을 추가할 수 있다,
cities.push("전주") 배열의 맨 마지막에 새로운 요소 추가
cities.unshift("경주") 배열의 가장 처음에 새로운 요소 추가

for 문

코드를 원하는 만큼 반복시켜주는 구문.
for문에 언제부터 언제까지라고 알려주면 그만큼 반복을 할 수 있다.

for (반복 조건) {
 // 반복조건이 맞으면 실행할 코드 
}

let cities = ["서울", "대전", "대구", "대전", "광주", "대전"];

for (var i = 0; i < cities.length; i++) {
   if (cities[i] === home) {
     alert("아, 여기 사시는군요");
   }
}

배열의 최솟값을 구하는 예제

---

데이터 타입

자바스크립트의 6가지 데이터타입

undefined null boolean Number String 객체

typeof 연산자

변수의 데이터타입에 대해 알아볼 수 있는 연산자

typeof 연산자를 적용하면 다음 문자열 중 하나를 반환함

"undefined": 정의되지 않은 변수
"boolean"
"string"
"number"
"object": 함수를 제외한 객체 또는 "object"
"function"

다음과 같이 사용한다.

let msg = "message";
console.log(typeof msg); //string
console.log(typeof 100); //number

null의 경우 데이터타입이 object로 반환되는데, 그 이유는 빈 객체를 참조하고 있기 때문.
Array의 데이터타입 역시 object로 반환되는데, 그 이유는 배열 역시 알고보면 확장된 형식의 객체이기 때문이다.

undefined는 let, const, var 키워드를 이용해서 변수를 정의할때,
초기화하지 않으면 변수에 undefined가 할당된다.

let msg;
console.log(msg === undefined); //true

boolean
불리언 타입에는 true, false라는 두가지 값이 있다.
그런데, 데이터 타입이 boolean으로 변환되는 경우가 여러개 존재함.

true로 변환되는 값
문자열: 비어 있지 않은 문자열 보두
숫자: 0이 아닌 모든 숫자
객체: 모든 객체

false로 변환되는 값
문자열: "" (빈문자열)
숫자: 0, NaN
객체: null
undefined

그 외 number string object 는 생략

---

String

대소문자 바꾸기

Stirng.toUpperCase();
String.toLowerCase();

let lastName = 'Rimu Kim';
let upperLastName = lastName.toUpperCase();
//결과 RIMU KIM
let lowerLastName = lastName.toLowerCase();
//결과 rimu kim 

문자길이

String.length
참고로, 숫자 데이터타입에는 존재하지 않는 속성

문자열 찾기

String.indexOf()
특정 문자열이 들어있는지 확인하고, 있으면 몇번째 순서에 문자열이 있는지 알려준다. 없으면 -1을 반환함

문자열 자르기

String.slice(0, 자를위치의 index +1 )
특정 문자열을 잘라내서 반환한다.

문자열의 특정단어 제거하는 예제

---

String <-> Number 변환

자바스크립트에서 각각 다른 형식의 데이터타입간의 덧셈, 뺄셈을 하게 될때
컴퓨터가 행하는 방식이 다르다.

• String + String : String

• String - String : NaN 출력 (뺄셈은 숫자만 가능)

• String + Number : String으로 변환됨
  컴퓨터가 +를 보는 순간 한쪽이라도 String이 있으면 문자열로 합쳐준다.

• String - Number : Number로 변환됨
  문자열에서 -는 존재하지 않기 때문에 숫자로 변환해서 계산됨

  let birthYear = "2000";
  let currentYear = 2019;
  if (currentYear - birthYear < 14) {
   alert("가입할 수 없습니다.");
  }

  위의 코드가 제대로 돌아가긴 하지만 텍스트로 표현된 숫자는 꼭 숫자로 바꿔서 계산해야지 오해를 막을 수 있다.

문자열을 숫자로 전환하는 함수

Number("1.901")
parseInt("1.901")
parseFloat("1.901")

예제

국민연금을 받을 수 있는 나이가 만 65세까지일때, 주어진나이부터 몇년이 지나야 국민연금을 받을 수 있는지 리턴해주는 함수 만들기

function nationalPensionRemainingYearCount(age_string) {
  let age = Number(age_string)
  let pensonAge = 65 - age;
  return '앞으로 ' + pensonAge + '년 ' + '남으셨습니다' 
}

nationalPensionRemainingYearCount("20");
//결과: '앞으로 45년 남으셨습니다'

Number

수학에 관련된 메서드를 알아보자.
W3school

반올림함수

Math.round(2.76) //결과 3
Math.round(2.49) //결과 2

올림함수

Math.ceil(2.5) //결과 3

내림함수

Math.floor(2.5) //결과 2

랜덤 함수

Math.random();
0과 1사이의 랜덤한 숫자를 제공함

랜덤함수 활용하기

0~10 사이의 랜덤 숫자 만들기
Math.floor(Math.random() * 10)

최댓값과 최솟값을 받아 그 사이 랜덤수를 리턴하는 함수

function getRandomNumber(min, max) {
    let randomNumber = Math.floor((Math.random() * (max - min + 1)) + min);
    return randomNumber;
}
 
 
 getRandomNumber();

---

날짜와 시간

프론트엔드 개발을 할 때, 날짜와 시간을 다루는 경우가 많다.
(회원가입을 한 날짜와 시간, 글을 작성한 시간 등등...)

이를 쉽게 할 수 있게 도와주는게 날짜 객체이다.

let rightNow = new Date();
// Sat Apr 25 2020 17:18:10 GMT+0900 (대한민국 표준시)

그 외에 구체적인 년, 월, 일, 시간을 가져올 수 있는 함수

let year = rightNow.getFullYear();
let month = rightNow.getMonth()+1;
let date = rightNow.getDate();
let day = rightNow.getDay();
let currentHour = rightNow.getHours();
let currentMin = rightNow.getMinutes();

밀리초를 값으로 반환하는 getTime() 함수

let rightNow = new Date();
let time = rightNow.getTime();

특정 날짜에 대한 날짜,시간 데이터를 얻고싶다면
Date 객체에 매개변수로 특정날짜를 입력.

let date1 = new Date('December 17, 2019 03:24:00');
let date2 = new Date('2019-12-17T03:24:00');
let date3 = new Date(2019, 5, 1);

만 나이 구하는 예제 풀어보기

getWesternAge 함수를 구현해주세요.
getWesternAge 함수는 birthday 라는 인자(input)를 받습니다.
birthday는 Date 객체이며 생일을 나타냅니다.
현재 기준으로 해당 생일이 만으로 몇살인지 계산 후 리턴해주세요.

function getWesternAge(birthday){

const rightNow = new Date();
//현재시간함수
const now_year = rightNow.getFullYear();
const now_month = rightNow.getMonth()+1;
const now_date = rightNow.getDate();

const myBirthday = new Date(birthday)
const birth_year = myBirthday.getFullYear();
const birth_month = myBirthday.getMonth()+1;
const birth_date = myBirthday.getDate();

const korean_age =  (now_year - birth_year) + 1 ; 


let western_age;


if (birth_month < now_month) {
  //생일이 지났다면 
  western_age = korean_age -1;

} else if (birth_month > now_month) {
  //생일이 안지났다면 
  western_age = korean_age -2; 

} else if (birth_month === now_month) {
  // 생일과 현재달이 같다면 일을 비교하기 
  if (birth_date > now_date) {
    // 생일이 곧 다가오고 있음 
    western_age = korean_age -2;

  } else {
    // 생일이 얼마전에 지났거나 생일날임.
    western_age = korean_age - 1 ; 

  }
 }
 
return western_age
 

}

getWesternAge('1990-03-21T00:45:06.562Z');