강좌
2-22 / 2-23 / 2-24 / 2-25 / 2-26

---

배열

const target = ['가','나','다','라','마'];

---

1)마지막 요소 제거하기

• target.pop();
  • 마지막 요소 추가하기
    • fruits.push('키위');

---

2)첫번째 요소 제거하기

• target.shift();
  • 첫번째 요소 추가하기
    • fruits.unshift('귤');

---

3)중간 요소 제거하기

• target.splice(1,2);
  • 1번째 요소부터 2개 지움 -> '나','다' 제거
    • const target = ['가','라','마'];
• target.splice(1);
  • 1번째 요소부터 끝까지 지움 -> '나','다','라','마' 제거
    • const target = ['가'];
• target.splice(1,3,'타','파');
  • 1번째 요소부터 3개 지움 -> '타','파'추가한다.
  • const target = ['가','타','파','마'];

---

4)splice()를 이용한 요소 추가방법

• target.splice(1,0,'카');
  • ['가', '카', '나', '다', '라', '마']
  • '나'를 지정하고, 제거안하고, '카'를 추가하면, '나'앞에 배치된다.

---

5)배열에 특정 요소가 있는지 확인하는 방법

• const result1 = target.includes('다');
• console.log(result1);
  • 배열에 '다' 있으면 result1에 true가 들어감 -> console.log로 결과 확인한다.

---

6)배열에 특정 요소가 어디에 있는지 확인하는 방법

• const arr = ['가','나','다','라','마']
• const result1 = arr.indexOf('다');
  • 변수 result1에 '다' 몇번째인지 알 수 있도록 숫자가 저장된다
• const result1 = arr.lastIndexOf('라');
  • 변수 result1에 '라' 몇번째인지 알 수 있도록 숫자가 저장된다
• const result1 = arr.indexOf('카');
  • '카' 요소가 배열에 없으므로 변수 result1에는 -1이 담긴다.

---

7)반복문을 이용하여 배열의 요소 출력하기

const arr=['가','나','다','라','마'];
let i=0;
while(i<arr.length){
   console.log(arr[i]);
   i++;
}

---

8)반복문을 이용하여 문자열을 끊어서 출력하기

const arr='가나다라마';
let i=0;
while(i<arr.length){
   console.log(arr[i]);
   i++;
}

---

9)splice() 와 indexOf()를 이용하여, 중복 요소인 '라' 제거하기

• 사고 방식
  • 프로그래밍 사고의 핵심 -> 행위를 끊어라
  • 찾는다 -> 지운다 -> 행위가 끝났는지 확인한다.

const arr=['가','라','다','라','마','라'];
let i = 0;
while(i<5){
  const result1= arr.indexOf('라');
  if(result1===-1){
    break;
  }
  arr.splice(result1,1)
  i++;
}
console.log(i);

• 피드백
  • 반복문의 변수를 무조건 i라 생각
    • 반드시 반복문 조건문에 i변수를 넣는 것이 아니다. 어떻게 반복 행위를 멈추게 하는 요인이 무엇인지 생각해라
    • 제로초님은 반복을 멈추게 하는 요인인 arr.indexOf('라');을 반복문 조건에 넣었음
  • 값을 받고, 또 받아야하는 변수에 const로 선언을 했음
    • const는 변수의 값을 다시 바꿀 수 없기 때문에, 값이 변하지 않는 변수를 선언 할 때만 사용해야한다.

const arr=['가','라','다','라','마','라'];
while(arr.indexOf('라')>0){
  arr.splice(arr.indexOf('라'),1)
}

---

10)제로초님의 숙제

// 1번코드
const arr=['가','라','다','라','마','라'];
let index = arr.indexOf('라');
while(index>-1){
  arr.splice(index,1);
  index = arr.indexOf('라');
}

// 2번코드
const arr=['가','라','다','라','마','라'];
let index = arr.indexOf('라');
while(index>-1){
  arr.splice(index,1);
}

• 1번과 2번에는 while반복문 안에 index = arr.indexOf('라'); 코드 한 줄의 유무차이이다.
  왜 이런 차이에 따라 결과가 달라지는가? 알아내기
  • 반복문 안에 index = arr.indexOf('라');을 안넣어주면, 반복문 밖에서 index에 넣은 1이 계속 유지되어서 배열의 첫번째 요소만 지우는 상황이 나온다.

---

함수

---

11) 함수 만들기

• function a() {}
  • 함수 선언문
• const b = function() {};
  • 함수 표현식
• const c = () => {};
  • 화살표 함수
  • 사용
    • c();

---

12) 함수 사용하기

• function함수

function a() {
  console.log("hello");
}
a(); //함수 사용하기

---

13) 함수의 return

function b() {
  return '반환값';
  console.log("hello");
}

• b(); -> '반환값'만 출력된다.
• return의 기능
  • 결과값을 출력하고, 함수를 종료시킨다.
  • return의 밑에 있는 문장들은 실행시킬 수 없다.
• 함수 내부의 마지막에는 return undefined가 생략되어있다.

---

14) 함수 & 조건문

function c() {
  if(조건문){
    return;
  }
  console.log("hello");
}

• 필요에 따라 if의 조건을 만족하면 함수를 종료시킨다.
• 특정 조건에 따라 다른 결괏값을 출력시키는 함수를 만들 수 있다.

---

15) 함수에서 여러 개의 값을 return하고 싶을 때,

function d() {
  return [1,2];
}

• return 1,2;
  • 2만 출력된다.

---

16) 함수의 매개변수와 인수

개념

function e(parameter) {
  console.log(parameter);
}

e('hello');

• parameter -> 매개변수
  • 변수 선언문 하지마라 -> 오류 뜬다.
    • (int x, y) 이렇게 하지마
• 'hello' -> 인수
• 함수를 사용할 때, 인수가 매개변수에 저장되고, 함수가 실행된다.

• 매개변수는 여래 개 둘 수 있다.

function f(x,y,z,w) {
  console.log(x,y,z,w);
  console.log(arguments);
}

f('치킨','피자','햄버거');

• 매개변수 w에는 값을 넣지 않았음 -> 기본값인 undefined 출력된다.

f('치킨','피자','햄버거','돈까스','스시');

• '스시'는 매개변수에 대입이 불가능하므로, 무시된다.
• arguments 화살표 함수에서는 못쓰는 기능이다. function함수에서만 쓸 수 있다.
  • console.log(arguments); -> 인수들을 배열형태로 보여준다.

---

17) 화살표 함수 사용방법

• 화살표 함수

const f = (x, y, z) => {
  return x * y * z
}
f(2,3,4); //함수 사용하기

• 중괄호와 return이 바로 이어질 경우, 둘다 생략 가능

const f = (x, y, z) => x * y * z
f(2,3,4); //함수 사용하기

---

객체 리터럴

---

18) 객체 리터럴

const zeroCho = {
  year: 1995,
  month: 8,
  date: 12,
  gender: 'M',
};

• year: 1995,
  • 이름 옆에는 :
  • 값 옆에는,
• 이름에 ''(따옴표)붙여야 하는 경우
  • '2year': 1995,
    • 이름 앞에 숫자가 있을 때,
  • '2-year': 1995,
    • 이름에 특수문자 있을 때,
  • '2 year': 1995,
    • 이름에 띄어쓰기 있을 때,

---

19) 배열과 객체 리터럴의 차이

• 배열 : 정보들을 묶어놓기만 하면 된다.
• 객체 리터릴 : 정보들을 묶어놓고, 각 정보들에게 이름을 부여했다.

---

20) 객체 리터럴 이용하는 방법

• zeroCho.year;
• zeroCho['year'];
  • 네모괄호 쓸 때는 반드시 이름에 따옴표를 씌워라
  • 이름에 문자열로(따옴표) 감싼 것들은 네모괄호로 이용해야 한다. 아니면 에러뜬다.

---

21) 객체 리터럴 수정하거나 추가하기

• zeroCho.이름 = 값;
• 수정과 추가 방법이 같다.
  • zeroCho.job='개발자';

---

22) 객체 리터럴 제거하는 방법

• delete zeroCho.gender

---

23) 함수와 배열이 객체인 이유

function g() {}
g.a='hello';
const arr = [];
arr.b='happy';
console.log(g.a);
console.log(arr.b);

• 함수와 배열에 객체 리터럴 추가가 가능하다.
  • 객체안에 함수, 배열, 객체리터럴 세가지가 있는 것이다.

---

24) 메서드

• 메서드란? 객체 리터럴안에 있는 함수이다.

const debug = {
  log: function(value){
    console.log(value);
  },
}
debug.log("happy");