전체 글 (34) 썸네일형 리스트형 8. 브라우저 알림창 띄우기 1. 모달 창이란?모달 창은 웹사이트에서 특정 작업을 완료하기 전까지 다른 작업을 막는 창을 말한다.예: "확인" 버튼을 눌러야만 닫히는 경고 창.브라우저가 모달 창의 위치를 자동으로 결정하며, 보통 중앙에 위치한다.모양은 브라우저마다 다르며, 개발자가 수정할 수 없다.2. 주요 모달 창 함수2.1 alert메시지와 확인 버튼만 있는 간단한 모달 창을 띄운다.사용자에게 정보를 전달할 때 사용된다.alert("안녕하세요!"); // 모달 창에 "안녕하세요!" 표시특징:사용자 입력은 필요하지 않다."확인" 버튼을 눌러야 창이 닫힌다.2.2 prompt메시지, 입력 필드, 확인, 취소 버튼이 있는 모달 창을 띄운다.사용자 입력을 받을 때 사용된다.문법:let result = prompt("메시지", "초기값".. 7. 자료형 변환 자바스크립트에서 자료형 변환자바스크립트는 자료형을 유연하게 다룰 수 있지만, 문자 ↔ 숫자 간 변환은 실무에서 자주 필요하다. 여기서는 숫자, 문자, 불리언 간 변환 방법을 설명한다.1. 숫자를 문자로 바꾸기숫자를 문자로 변환할 때는 String() 함수나 문자열 연산을 사용할 수 있다.// 방법 1: String() 함수 사용let age = 30;let ageAsString = String(age); // "30"console.log(typeof ageAsString); // "string"// 방법 2: 빈 문자열과 더하기let score = 100;let scoreAsString = score + ""; // "100"console.log(typeof scoreAsString); // "strin.. 6. 자바스크립트의 자료형 자료형이란자료형이란 숫자, 문자 등 데이터의 종류를 뜻한다. 각 데이터가 메모리에서 어떻게 저장되고 처리 될 지를 결정하는 데 중요한 역할을 한다.자료형이 중요한 이유메모리 공간을 효율적으로 사용컴퓨터 메모리는 제한적이므로, 데이터를 효율적으로 저장하기 위해 자료형을 기준으로 사용할 메모리 공간의 크기를 결정한다.컴퓨터는 모든 데이터를 1과 0으로 저장하며, 자료형이 데이터를 어떻게 해석할지를 알려준다.특정 자료형에만 동작하는 기능자바스크립트는 자료형에 따라 사용할 수 있는 기능이 다르다.숫자 자료형에는 수학 연산을, 문자열에는 텍스트 조작을 위한 기능을 사용할 수 있다.배열과 객체는 각각 고유한 메서드가 제공된다.자료형 요약// 기본 자료형 (Primitive Types)let age = 30; .. 5. 변수와 상수 1. 정보에 이름을 붙여 저장하는 방법데이터를 저장하는 상자에 이름을 붙이고 그 안에 데이터를 넣어 사용할 수 있다.let message = "Hello!";console.log(message); // "Hello!"상자를 만들고 이름표를 붙여 데이터를 저장해두면, 필요할 때 이름표를 사용해 데이터를 꺼낼 수 있다.2. 변수 (let) - 변하는 값을 저장변수란 변할 수 있는 값을 저장하는 상자이다.1. 변수 선언과 값 변경let score; // 점수라는 이름의 상자를 만듦 score = 10; // 상자에 10을 넣음 score = 20; // 상자의 값을 20으로 변경console.log(score); // 20 (변경한 20 출력)2. 변수 선언 시 주의 사항상자를 만들 때는 let 키워드를 사용.. 4. use strict 엄격 모드(Strict Mode)1. 자바스크립트와 자유도자바스크립트는 유연하고 자유도가 높은 언어다.하지만, 초기 자바스크립트에는 애매한 문법이 존재했다.이런 문법은 작은 스크립트에서는 문제가 없지만, 복잡한 프로그램에서는 에러의 원인이 될 수 있다.2. 엄격 모드란?엄격 모드(Strict Mode)는 자바스크립트의 애매한 문법 사용을 제한하는 기능이다.이 모드를 사용하면 더 안전하고 명확한 코드를 작성할 수 있다.활성화 방법: 파일 최상단에 "use strict";를 추가한다."use strict"; // 엄격 모드 활성화let x = 10; // 정상 작동undeclaredVariable = 20; // 에러 발생: 선언하지 않은 변수3. 엄격 모드 활성화의 장점안전한 코드 작성잘못된 코드가 실행되.. 3. 문과 식 1. 문(statement): 작업을 실행하는 단위문은 작업을 실행하며, 결과 값을 반환하지 않는다.일반적으로 한 줄에 하나의 문을 작성하며, 서로 다른 문은 줄바꿈을 통해 구분한다.대표적인 예: 조건문, 반복문, 함수 호출 등.// 웹 페이지에 경고 창을 띄우는 문alert('Hello'); // 이 문은 "Hello"라는 메시지를 출력하지만, 값을 반환하지 않는다.2. 식(expression): 값을 반환하는 코드식은 실행된 후 하나의 값을 반환한다.값 자체도 식으로 간주할 수 있다.예를 들어, 수학 연산, 변수 참조, 함수 호출 등이 식에 해당한다.// 숫자 값을 반환하는 식10;// 두 값의 합을 계산해 반환하는 식5 + 5;// 함수 호출로 값을 반환하는 식function returnTen() .. 2. html에 자바스크립트 추가하기 자바스크립트를 HTML에 추가하는 방법1. 자바스크립트 파일 없이 HTML에 직접 작성 설명: HTML과 JS 연결 설명:main.js 파일에 자바스크립트 코드를 작성하면 HTML과 분리된 구조로 관리할 수 있다.defer 속성을 사용하면 DOM 조작과 관련된 스크립트를 안전하게 실행할 수 있다.3. src 속성과 내부 코드 혼용 금지src 속성과 내부 코드가 동시에 있을 경우, 내부 코드는 무시된다.설명:src 속성이 있을 때는 외부 파일만 참조하므로 내부 코드는 삭제하거나 분리해야 한다.4. 설명:두 개의 스크립트가 각각 순서대로 실행된다.HTML 파싱이 완료된 후 실행되므로 DOM과의 충돌이 없다.2) async 속성HTML 다운로드와 병렬로 스크립트를 다운로드하고 실행한.. 1. 자바스크립트란? 1. 자바스크립트의 탄생자바스크립트는 1995년, 넷스케이프(Netscape)라는 브라우저 회사에서 탄생했는데, 웹 페이지를 좀더 동적으로 만들 수 있는 스크립트를 만드는 것이 목표었다. (넷스케이프는 마이크로소프트의 인터넷 익스플로러(IE)에 밀려 역사 속으로 사라짐)HTML과 CSS는 정적인 구조와 스타일만 제공.자바스크립트는 이를 보완해 사용자와 상호작용할 수 있는 웹을 가능하게 한다.특징브라우저에서만 동작하도록 설계됨.주로 보조적인 기능(예: 버튼 클릭, 폼 검증)에 사용.초기 사용 예시// 버튼 클릭 시 경고창 띄우기function showAlert() { alert("버튼이 클릭되었습니다!");}HTML과 연결:클릭하세요2. ECMA 표준화와 발전ECMA는 컴퓨터 시스템의 표준을 관리하.. 이전 1 2 3 4 5 다음 목록 더보기
