[JavaScript] 브라우저 기본 모달창(alert, prompt, confirm)

alert사용자에게 간단한 메시지를 표시하는 데 사용됩니다. 이 함수는 모달 창을 생성하며, 사용자가 확인 버튼을 클릭하기 전까지 다음 코드로 진행되지 않습니다.alert('hello wolrd')사용자가 확인 버튼을 누르기 전까지는 스크립트 실행이 일시 정지됩니다.특징복잡한 설정 없이 간단한 메시지를 표시다른 작업을 하기 전까지 사용자가 메시지를 확인하도록 강제prompt사용자로부터 입력을 받을 때 사용됩니다. 메시지와 입력 필드가 있는 모달 창을 띄우며, 사용자가 정보를 입력하고 확인 또는 취소 버튼을 선택할 수 있습니다.let result = prompt(text, defaultText);// text : 사용자에게 표시할 메시지(필수)// defaultText : 입력 필드에 미리 채워둘 기본값(..

• format_list_bulleted JavaScript
• · 2025. 2. 5.
• textsms

[JavaScript] 자료형

숫자형숫자형은 정수와 부동소수점 숫자를 모두 포함합니다. Number 타입 하나로 정수와 실수를 모두 표현합니다.let a = 1; // 정수let b = 3.14; // 부동소수점특수 숫자Infinity : 양의 무한대-Infinity : 음의 무한대NaN(Not a Number) : 산술 연산이 실패할 경우NaN은 자기 자신과도 같지 않은 유일한 값(NaN !== NaN)NaN 여부를 확인할 경우 Number.isNaN() 함수를 사용하여 확인BigInt일반적인 숫자형은 범위가 있기 때문에 이 범위를 넘어서는 정수를 표현하기 위한 자료형입니다.숫자 리터널 뒤에 n을 붙여 BigInt를 생성합니다.BigInt는 BigInt 끼리만 연산이 가능합니다.const bigNum = 123n;문자열문자열을 만들..

• format_list_bulleted JavaScript
• · 2025. 2. 5.
• textsms

[JavaScript] 변수와 상수

변수변수 선언과 초기화변수는 이름이 붙은 메모리 공간으로, 데이터를 저장하고 변경할 수 있습니다. 최신 자바스크립트에서는 let 키워드를 주로 사용하여 변수를 선언합니다.변수를 선언한 후 나중에 값을 할당할 수 있고, 선언과 동시에 초기화를 할 수 있습니다.// 선언 후 할당let a;a = 1;// 선언과 동시에 초기화let b = 1;동적 타이핑자바스크립트는 동적 타입 언어이므로, 한 변수에 다양한 값을 자유롭게 할당할 수 있습니다.let a = "test"; // 문자열a = 1; // 숫자a = { a: 1 }; // 객체상수상수는 한 번 초기화되면 값을 변경할 수 없는 변수입니다. const 키워드를 사용하여 선언과 동시에 초기값을 할당해야 합니다.const TEST = 1;// 재할당 시 에러..

• format_list_bulleted JavaScript
• · 2025. 2. 5.
• textsms

[JavaScript] 엄격 모드(Strict Mode)

엄격 모드란자바스크립트는 초기부터 하위 호환성을 중요시하며 발전했습니다. 이로 인해 기존의 코드는 새로운 버전에서도 문제가 발생하지 않는다는 장점이 있지만 초기 설계의 실수나 비효율적인 부분이 언어에 그대로 남아있는 문제가 있습니다.ES5에서 자바스크립트는 새로운 기능을 도입했습니다. 이 기능들은 하위 호환성 문제가 생길 수 있으므로, 엄격모드를 도입하여 개발자가 명시적으로 새로운 기능을 활성화할 수 있도록 했습니다.엄격 모드는 안전한 코드 작성을 강제하는 런타임 검사 모드입니다."use strict" 지시자엄격 모드를 활성화하려면 코드의 최상단에 "use strict" 지시자를 추가하면 됩니다."use strict"// 이 코드는 엄격 모드로 실행됩니다. 또한 함수 내에서만 엄격 모드를 적용하려면 함수..

• format_list_bulleted JavaScript
• · 2025. 2. 5.
• textsms

[JavaScript] 자바스크립트 코드 구조

Statement의 이해작업을 수행하는 최소 수행 단위console.log(1);console.log(2);각 문은 세미콜론으로 구분되며, 위에서 아래로 순차적 실행가독성을 위해 줄 분리를 통한 코드 구조를 가져야합니다.console.log(1);console.log(2);세미콜론 전략줄 분리가 있으면 자바스크립트는 세미콜론 자동 삽입을 합니다. 그러나 세미콜론없이 코드 구조를 가지게 되면 에러가 발생할 수 있습니다.위와 같이 세미콜론 자동 삽입을 생각하여 코드를 작성했으나 자바스크립트는 에러가 발생합니다.// 자바스크립트가 인식하는 코드이런 문제점을 해결하기 위해서는 세미콜론을 명시적으로 사용해야 합니다.주석 활용함수에 관한 주석어떤 함수인지에 대한 설명과 파라미터와 리턴값에 대한 설명으로 주석을 추가..

• format_list_bulleted JavaScript
• · 2025. 2. 5.
• textsms

[JavaScript] 자바스크립트 실행 환경 설정

스크립트 실행 후 브라우저는 //app.jsdocument.addEventListener('DOMContentLoaded', () => { console.log('DOM이 완전히 로드되었습니다.'); document.body.style.backgroundColor = '#f0f0f0';});페이지 로딩 속도 향상 : 브라우저가 외부 파일을 캐시에 저장해 재사용유지보수 향상 : 코드 분리로 효율성 증가절대 경로와 상대 경로// 절대 경로// 상대 경로하지만 현재 자바스크립트에서는 이런 속성은 불필요해서 생략합니다.스크립트 로딩 전략defer스크립트를 비동기로 로드하고 DOM이 완전히 파싱된 후에 실행// 올바른 코드CDN 스크립트외부 스크립트를 CDN 스크립트라고 하는데 이를 안전하게 로드할 수..

• format_list_bulleted JavaScript
• · 2025. 2. 5.
• textsms