// TODO: 일반함수 -> 화살표 함수
// 1)
// function mySum(a, b) {
// return a - b;
// }
let mySum = (a, b) => a - b;
// 2)
// function triple(n) {
// return n*2;
// }
let triple = (n) => n * 2;
// 3)
// function Hello() {
// console.log("안녕하세요");
// }
let Hello = () => console.log("안녕하세요");
// // 예제 1) 함수형코딩 , foreach() , map() , filter()
// => 내부적으로 반복문이 자동실행되며 출력하는 함수
// 예제 1) 1~5까지 출력
// let arr = [1, 2, 3, 4, 5];
// for (let i = 0; i < 5; i++) {
// console.log(arr[i]);
// }
// forEach 함수
// TODO: 배열변수에서 사용함
// TODO: 자동으로 반복문이 실행됨 : 배열개수만큼
// 단순 출력용
// arr.forEach((value) => {
// console.log(value);
// });
//TODO: 간단연습 : foreach 이용해서 배열의 값을 모두 출력하세요
let str = [10, 20, 30];
// for (let i = 0; i <= 2; i++) {
// console.log(str[i]);
// }
str.forEach((abc) => {
console.log(abc);
});
// 2) map 함수
// TODO: 원리 : 1)배열변수만가능
// 2) 자동적으로 반복문이 실행: 배열크기만큼
// 3) 원본배열-> 새배열로 변경할때 사용함
// 예제 1) 아래 배열에서 제곱수를 변경하는 새배열을 코딩
let num = [1, 2, 3, 4, 5]; // 제곱수 : [1,4,9,16,25]
let res = []; // 새배열
for (let i = 0; i <= 4; i++) {
res[i] = num[i] num[i];
}
console.log(res);
// TODO: map 함수 이용
let res2 = num.map((value) => value value);
console.log(res2);
// TODO: 간단연습 : 기존배열을 새배열로 코딩하고 출력
// 힌트 : value - 1
let arr2 = [1, 2, 3]; // 결과 : [0,1,2]
let res2 = arr2.map((value) => value - 1);
console.log(res2);
이크마스크립트(js고급) 함수형코딩(map)
//filter 함수 : 뜻? 10개 -> 3개, 2개 로 거르는 것
// TODO: 원리 : 1) 배열변수만 가능
// 2) 자동적으로 반복문 실행: 배열개수만큼
// 3) 원본배열의 개수보다 작은 배열을 만들고 싶을때 사용
// (참인것만 나옴)
// TODO: 예제 1 : 3보다 큰 새배열을 코딩하고 출력하세요
let num = [1, 2, 3, 4]; // 정답 : [4]
let res = [];
for (let i = 0; i < 5; i++) {
if (num[i] > 3) {
res[0] = num[i];
}
}
console.log(res);
//TODO: filter 이용
//TODO: 사용법 : let 임시변수 = 배열변수.filter((매개변수) => 매개변수(조건식));
let res2 = num.filter((value) => value > 3);
console.log(res2);
<body>이크마스크립트(js고급): 백틱
// 예제 1: 문자열 붙이기 - + // 출력 : 10 // 20 let num = 10; let num2 = 20; alert(`${num} ${num2}`); // TODO: 백틱 이용(새로운 문자열 사용법) // 예제 1: 문자열 붙이기 - + // 출력 : 10 // 20 // let num = 10; // let num2 = 20; // TODO: 백틱 이용(새로운 문자열 사용법) // TODO: 사욥법 : 1) `` 키보드 숫자 1번 좌측키) // 2) 변수 : ${변수명} // jsp 이 el 표현식과 유사 // alert(`${num} // ${num2}`); // TODO: 간단연습 : 아래 변수, 백틱이용해서 출력
// 결과 : 홍길동님 안녕하세요.
let str = "홍길동";
// let str2 = "안녕하세요";
alert(`${str}님 안녕하세요`);이크마스크립트(js고급) : 옵셔널 널리쉬
// 예제 : user 객체의 속성을 출력하세요 let user = null; // TODO: 위의 코딩은 시스템 중단을 발생시킴 // if (user != null) { // 안정적인 코딩 : null 에러방지 // console.log(user.address); // } // TODO: 옵셔널 널리쉬(null 방지 기능) :변수?.속성 (물음표) console.log(user?.address);