자바스크립트14 [JavaScript] 브라우저에서 동작하는 지뢰찾기 만들기 - 기본편 간단한 지뢰찾기 게임입니다. 아래 코드 복사하시고 IDE가 제공하는 웹서버로 실행해보시면 바로 작동합니다. 유저가 승리하는 경우는 아직 구현 못했으며 깃발 표시기능은 구현하였습니다. 감사합니다. 2023. 9. 22. [JavaScript] 브라우저에서 동작하는 오목게임 만들기 - 실전편 https://stickode.tistory.com/912 저번글은 기본 기능만 있는 오목이었습니다. 이번엔 여러 기능을 더 추가해보겠습니다. 게임 초기화 취소 요청 Player Black Player White 점수: 0 0 취소 요청: 0 0 취소 사용: 0 0 2023. 9. 10. [ JavaScript ] Lodash 라이브러리 사용해보기. 안녕하세요, 오늘은 Lodash 라는 라이브러리를 사용해보겠습니다. Lodash는 자바스크립트 라이브러리로 객체, 배열 등의 데이터의 구조를 쉽게 변환하여 사용하게끔 도와주며, _ 라는 기호를 사용하여 lodash 라고 라이브러리명이 지어진 것 같습니다. 데이터를 다룰 때 복잡한 자바스크립트 코드 대신에 이 라이브러리를 사용함으로써 좀더 효율적인 코드를 작성할 수 있게 됩니다. 설치방법 : - CDN 사용 https://www.jsdelivr.com/package/npm/lodash - npm 사용 npm install --save lodash 먼저 간단한 예제를 통해 Lodash 라이브러리를 사용해보겠습니다. 다음은 fruits 라는 배열에서 값이 '복숭아'인 요소를 제거한 후 나머지 요소들을 출력하는.. 2022. 12. 2. [JavaScript] 현재시각 표시하기 안녕하세요, 오늘은 자바스크립트의 toLocaleTimeString() 메소드를 사용해서 현재 시각을 표시해보겠습니다. toLocaleTimeString() 은 Date 객체의 날짜의 시간 부분을 지역에 맞는 언어 포맷으로 반환하는 메소드입니다. 구현된 예제 시연 화면은 다음과 같습니다. 다음은 예제 전체 코드입니다. 2022. 10. 18. [Javascript] 작업 시간 측정하기 오늘은 두 가지 방법으로 Javascript에서 작업시간을 측정해보겠습니다. 첫번째 방법은 performance.now() 를 사용하는 방법입니다. 예시 코드입니다. let startTime = performance.now(); // 측정 시작 console.log('측정 시작.'); let sum = 0; for (let i = 1; i 2022. 8. 5. [JavaScript] find 함수에 대해 알아보고 네이버지도 api 에서 사용해보기 안녕하세요. 오늘은 자바스크립트의 find 함수에 대해 알아보고 네이버지도 api 에서 사용해보겠습니다. find() 함수는 배열 내에서 조건을 만족하는 첫번째 요소의 값을 찾아서 반환하는 함수입니다. 조건을 만족하는 요소가 없다면 undefined 를 반환합니다. find 함수의 구문은 아래와 같습니다. arr.find(callbackFunction(element, index, array), thisArg) find 함수의 매개변수는 callbackFunction, 그리고 thisArg 입니다. callbackFunction 에는 3개의 매개변수를 사용할 수 있습니다. - element : 현재 요소 (필수) - index : 요소의 인덱스 (선택) - array : find 함수를 호출한 배열 (선택.. 2022. 7. 21. [Javascript] 네이버 지도 api를 사용해서 지도 표시 및 마커 찍기 오늘은 네이버 지도 api 를 사용해서 지도를 띄우고 마커를 찍어보겠습니다. 먼저 네이버 클라우드 플랫폼의 Maps 서비스 페이지에 들어가서 로그인을 한 뒤, '이용 신청하기' 버튼을 클릭합니다. https://www.ncloud.com/product/applicationService/maps NAVER CLOUD PLATFORM cloud computing services for corporations, IaaS, PaaS, SaaS, with Global region and Security Technology Certification www.ncloud.com Application 등록을 누르면 Application 이름을 설정하고, Service 선택 및 서비스 환경 등록하는 페이지로 이동합니다... 2022. 7. 6. [Javascript] Video.js 사용해서 동영상 재생하기 Video.js 는 오픈소스 HTML5 비디오 플레이어입니다. https://videojs.com/ Video.js - Make your player yours Make your player yours with the internet's most popular open source video player framework videojs.com 오늘은 Video.js 를 사용해서 동영상을 재생하고 오디오/비디오 토글기능 및 재생속도 변경기능을 구현해보겠습니다. 다음은 전체 시연 영상입니다. 먼저 To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video 오디오만 재생 .. 2022. 6. 23. [Javascript] filter 함수 사용하기 안녕하세요. 자바스크립트의 filter 함수를 사용해보겠습니다. filter() 함수는 배열의 요소들 중에서 조건에 부합하는 모든 요소를 모아서 새로운 배열로 반환하는 함수입니다. filter 함수의 구문은 아래와 같습니다. const newArray = arr.filter(callbackFunction(element, index, array), thisArg); filter 함수의 매개변수는 callbackFunction, 그리고 thisArg 입니다. callbackFunction 에는 3개의 매개변수를 사용할 수 있습니다. - element : 현재 요소 (필수) - index : 요소의 인덱스 (선택) - array : filter 함수를 호출한 배열 (선택) thisArg는 callback을 실.. 2022. 6. 21. 이전 1 2 다음
