Javascript

1. 조건문의 중첩

let age = 20
let gender = '남성'

if(age > 18) {
  console.log('성인입니다.')
  if( gender === '여성') {
    console.log('성인 여성입니다.')
  } else {
    console.log('성인 남성입니다.')
  }
} else {
  if(gender === '남성') {
    console.log('미성년 남성입니다.')
  } else {
    console.log('미성년 여성입니다.')
  }
  console.log('미성년자입니다.')
}

2. 조건부 실행

let x = 20;

• 기존의 수식
  if (x > 0) { console.log('양수입니다')
  
  
• 조건부 실행 수식
  x > 0 && console.log('양수입니다')
  
  
• or 조건(||)
• 삼항 연산자와 단축평가

let y; // y에는 undefined가 들어있다
let z = y || 20
console.log(z);//20

3.falsy한 값, truthy한 값

if(true 또는 false의 조건) { //main logic }

• 아래 예제가 모두 falsy한 값이다
  • 예1)

  if(0) {
      //main logic
      console.log('Hello')
    }

  • 예2)

  if('') {
    //main logic
    console.log('hello')
  }

  • 예3)

  if(null) {
    //main logic
    console.log('hello')
  }

  • 예4)

  if(undefined) {
    //main logic
    console.log('hello')
  }

  • 예5)

  if(NaN) {
    //main logic
    console.log('hello')
  }

  • 예6)

  f(false) {
    //main logic
    console.log('hello')
  }

• truthy한 값 예제

if(true) {
  //main logic
  console.log('hello')
}

4. 객체 : key - value pair, 하나의 변수에 여러개의 값을 넣을 수 있다.

4-1) 객체 생성 방법

• 기본적인 객체 생성 방법

let person = {
  name: '홍길동',
  age: 30, 
  gender: '여성',
  // key: 어떤 값도 올 수 있다(제한이 없다)
};

---

• 생성자 함수를 이용한 객체 생성 방법

function Person(name, age, gender) {
  this.name = name;//홍길동
  this.age = age;//30
  this.gender = gender;//여성
}

let person1 = new Person('홍길동', 30, '남자')
let person2 = new Person('금미자', 27, '여자')

4-2) 접근하는 방법

console.log(person.name)
console.log(person.age)
console.log(person.gender)

4-3) 객체 매소드 (객체가 가진 여러가지 기능 : Object.~~)

• object.key() : key를 가져오는 메소드

let person3 = {
  name: '김동수',
  age: 30,
  gender: '남'
}; 

let keys = Object.keys(person3)
  console.log('keys =>', keys)//keys => [ 'name', 'age', 'gender' ]

---

• values

  let values = Object.values(person3)
  console.log('values =>', values)//values => [ '김동수', 30, '남' ]
  

---

• entries : key(속성이름)와 value를 묶어서 배열로 만든 배열! (2차원 배열)

let entries = Object.entries(person3)
console.log('entries =>', entries)//entries => [ [ 'name', '김동수' ], [ 'age', 30 ], [ 'gender', '남' ] ]

key값에만 접근하고 싶으면, Object.keys()를 사용
value값에만 접근하고 싶으면, Object.values()를 사용

---

• assign : 객체 복사

let newPerson = {}
Object.assign(newPerson, person3)
console.log('newPerson =>', newPerson)//newPerson => { name: '김동수', age: 30, gender: '남' }

---

• 복사는 그래도 하고 싶지만 객체를 수정하고 싶을 때

let newPerson1 = {}
Object.assign(newPerson1, person3, {age: 40})
console.log('newPerson1 =>', newPerson1)//newPerson1 => { name: '김동수', age: 40, gender: '남' }

---

• 객체 비교 : 객체와 배열은 크기가 상당히 커, 메모리에 저장할 때 별도의 공간에 저장

// person4 별도 공간에 대한 주소에 저장
let person4 = {
  name: '길만복',
  age: 43,
  gender: '여'
};

// person5 별도 공간에 대한 주소에 저장
let person5 = {
  name: '길만복',
  age: 43,
  gender: '여'
};

console.log('answer =>', person4 === person5) // false(개체의 주소가 다르기 때문)
// 객체를 문자열화 시켜 비교하고 싶을 때(주소값 -> 문자열화)

console.log(JSON.stringify(person4) === JSON.stringify(person5))// true

---

• 객체 병합

let person6 = {
  age: 43,
  gender: '여'
};

// person5 별도 공간에 대한 주소에 저장
let person7 = {
  name: '길만복',

};
// ... : spread operator(스프레드 연산자)
let perfect = {
  ...person7, ...person6
}
console.log(perfect)//{ name: '길만복', age: 43, gender: '여' }

5. 배열

5-1) 생성

• 기본생성 : 순서가 중요 (0, 1, 2, 3,~ 으로 순번 시작)

let fruits = ['사과','바나나','오렌지']

• 크기 지정

let number = new Array(5);

console.log(number.length)//5

5-2) 요소 접근

console.log(fruits[0])//사과
console.log(fruits[1])//바나나
console.log(fruits[2])//오렌지

5-3) 배열 메소드

push(요소) -> 배열 끝 요소 추가

  let fruits1 = ['키위', '멜론', '무화과']
  console.log(fruits1)//[ '키위', '멜론', '무화과' ]

(push로 바나나 추가)
  fruits1.push('바나나')
  console.log(fruits1)//[ '키위', '멜론', '무화과', '바나나' ]

---

pop() -> 배열 끝 요소 제거

let fruits2 = ['키위', '멜론', '무화과']
console.log(fruits2)// '키위', '멜론', '무화과' ]

fruits2.pop()
console.log(fruits2)//무화과 제거

---

shift() -> 배열의 첫 번째 요소 제거

let fruits3 = ['키위', '멜론', '무화과']
  console.log(fruits3)//[ '키위', '멜론', '무화과' ]

  fruits3.shift()
  console.log(fruits3)//키위 제거

unshift() -> 배열의 처음에(맨 앞) 요소 추가

let fruits4 = ['키위', '멜론', '무화과']
  console.log(fruits4)//[ '키위', '멜론', '무화과' ]

  fruits4.unshift('토마토')
  console.log(fruits4)//[ '토마토', '키위', '멜론', '무화과' ]

splice() -> 임의의 위치에 요소 추가 제거

splice(시작하는 위치 번호, 지우는 요소 갯수,'추가할 요소',~ )

let fruits5 = ['키위', '멜론', '무화과']
    
  fruits5.splice(1, 2, '수박')// 두 번째 위치 시작, 2개 요소 삭제, '수박'추가
  fruits5F.splice(0, 3, '복숭아', '망고')// 0 번째 위치 시작, 3개 요소 삭제,'복숭아','망고'추가
    console.log(fruits5)//[ '키위', '수박' ]
    console.log(fruits5F)//[ '복숭아', '망고' ]

slice()

slice(시작하는 위치 번호, 추출하고자 하는 위치의 다음 번호)

let fruits6 = ['키위', '멜론', '무화과']

let sliceFruits1 = fruits6.slice(0,2)//키위부터 시작해 무화과 전까지 =>'키위','멜론'
let sliceFruits2 = fruits6.slice(1,2)//멜론부터 시작해 무화과 전까지 =>'멜론'
let sliceFruits3 = fruits6.slice(0,1)//키위부터 시작해 멜론 전까지 =>'키위'

console.log(sliceFruits1)//[ '키위', '멜론' ]
console.log(sliceFruits2)//[ '멜론' ]
console.log(sliceFruits3)//[ '키위' ]