2주차 월요일 TIL

오늘 배운것
변수는 값을  저장하기 위한 이름, 변수에 할당된 값은 변수의 데이터 타입에 따라 다르게 처리된다.
console.log(typeof 변수이름)을 통해 타입을 확인 가능
- var는 중복 선언이 가능하지만, let과 const는 불가능
- let과 var는 재할당이 가능하지만, const는 재할당이 불가능

문자열 결합: concat() 메서드를 사용하여 문자열을 결합
문자열 자르기: substr() 및 slice() 메서드를 사용하여 문자열의 일부를 잘라낼 수 있음

hello, world! 문자열의 인덱스 번호

let str = "hello, world!";
console.log(str3.substr(7, 5)); // 시작 위치, 시작위치부터 몇개까지
console.log(str3.slice(7, 12)); // 시작 위치, 끝 위치

// 출력결과
// world
// world

문자열 검색: search() 메서드를 사용하여 특정 문자열의 위치를 찾을 수 있음
문자열 대체: replace() 메서드를 사용하여 특정 문자열을 다른 문자열로 대체
문자열 분할: split() 메서드를 사용하여 문자열을 배열로 분할
> split() 메서드를 사용 시 배열형태로 반환

암시적 형 변환

let result1 = 1 + "2";
console.log(result1);
console.log(typeof result1);

// 출력결과
// 12
// string

숫자와 문자를 더했을 때 12라는 문자열로 변환 > 자동으로, 암시적으로 변환
문자열과 다른 데이터타입이 더하기 연산자로 만날 시 문자열이 우선된다.

let result3 =  1 - "2";
console.log(result3);
console.log(typeof result3);

let result4 =  "2" * "3";
console.log(result4);
console.log(typeof result4);

// 출력결과
// -1
// number
// 6
// number

더하기 연산자가 아닌 다른 연산자가 나올 시 숫자가 우선된다.(변환이 불가하면 NaN)

명시적 형변환
어떤 타입으로 형변환을 할지 명시해야한다.

console.log(Boolean(0));
0이라는 값을 boolean 타입으로 변경
let result9 = String(undefined);
undefined를 문자열 타입으로 변경 > "undefined"
let result10 = Number("123");
123이라는 문자열을 Number 타입으로 변경

연산자 - 기본적인 사직연산, 나머지 구할 수 있다.

할당연산자

등호 연산자(=)
let x = 10; // x라는 변수 선언, 10을 할당
추가로 -=, +=, *=로 더하기, 빼기, 곱하기 등등 가능
<, >등 부등호 사용

일치연산자(===)
타입까지 일치해야 true 를 반환하는 연산자

console.log(2 === 2); // true
console.log("2" === 2); // false

불일치연산자(!==)
타입까지 일치해야 false를 반환하는 연산자

console.log(2 !== 2); // false
console.log("2" !== 2); // true

논리곱연산자, AND연산자 (&&)
두 값이 모두 true 일 때만 true 반환

console.log(true && true); //true
console.log(true && false); // flase

논리합연산자, OR연산자(||)
두 값중 하나라도 true일 때 true 반환

console.log(false || true); // true
console.log(false || false); // flase

논리부정연산자, NOT연산자(!)
값을 반대로 바꿈

console.log(!true); // false

삼항연산자
조건에따라 값을 선택할 수 있음

// (조건) ? "true일때 반환" : "false일때 반환";
let x = 10;
let result = (x > 5) ? "크다" : "작다";
console.log(result); 

// 크다

화살표함수

// 화살표 함수
// es6 산 문법
function add (x,y) {
    return x + y
}

// 1-1. 기본적인 화살표 함수
let arrowfunc01 = (x,y) => {
    return x+y
}

// 1-2. 한 줄로
let arrowfunc02 = (x, y) => x + y
// 중괄호 안 줄이 한줄일때만 가능

function testfunc (x) {
    return x;
}

// 화살표함수로 바꾸면
let arrowfunc03 = x => x
// 매개변수도 하나일 때 괄호 생략 가능

조건문
1. if문 (true or false가 출력되는 조건)

// let x = 10;


if (x > 0) {
	//조건이 true라면 main logic이 실행
	//조건이 false라면 실행 x
	console.log("x는 양수입니다.");
}

// x는 양수입니다.

2. if-else문

if (x > 0) {
     // main logic #1 - 조건에 맞는 경우 실행 로직
     console.log("x는 양수입니다.")
 } else {
    // main logic #2 - 조건에 맞지 않는 경우 실행 로직
    console.log("x는 음수입니다.")
 }

3. if - else if - else

if -else if - else
let x = -5;
if (조건1) {
     // main logic #1
    
 } else if (조건2){
     // main logic #2
    
} else {
	// 나머지 경우
}

4. switch 문

let fruit = "바나나";

switch (fruit) {
    case "사과" :
        console.log('사과입니다.');
        break; // 포함 유의
    case "바나나" :
        console.log('바나나입니다.');
        break;
    case "키위" :
        console.log('키위입니다.');
        break;
    default: // 나머지 경우
        console.log('아무것도 아닙니다.');
}

// 바나나입니다.

조건문 중첩

let age = 14;
let gender = "여성";

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

} else {
    // console.log("미성년입니다.")
    if (gender === "여성") {
        console.log("미성년 여성입니다.")
    } else {
        console.log("미성년 남성입니다.")
    }
}

 
// 미성년 여성입니다.

조건부 실행

let x = 10;

(x>0) && console.log("x는 양수입니다.")
// (조건) 만족시 실행되게 해줘

// 삼항 연산자와 단축평가
// or 조건(||)
let y;
let z = y||20;
// y가 indefined이기 때문에 ||연산자는 오른쪽 조건을 평가한다.
// z = 20

논리합 연산자 ||는 조건문의 평가에서 사용될 때와 삼항 연산자 내에서의 사용이 다르다


JavaScript에서 "truthy"로 평가되는 값
true
모든 비어 있지 않은 문자열 (예: "hello", ' ' 등)
모든 0이 아닌 숫자 (예: 1, -1, 3.14 등)
모든 객체 (예: {}, [], function() {} 등)
Date 객체, RegExp 객체 등

JavaScript에서 "falsy"로 평가되는 값
false
0
-0
0n (BigInt 0)
"" 또는 '' (빈 문자열)
null
undefined
NaN

Object.values() 메서드는 주어진 객체의 모든 값을 배열로 반환


오늘 til은 배운내용 거의 전부를 서술한 것 같다. 글을 쓰며 기록하며 배운것을 점검하는 효과를 크게 느꼈다. 팀장님이 팀에게 내주신 퀴즈를 푸는데 시간을 꽤  썻고
삼항 연산자에서 반환값을 설정하는 부분에 조건을 부여하여 문제를 해결하는 방법을 터득했다.

function clamp3(value, min, max) {
    return (value < min) ? min :(value > max) ? max : value;
};

//value 가 min보다 작으면[미만] min
//그리고 value 가 max보다 크면[초과] max 값을 리턴