본문 바로가기

개발 메모장9

[자바스크립트 학습] 고급 6일차 2.1 객체와 프로토타입객체란?객체는 데이터를 묶어서 관리하는 도구입니다. 객체는 속성(데이터)과 메서드(함수)를 포함합니다. 속성: 객체의 특징을 나타냄 (예: 이름, 나이). 메서드: 객체가 할 수 있는 행동 (예: 걷기, 말하기).왜 객체가 중요한가? 데이터를 구조적으로 관리할 수 있음. 코드 재사용성이 높아짐.비유: 객체는 자동차와 같음. 속성: 브랜드, 색상, 최고속도 메서드: 출발하기, 멈추기기본 예제: 사람 객체let 사람 = { 이름: "철수", 나이: 10, 걷기: function () { console.log(this.이름 + "가 걷고 있습니다."); }};console.log(사람.이름); // 결과: 철수사람.걷기(); // 결과: 철수가 걷고 있습니다... 2024. 12. 16.
[자바스크립트 학습] 고급 5일차 2.1 객체와 프로토타입1. 객체란?객체는 데이터를 구조화해서 관리하기 위한 도구입니다. 예: 사람, 동물, 자동차 같은 사물을 프로그래밍으로 표현. 객체는 속성(데이터)과 행동(함수)을 가집니다.왜 필요한가? 많은 데이터를 묶어서 효율적으로 관리할 수 있습니다. 재사용성을 높이고, 유지보수를 쉽게 만듭니다.어떤 곳에서 쓰이는가? 사용자 정보 관리: 사용자 이름, 나이, 이메일 등. 게임: 캐릭터 속성(체력, 공격력 등) 관리. 쇼핑몰: 상품 정보(가격, 이름, 재고 등) 관리.2. 프로토타입이란?프로토타입은 객체들이 공통으로 속성과 기능을 상속받도록 도와주는 템플릿입니다. 비유: 부모가 자식에게 물려주는 유전자.왜 필요한가? 같은 기능을 가진 메서드를 여러 객체에 반복 작성하지 않아도 .. 2024. 12. 16.
[자바스크립트 학습] 고급 4일차 2.1 객체와 프로토타입 1. 객체란 무엇인가요? 객체는 현실 세계의 사물을 코드로 표현한 것입니다. 예를 들어, 사람은 이름, 나이, 키 같은 속성(데이터)과 걸어다니기, 말하기 같은 행동(함수)을 가지고 있습니다. 예시 let 사람 = { 이름: "철수", 나이: 10, 인사하기: function () { console.log("안녕하세요! 저는 " + this.이름 + "입니다."); }};console.log(사람.이름); // 결과: 철수사람.인사하기(); // 결과: 안녕하세요! 저는 철수입니다. 설명: 사람 객체는 이름, 나이라는 속성과 인사하기라는 행동을 가지고 있습니다. this는 현재 객체를 가리키는 특별한 키워드입니다. 2. 프로토타.. 2024. 12. 16.
[자바스크립트 학습] 기본 개념 및 문법 3일차 1.1 자바스크립트 기초 구조 자바스크립트란? 웹 페이지를 동적으로 변화시킬 수 있는 언어입니다. HTML은 구조, CSS는 디자인, 자바스크립트는 동작을 담당합니다. 왜 필요한가? 사용자 상호작용: 버튼을 클릭하거나 데이터를 입력하면 동작을 추가할 수 있습니다. 데이터 처리: 사용자 입력 데이터를 저장하고, 계산하거나 전송할 수 있습니다. 자동화: 반복되는 작업을 코드로 처리할 수 있습니다. 활용 사례 쇼핑몰에서 "장바구니 담기" 버튼을 누르면 상품을 장바구니에 추가. 폼을 제출할 때 입력값이 올바른지 실시간으로 검사. 스크롤을 내리면 애니메이션을 실행하거나 새로운 콘텐츠를 불러오기. .. 2024. 12. 16.
[자바스크립트 학습] 기본 개념 및 문법 2일차 1.1 자바스크립트 기초 구조 - 심화 자바스크립트 실행 흐름 HTML → CSS → 자바스크립트 순서 브라우저는 HTML을 읽어 웹 페이지의 뼈대를 만듭니다. CSS로 디자인을 적용합니다. 자바스크립트로 동작을 추가합니다. 실습 예제: 버튼 클릭 시 경고창 띄우기 눌러보세요 코드 설명 getElementById("myButton"): 버튼 요소를 선택합니다. addEventListener: 버튼이 눌렸을 때 경고창을 띄웁니다.     1.2 데이터 타입과 변수 - 심화 데이터 타입의 특징 Number (숫자.. 2024. 12. 16.
[자바스크립트 학습] 기본 개념 및 문법 1일차 1.1 자바스크립트 기초 구조 자바스크립트는 웹 페이지를 더 똑똑하게 만들기 위한 언어입니다. HTML이 웹 페이지의 뼈대라면, CSS는 옷이고, 자바스크립트는 두뇌입니다. 자바스크립트 사용 방법 자바스크립트를 사용하는 방법은 두 가지가 있습니다: 1. HTML 안에 직접 작성하기 위 코드는 브라우저가 실행되면서 "안녕하세요!"라는 메시지 상자를 띄웁니다.   2. 외부 파일로 작성하기 외부 파일(script.js)에 코드를 작성하면, HTML이 더 깔끔해집니다.     1.2 데이터 타입과 변수 데이터 타입 데이터는 숫자, 글자, 참/거짓처럼 다양한 종류로 구분됩니다. 자바스크립트의 주요 데이터 타입은 .. 2024. 12. 16.
var, let, const 차이점 요약 자바스크립트에서 변수를 선언하는 방식에는 var, let, const가 있다. 이 글에서는 각각의 차이를 스코프, 재선언, 재할당, 호이스팅 관점에서 알아본다. 자바스크립트를 다루면서 어떤 변수를 언제, 어떻게 사용하는 것이 적합한지 깊이 있게 정리해보려 한다. var 선언 단계: 스코프에 변수가 등록됨. 초기화 단계: undefined로 초기화됨(호이스팅됨). 할당 단계: 할당이 실행되면 값이 저장됨. 특징: 선언과 초기화가 동시에 이루어져 접근이 가능하지만 값은 undefined. console.log(a); // undefined (호이스팅: 선언은 됐지만 값은 undefined)var a = 10; // 선언, 초기화(undefined), 할당(10)console.log(a); // 10 .. 2024. 12. 5.