반지름이 서로 다른 두 원의 충돌여부를 확인하는 JavaScript 함수 예시이다. 이 함수는 두 원의 중심 간 거리와 반지름 길이를 계산하여 충돌 여부를 판단한다. function checkCollision(x1, y1, r1, x2, y2, r2) { // 두 원의 중심 간 거리 계산 var distance = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2)); // 두 원의 반지름 길이 합 계산 var radiusSum = r1 + r2; // 두 원이 충돌한 경우 if (distance < radiusSum) { return true; } // 두 원이 충돌하지 않은 경우 return false; } 두 원의 중심 좌표와 반지름 길이를 매개변수로 받..

at() 메서드는 ES2021(ES12라고도 함)에 도입된 비교적 새로운 JavaScript 추가 기능이다. String 및 Array 클래스의 인스턴스에서 사용할 수 있는 메서드이며 간결하고 읽기 쉬운 방식으로 지정된 인덱스에서 요소를 검색할 수 있다. at() 메서드를 사용하기 위한 기본 구문은 아래와 같다. // For a string: string.at(index); // For an array: array.at(index); 두 경우 모두 index는 검색하려는 요소의 인덱스이다. at() 메서드의 주요 이점 중 하나는 대괄호 표기법([])을 사용하는 것보다 문자열이나 배열에서 요소를 검색하는 더 간결하고 읽기 쉬운 방법을 제공한다는 것이다. 예를 들어 인덱싱을 사용하여 배열의 세 번째 요소를 ..

Intl.DateTimeFormat으로 날짜 포멧 바꾸기 Intl.DateTimeFormat은 로케일 지역에 따라 날짜와 시간의 포멧을 쉽게 변경해 준다. 로케일(locale) 지정하기 const date = new Date('2022-10-25 19:30:00'); new Intl.DateTimeFormat('en-US').format(date); new Intl.DateTimeFormat('ko-KR').format(date); new Intl.DateTimeFormat('ja-JP').format(date); 위와 같이 Intl.DateTimeFormat의 인자로 원하는 로케일 지역을 지정하고, format 메소드로 변경할 날짜를 Date 형식으로 전달하면 아래와 같이 로케일 지역에 따라 날짜 형식..

배열을 하나의 문자열로 만들거나 문자열을 배열로 나누기 join() 배열의 모든 값들을 구분자를 이용하여 하나의 문자열로 만들때 join()을 사용한다. const fruits = ['🍉', '🍌', '🍓', '🍈']; const result = fruits.join('-'); console.log(result); // '🍉-🍌-🍓-🍈' 만약 구분자를 따로 지정하지 않으면 ,를 구분자로 사용하게 된다. const fruits = ['🍉', '🍌', '🍓', '🍈']; const result = fruits.join(); console.log(result); // '🍉,🍌,🍓,🍈' split() join()과 반대로 문자열을 배열로 나누기 위해서는 split()를 사용하면 된다. split()은 구분자를 ..
- Total
- Today
- Yesterday
- Gulp.js
- gulp-sass
- gulp-ejs
- websquare
- JS
- oocss
- gulp-autoprefixer
- gulp
- 컨테이너쿼리
- docker desktop
- at()
- CSS 우선순위
- 객체지향CSS
- 도커설치
- Container queries
- CSS Level 4
- CSS방법론
- CSS
- JS Function
- 도커
- Intl API
- Internationalization API
- Object Oriented CSS
- javascript
- gulp task
- gulp비동기
- smacss
- 웹스퀘어
- browser-sync
- CSS선택자
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |