All'alba vincerò

At dawn, I will win!

2024/06/25 4

[JS] 인스턴스 메서드 (Instance Method) / 스태틱 메서드 (Static Method)

인스턴스 메서드 (Instance Method) : 클래스의 인스턴스에서 호출되는 메서드 해당 클래스의 각 인스턴스에 대해 개별적으로 존재인스턴스의 데이터(속성)를 조작하거나 접근하는 데 사용 클래스의 인스턴스가 생성될 때마다 새로운 메서드가 생성됨 클래스의 인스턴스를 통해 호출 `참조 변수.메소드 명()`class MyClass { constructor(name) { this.name = name; } greet() { console.log(`Hello, my name is ${this.name}`); }}const obj = new MyClass('Alice');obj.greet(); // Hello, my name is Alice    스태틱 메서드..

Javascript 2024.06.25

Swiper - 자바스크립트 슬라이드(slide) 라이브러리

자바스크립트 슬라이드(slide) 라이브러리  Swiper: 유연하고 사용하기 쉬운 자바스크립트 슬라이드 라이브러리  Swiper - The Most Modern Mobile Touch SliderSwiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior.swiperjs.com   설치 CDN 방식   npm 방식1. npm 설치npm install swiper 2. JS 파일에서 가져오기import Swiper from 'swiper';import 'swiper/swiper-bundle.css';   HTML 구조 swiper > swiper-wrappe..

기타 2024.06.25

[JS] 모듈 프로그래밍: export, import

모듈(module): 분리된 개별 코드 파일   모듈 프로그래밍: 코드의 재사용성과 유지보수성을 높이기 위해 코드를 여러 모듈로 나누는 기법    모듈의 핵심 기능엄격 모드(use strict)로 실행됨 - 이어야 export, import 가능✨모듈 만의 스코프(scope)가 있음- 모듈 내부에서 정의한 변수나 함수는 다른 스크립트에서 접근할 수 없다❌ 한 번만 평가됨 - 동일한 모듈이 여러 곳에서 사용되더라도 모듈은 최초 호출 시 단 한 번만 실행된다. 지연 실행된다.인라인 모듈 스크립트도 비동기 처리할 수 있다. export (내보내기): 변수, 함수, 클래스를 모듈 밖으로 내보낼 수 있다.   named export (이름 내보내기) 한 파일 내에서 여러 개 내보내기(export) 가능 여러 항..

Javascript 2024.06.25

[JS] 브라우저 기본 동작 막기: e.preventDefault()

브라우저 기본 동작  : 특정 HTML 요소에 대해 기본적으로 수행하는 동작 링크()를 클릭하면 해당 URL로 이동폼(form)을 제출하면 페이지가 새로고침되면서 폼 데이터가 서버로 전송체크박스()를 클릭하면 체크 상태가 변경    브라우저 기본 동작 막기 ⛔1. event.preventDefault(): 특정 이벤트의 기본 동작을 막고 자바스크립트로 정의한 동작을 사용해야 할 경우 사용기본 동작(링크 클릭, 폼 제출, 체크박스 클릭 등)을 제어할 때 사용 사용자가 정의한 동작을 구현할 때 유용Example Link   2. on 속성 사용 시 "false" 반환 코드 가독성과 유지보수성을 위해 addEventListener와 e.preventDefault()를 사용하는 것이 좋다. Example Li..

Javascript 2024.06.25