Web 7 : nodejs(2)

2024-08-09 FRI

실습

3. ch_3.js - 형변환

1. 묵시적 형변환(타입 캐스팅)

• 자바스크립트 엔진이 자동으로 형변환하는 것

let num = 10;
let str = '20';

const result = num + str; 

• 숫지와 문자열을 더하면 문자열로 자동 변환됨.

2. 명시적 형변환

let str1 = '10';
let strToNum = Number(str1); 
// 문자열을 숫자로 변환

let str2 = '10개';
let strToNum2 = parseInt(str2); 
// 문자열에서 숫자만 추출

let num1 = 20;
let numToStr = String(num1); 
// 숫자를 문자열로 변환

console.log(numToStr + ' 입니다.')

---

4. ch_4.js - 연산자

1.대입 연산자 : 오른쪽의 값을 왼쪽의 변수에 할당

let var1 = 1;

2. 산술 연산자 : 수학적 계산을 할 때 사용

let num1 = 3+2;
let num2 = 3-2;
let num3 = 3*2;
let num4 = 3/2;
let num5 = 3%2;

let num6 = (1+2)*10; // 출력 : 30

3. 복합 대입 연산자 : 연산과 대입을 동시에 할 수 있는 연산자

let num7 = 10;
num7 += 20; // num7 = 10 + 20 = 30
num7 -= 20; // num7 = 30 - 20 = 10
num7 *= 20; // num7 = 10 * 20 = 200
num7 /= 20; // num7 = 200 / 20 = 10
num7 %= 20; // num7 = 10 % 20 = 10

4. 증감 연산자 : 변수의 값을 1씩 증가 혹은 감소시킬 때 사용

let num8 = 10;
console.log(num8++); // num8 = 10, 출력 : 10
console.log(++num8); // num8 = 12, 출력 : 12

5. 논리 연산자 : 논리적인 연산을 수행할 때 사용

let or = true || false; // true
let and = true && false; // false
let not = !true; // false

6. 비교 연산자 : 두 값을 비교할 때 사용

let com1 = 1 == '1'; // true - datatype을 고려하지 않음
let com2 = 1 != '1'; // false

let com3 = 1 === '1'; // false - datatype을 고려
let com4 = 1 !== '1'; // true

console.log(com1, com2, com3, com4);

let com5 = 2>1;
let com6 = 2<1;
let com7 = 2>=2;
let com8 = 2<=2;

---

5. ch_5.js - 연산자

1. null 병합 연산자

let var1; //undefined
let var2 = 10;
let var3 = 20;

// var1이 null이나 undefined이면 var2 출력, 아니면 var1 출력
let var4 = var1 ?? var2; 
let var5 = var1 ?? var3;
let var6 = var2 ?? var3;

console.log(var4, var5, var6); 

let userName;
let userNickname = 'ham';

let displayName = userName ?? userNickname;

console.log(displayName);

2. typeof 연산자

• 변수의 데이터 타입을 반환

let var7 = 1;
var7 = 'hello';
var7 = true;

let t1 = typeof var7;
console.log(t1);

3. 삼항 연산자

• 조건문을 간단하게 표현할 때 사용
• 항을 3개 사용하는 연산자
• 조건식을 따라서, 참, 거짓인 경우 다른 값을 출력
• 조건 ? v1 : v2; => 조건이 참이면 v1을 리턴, 조건이 false면 v2를 리턴

let var8 = 10;

let res = var8 % 2 === 0 ? '짝수' : '홀수';
console.log(res);

---

6. ch_9.js - 함수

1. 함수 표현식

function funcA() {
    console.log('funcA');
}

let  varA = funcA;

varA();

2. 람다식(익명함수)

let varB = function() {
    console.log('funcB');
}

varB();

3. 화살표 함수

let varC = (value) => {
    console.log(value);
    return value +1;
}

console.log(varC(10));

// 화살표 함수의 간결식
let varD = () => 1;

console.log(varD());

---

7. ch_10.js - 콜백함수

1. 콜백함수

function main(value, value2) { // 함수를 매개변수로 받음
    value(); // 함수를 실행
    console.log(value2);
}

function sub() {
    console.log('I am 서브함수');
} 

console.log('1. 일반함수를 매개변수로 받음')
main(sub,3);

console.log('2. 익명함수를 매개변수로 받음')
main(function () { 
    console.log('I am 익명함수');
});

console.log('3. 화살표 함수를 매개변수로 받음')
main(
    () => {
        console.log('I am 화살표함수');
    },3
)

2. 콜백함수 활용

function repeat(count, callback) {
    for(let idx = 0; idx < count; idx++){
        callback(idx);
    }
}

console.log('콜백함수 활용 - 일반 함수')
repeat(5, function (idx) {
        console.log(idx);
    }
);

console.log('콜백함수 활용 - 화살표 함수')
repeat(5, (idx) => {
    console.log(idx);
}
);

---

8. ch_11.js - 변수선언

1. 전역변수 : 프로그램 전체에서 사용가능한 변수

• 지역변수 : 특정함수, 영역 내에서만 사용하는 변수
• 전역변수 저장공간, 지역변수 저장공간이 별도로 존재 @@@@
• 지역변수 저장공간은 블록별로 여러개가 존재
• 특정 블록 내에서는 특정 지역변수 저장공간에 저장된 값만 사용이 가능
• 특정 블록 내에서 변수를 찾았는데 없으면, 전역변수 저장공간에서 찾음

let a = 1; // 전역변수

function funcA() {
    let b = 2; // 지역변수
    console.log(a);
    console.log(b);
}

funcA();

if(true){
    let c = 3; // 지역변수
    console.log(c);
}

//console.log(c); //에러!

for (let i = 0; i <10; i++){
    let d = 1;
    console.log(d);
}

function funcC() {
    let b = 2;
    console.log(b);

    function funcD() {
        console.log(b); // funcD의 저장공간에 없어서 지역변수 b를 부모 함수에서 찾음
        console.log(a); // funcD의 저장공간에 없어서 전역변수 a를 찾음
    }

    funcD();
}

funcC();

---

8. ch_11.js - 변수선언

1. 객체 생성

let obj1 = new Object(); 
// 객체 생성자를 사용하여 객체 생성

let obj2 = {}; 
// 객체 리터럴을 사용해서 객체 생성 - 대부분 사용방식

2. 객체 리터럴

• key : value
• 객체 프로퍼티(객체 내부의 요소)

let person = {
    name : '해니', // key는 문자 or 숫자
    age :27,
    hobby : '테니스',
    job : 'Developer',
    extra : {},
    10 : 20,
    'like cat' : true
    // key가 문자열인 경우 - 특문자 또는 space가 포함된 경우
    // 반드시 따옴표로 감싸준다.
};

3. 객체 프로퍼티 다루는 방법

let name = person.name; // 점표기법
let age1 = person['age']; // 대괄호 표기법

let age2 = person['age']; // 존재하지 않는 프로퍼티에 접근하면 undefined 반환

//프로퍼티 밸류 바꾸기
let property = 'hobby';
let hobby = person[property];

4. 새로운 프로퍼티 추가하는 방법

person.job = 'da analyst';
person['favoriteFood'] = '떡볶이';

console.log(person);

5. 프로퍼티 수정

person.job = 'educator';
person['favorite Food'] = '통새우쉬림프와퍼';

console.log(person);

6. 프로퍼티 삭제

delete person.job;
delete person['favoriteFood'];

console.log(person);

7. 프로퍼티의 존재 확인 : in

let result1 = 'name' in person; // true 
let result2 = 'cat' in person; // false

console.log(result1, result2);

---

너무 많아서 더 못쓰겠다 ㅜㅡㅜ