[JavaScript & TypeScript] - 참조와 복사, 조건문, 반복문

Parkboss·2022년 5월 13일
1

JavaScript / TypeScript

목록 보기
2/8
post-thumbnail

1.참조와 복사

let a = 10;
let b = a;
    b = 20;
   
(출력)
a:10
b:20

1. 10이 a에 들어가고 나서 a를 b로 옮길 때 즉, a에 들어있는 10이라는 값을 b로 옮길 때 10값이 복사된다.
2. b의 값을 바꾼다 하더라도 a에 10이 들어가 있는 것에 전혀 영향을 미치지 않는다.
이것이 값의 복사이다.


let 0 = {
  isLoading: false,
};

let 02 = 0;

02.isLoading = true;

(출력)
0 = {isLoading: ture}
02 ={isLoading: true}

1. let 0에 객체를 만들고 02로 옮길 때, 기본형처럼 값이 복사되는 것이 아니라 02는 실제 이 객체가 저장되어 있는 위치 값만 저장되게 되어있다.
2. 0,02는 실제로 같은 객체의 위치를 가리킨다.
3. 02 원본 객체의 속성을 뜻하는 거고, 정확하게 읽어보면 변수 02가 가리키고 있는 객체의 속성 isLoading을 true로 바꾼다는 뜻이다.
4. 0도 같은 값을 가리키니 동시에 2개의 값이 변화가 일어난다. 객체의 값은 참조된다.


let 0 ={
  isLoading: false,
};

function foo(0) {
o.isLoading = true;
}

foo(0);

(출력)
0: {isLoading: true}

1. 참조 메커니즘이 동일하게 작동한다.
2. 객체인 경우에는 참조가 일어난다는 걸 꼭 알아야 한다!!!!!!!!


2.조건문

1.if문

let age = 40;

if(age){
  console.log('나이 10살')
}

1. 단순히 값을 true, false, boolean 타입으로 변환해서 판정을 하게끔 되어있다.
2. 기본적으로 형 변환, 타입캐스트 룰에 의해서 0은 거짓으로 판단하고 그 외 나머지 모든 숫자는 참으로 판정한다.
3. 문자열로 들어가게 되면 if('hey') 문자열은 모두 참으로 판정한다.
4. if(' ') 문자열이 비어 있으면 거짓으로 판정한다.
5. if({ }) 모든 객체는 참으로 판정을 한다. 안에 값이 비어있든 속성이 비어있든 간에 상관없다.


2.switch문

let age = 40;

switch(age) {
   case 1:
      console.log(1);
   case 2:
      console.log(2);
   case 3:
      console.log(3);
   default;
      console.log('??');
      break;
}
(출력)
??

1. switch가 case와 일치하는지 확인을 한다.
2. age 1도 아니고 2,3도 아니니깐 default에 걸려서 ??가 출력된 것이다.

let age = 1;

switch(age) {
   case 1:
      console.log(1);
   case 2:
      console.log(2);
   case 3:
      console.log(3);
   default;
      console.log('??');
      break;
}

(출력)
1
2
3
??

1. 모든 값이 출력된 이유는? 일치하는 케이스까지 이동한 다음에 그 밑의 코드를 실행한다.
2. break 만날 때까지 실행한다. 그래서 반드시 switch문의 case 코드 중단점을 브레이크로 명확하게 설정해야 된다.

let age = 1;

switch(age) {
   case 1:
      console.log(1);
      break
   case 2:
      console.log(2);
      break
   case 3:
      console.log(3);
      break
   default;
      console.log('??');
      break;
}

(출력)
1

1. case문은 전형적으로 어떤 값을 계속 비교하면서 그 값의 유형이 일치하는지 확인할 때 사용한다.


3.반복문

1. for문

const arr = ['a', 'b', 'c', 'd'];

for(let i =0; i < arr.length; i++){
  console.log(arr[i]);
}

(출력)
'a','b','c','d' x4을 반복한다.

2. while문

let i = 0; -> for문에서 선언된 i의 변수는 for문을 빠져나오면 사라진다.

while( i < arr.length ){
console.log(arr[i]);
i++;
}

3.do while문

i = 0; 

do{
  console.log(arr[i]);
  i++;
} while( i < arr.length )

1. while문은 반복을 시작하기 전에 비교한다. 반면 do while 일단 코드를 실행하고 난 다음에 비교를 한다.
반드시 한 번은 실행해야 되는 반복이 있다면 do while 그렇지 않으면 while을 쓴다.
하지만 do while은 많이 쓰지 않는다.


4. for of문

for(const item of arr) { 
-> const 상수를 쓴 이유는? 변수를 바꾸지 않고 읽기만 한다면 보통 상수로 많이 쓰인다.
  console.log(item);
}

(출력)
'a','b','c','d' x4을 반복한다.

1. i라는 변수가 등장하지 않는다. 왜냐하면 for of라고 하는 문 자체가 배열에서 반복할 때마다 item 하나를 처음부터 끝까지 하나씩 꺼내서 item이라는 새로운 변수에 넣어준다.
2. for of문은 배열을 순회할 때, 처음부터 끝까지 한 번씩 읽으면서 순회할 때, 배열의 특정 위치에 관심이 없는 상황에서 쓰기 편하다.


5. for in문

for(const index in arr){
  console.log(arr[index]);
}

1. for of가 arr에 있는 item을 처음부터 하나씩 꺼내와서 item에 넣어주고 반복을 돌린다고 하는 것과 달리 for in은 arr에 있는 키, 값 즉, 위치 값을 넘겨준다.
2. for in은 배열을 순회하는 용도로 사용하기에 적합하지 않다.
실제 오른쪽이 배열이든 객체든 그 키의 값을 하나씩 꺼내올 때 많이 쓰게 되는 반복문이다.

const obj = {
   color:'red',
   width:200,
   height:300,
};

for (const key in obj) {
  console.log(key);
}
 (출력)
 'color', 'width', 'height' 
 
여기서!

for (const key in obj) {
  console.log(obj[key]);
}

(출력)
 'red', '200', '300' 


금요일니깐!!!!!!

profile
ur gonna figure it out. just like always have.

0개의 댓글