반응형
⭕ 자바스크립트 JavaScript | 기본 구성 요소: 변수, 함수, 조건문, 삼항연산자, 반복문, 배열
React 프로젝트 진행을 위한 자바스크립트 기본 구성 요소를 정리합니다.
➡️ 변수
- 데이터를 저장하는 데 사용되는 이름이 붙은 저장소
- let, const, var 키워드를 사용하여 변수를 선언함
let name = "John";
const age = 30;
➡️ 함수
즉시실행함수
- 정의되자마자 즉시 실행되는 함수
- 주로 초기화 코드에 사용함
(function() {
console.log("즉시 실행!");
})();
파라미터 기본값 설정
- 함수에 파라미터를 전달하지 않았을 경우 기본값을 설정할 수 있음
function greet(name = "Guest") {
console.log(`Hello, ${name}!`);
}
greet(); // "Hello, Guest!"
greet("John"); // "Hello, John!"
➡️ 조건문
- 주어진 조건의 참/거짓 여부에 따라 다른 코드를 실행함
let score = 75;
if (score >= 70) {
console.log("합격!");
} else {
console.log("불합격!");
}
➡️ 삼항연산자
- 조건식, 참일 때의 표현식, 거짓일 때의 표현식을 포함함
- 간단한 조건부 로직에 유용함
let score = 85;
let result = score >= 70 ? "합격" : "불합격";
console.log(result); // "합격"
➡️ 반복문
- 조건이 참인 동안 코드 블록을 반복 실행
for (let i = 1; i <= 5; i++) {
console.log(i); // 1부터 5까지 출력
}
➡️ 배열(Array)
forEach 메서드
- 배열의 각 요소에 대해 주어진 함수를 실행함
let fruits = ["apple", "banana", "cherry"];
fruits.forEach(fruit => console.log(fruit));
map 메서드
- 배열의 각 요소에 함수를 적용한 결과를 모아 새 배열을 반환함
let numbers = [1, 2, 3];
let squares = numbers.map(number => number * number);
console.log(squares); // [1, 4, 9]
push 메서드
- 배열의 끝에 하나 이상의 요소를 추가함
let numbers = [1, 2, 3];
numbers.push(4);
console.log(numbers); // [1, 2, 3, 4]
반응형
'프론트엔드 > HTML & CSS & Javascript' 카테고리의 다른 글
자바스크립트 JavaScript | 함수 및 반환 방법 (69) | 2024.03.09 |
---|---|
자바스크립트 JavaScript | 예외 처리: try-catch-finally 구문 (69) | 2024.03.09 |
자바스크립트 JavaScript | 객체(Object) 및 접근 방법 (69) | 2024.03.09 |
자바스크자바스크립트 JavaScript | 문자열 처리: 템플릿 리터럴(Template Literal) (70) | 2024.03.09 |
HTML 태그: 웹 개발의 기본, 태그의 중요성과 활용법 (0) | 2023.11.07 |
HTML 코딩을 위한 환경 설정: 에디터 선택과 비주얼 스튜디오 코드 소개 (0) | 2023.11.07 |
HTML과 퍼블릭 도메인: 웹의 언어 (0) | 2023.11.07 |
웹 기획: 프로젝트를 체계적으로 구상하는 핵심적인 과정 (0) | 2023.11.07 |