Topic

자바스크립트

A collection of 197 posts
자바스크립트

자바스크립트 엄격 모드('use strict';)의 개념과 제약 사항의 이해

'use strict'는 자바스크립트의 구문이 실행되는 환경을 설정하는 예약어입니다. 'use strict'; 와 같이 단일 구문으로 사용합니다. 한글로는 "엄격 모드"로 사용합니다. 자바스크립트 파일 전역으로, 또는 개별 함수 단위로 선언해서 사용할 수 있습니다. 자바스크립트 파일 전역으로 선언을 할 때는 파일 맨 위에 작성해서 표시를 합니다. 'use strict'는 자바스크립트의 의도치 않은 오류를 막아주는
7 min read
자바스크립트

자바스크립트로 HTML 요소가 보이는지 체크하기

".element" 클래스를 가진 요소가 보이는지를 체크하는 코드를 이용해서 HTML 요소가 보이는지를 판별하는 코드를 알아보겠습니다.
CSS는 다음과 같이 클래스를 정의해서 HTML 요소의 화면 표시에 관계된 속성들을 적용해서 확인합니다. html, body{ width: 100%; height: 100%; margin: 0; padding: 0; } .element{ /* display: none; visibility: hidden; opacity: 0; */ width: 100%; height: 100%; } 먼저 화면을
5 min read
자바스크립트

[javascript] 자바스크립트 배열의 요소(들)를 삭제하기

초보자에게는 다소 어려운 내용입니다. 기초 내용을 먼저 보고 읽어보면 도움이 될수 있습니다. > 배열 요소의 추가 > 배열 요소의 추가, 변경, 삭제하기 Splice() 메서드와 delete를 이용한 기초 삭제 방법 배열의 요소를 삭제하는 가장 기본적인 방법입니다. 배열의 위치 인덱스를 사용해 배열 아이템을 삭제합니다. 배열 아이템을 삭제하는 것은 동일하지만 "splice()"와 "delete"는 큰
10 min read
자바스크립트

자바스크립트로 페이지 스크롤 인디케이터 구현하기

긴 페이지를 스크롤해서 움직일 때 페이지 어디쯤에 위치해있는지 알려주는 기능을 하는 페이지 스크롤 인디케이터가 있으면 방문자가 페이지 내용을 탐색하는데 많은 도움이 됩니다. 데스크톱 환경에서는 고정 위치에 스크롤바가 있기 때문에 대략의 위치를 파악하는 것이 어렵지 않지만, 모바일 웹 환경에서는 스크롤바가 스크롤하는 시점에만 보이고 사라지기 때문에 이런 스크롤 인디케이터가 고정 위치에 표시되는
6 min read
자바스크립트

[javascript] 자바스크립트 문자열 포매팅 구현하기. String.format() 총정리판.

다른 언어에서는 기본 메서드로 제공되는 문자열 포메팅 함수, 또는 메서드가 제공되지 않습니다. 굉장히 자주 사용하는 기능이지만 제공되지 않기 때문에 만들어 써야 합니다. 문자열 포매팅을 구현하는 방법은 여러가지가 있습니다. 필요에 따라 단순하게 구현해서 사용하는 방법도 있지만, 범용으로 사용할 수 있는 조금 복잡한 구현 방식으로 구현해서 여러가지 용도로 사용할 수도 있습니다. 프로토타입
11 min read
자바스크립트

[Google Apps script] 구글 드라이브의 오래된 파일을 자동 삭제하기

구글 앱 스크립트(App Script) 를 사용해 구글 드라이브의 파일들을 관리할 수 있습니다. 특히 장기간 백업하고 있는 파일들인 경우, 불필요한 파일들이 많이 누적되게 되고 날짜와 파일명, 확장자 조건에 따라 자동으로 관리가 되도록 하면 구글 드라이브를 관리하는 시간이 많이 줄어듭니다. 예를 들어 DB 백업 파일을 구글 드라이브에 백업하는 경우 "1달 이상
12 min read
자바스크립트

[javascript] 다크모드 토글 기능 구현과 다크모드 토글 디자인 구현

웹페이지, 또는 사이트에 적용하는 다크 모드는 구현하는 방법이 여러 가지 있습니다. CSS 속성을 기준으로 구분하면 사용된 배경색과 전경(글자) 색들을 바꾸기만 하는 간단한 구현이기 때문에 어떤 방법을 사용해도 무방합니다. CSS 클래스로 구현 다크모드 구현은 다크 모드용 컬러 CSS 클래스를 정의한 후 자바스크립트로 , 또는 태그에 다크 모드용 클래스를 추가하거나 삭제하는 방식으로
16 min read
자바스크립트

ES6로 기초부터 다시 배우는 자바스크립트 파워북

이북과 인쇄 단행본으로 판매되고 있습니다.(하단 링크 참조) 자바스크립트 기초책이며, 블로그에 강의했던 내용들을 여러가지 보강해서 단행본으로 출간한 것입니다. 자바스크립트 입문자를 위한 학습서로, ES6 기초부터 DOM에 대한 이해까지 할 수 있습니다. 300개 이상의 기초 예제를 통해 자바스크립트 실력을 키울 수 있습니다. 실무 프로젝트에서 가져 온 다양한 실전 예제를 통해 실무 중심의
8 min read
자바스크립트

[javascript] 무한 롤링 이미지 배너 구현 - 2. 앞뒤 이동 버튼 구현