>웹 프론트엔드 >JS 튜토리얼 >f주 #DaysOfCode: JavaScript 기초 익히기, 블랙잭 게임 만들기, 첫 번째 Chrome 확장 프로그램!

f주 #DaysOfCode: JavaScript 기초 익히기, 블랙잭 게임 만들기, 첫 번째 Chrome 확장 프로그램!

Susan Sarandon
Susan Sarandon원래의
2024-11-04 13:14:29407검색

Week f #DaysOfCode: Mastering JavaScript Fundamentals, Building a Blackjack Game, and My First Chrome Extension!

5주차를 되돌아보시나요?

이번 주 #100DaysOfCode 챌린지는 중요한 목표, 챌린지, 수많은 JavaScript로 가득 차 있었습니다! 간단한 블랙잭 게임 구축부터 Chrome 확장 프로그램 배포에 이르기까지 JavaScript 기본 사항을 이해하고 적용하는 데 상당한 진전을 이루었습니다. 다음은 매일의 분석과 그 과정에서 제가 배운 내용입니다.


30일차: 대화형 앱을 위한 JavaScript 필수 사항 ?

저는 기본 JavaScript 개념을 살펴보며 한 주를 시작했습니다.

  • 스크립트 태그와 JavaScript 삽입에서의 역할
  • 기본 변수, 숫자, 문자열, 선언 및 작업 방법 이해
  • 디버깅과 모니터링을 위해 console.log()로 데이터 출력하는 연습을 했습니다.
  • 함수를 살펴보고 재사용을 위해 논리를 캡슐화하는 방법을 살펴보았습니다.
  • 사용자 상호 작용에 대한 흥미로운 가능성을 열어준 DOM(Document Object Model)을 살펴보았습니다.
  • HTML 요소를 선택하고 조작하기 위한 getElementById()innerText/textContent

이러한 기술은 DOM 조작 및 기본 JavaScript 기능에 대한 이해도를 테스트하는 프로젝트인 승객 카운터 앱을 구축하여 적용하기로 결정했을 때 유용했습니다.


31일차: JavaScript로 블랙잭 게임을 ?

31일차에는 블랙잭 게임 제작을 시작했습니다! 특히 승패 조건을 확인하는 등 게임 흐름을 관리하기 위해 if-else 문에 중점을 두었습니다. 조건부 논리를 사용하여 역동적인 게임플레이를 만드는 것은 도전적이면서도 흥미로웠습니다. 기본적인 규칙과 조건으로 게임을 구성함으로써 애플리케이션의 흐름을 관리하는 방법에 대해 더 깊은 이해를 얻었습니다.


32일차: 배열 작업?

32일차에서는 JavaScript 배열에 중점을 두었습니다. 다음과 같은 방법으로 데이터 목록을 저장하고 관리하는 방법을 배웠습니다.

  • .push() 요소를 추가하려면
  • .pop()은 마지막 요소를 제거하고
  • .slice() 배열의 일부 작업에 사용됩니다.

이러한 도구는 필수적이며, 연습이 필요한 동안 어레이를 사용하여 데이터 관리를 효율적으로 만드는 방법을 알아보기 시작했습니다. 어레이는 강력한 리소스임이 입증되었으며 앞으로 어레이를 구현하게 되어 기쁩니다.


33일차: 루프, 무작위성 및 개체 탐색 ?

33일차에는 루프, 난수 생성, 객체가 하이라이트였습니다. 제가 연습한 내용은 다음과 같습니다.

  • For 루프 데이터 반복
  • Math.random() 난수를 생성하고 예측 불가능한 요소를 추가합니다.
  • 객체를 만들고 작업하여 데이터를 정리합니다.

이러한 각 기술은 블랙잭 게임을 구축하는 데 매우 중요했습니다. 이 프로세스를 통해 루프와 임의성이 매력적이고 역동적인 애플리케이션을 만드는 방법과 개체가 복잡한 정보를 관리 가능한 방식으로 구성하는 방법을 확인하는 데 도움이 되었습니다.


34일차: 블랙잭 게임 완료! ?

34일차에 블랙잭 게임이 완성되었습니다! 이 프로젝트는 조건부, 루프, 사용자 상호 작용과 같은 개념을 확고히 하는 데 도움이 되었습니다. 모두가 함께하는 모습을 보니 보람도 있고 엄청난 성취감을 느꼈습니다. 이 게임은 기능적일 뿐만 아니라 개발자로서의 저의 성장을 상징합니다.


35일차: 기초 강화?

오늘은 일주일 동안 배운 모든 것을 연습하는 시간을 가졌습니다. 루프, 객체, 배열을 다시 살펴보면서 이해를 강화하고 코드를 더욱 깔끔하고 효율적으로 만들 수 있었습니다. 반복은 학습의 핵심이며, 오늘은 JavaScript 필수 요소에 대한 이해를 심화하는 데 매우 중요했습니다.


36일차: 첫 번째 Chrome 확장 프로그램 만들기! ?

Chrome 확장 프로그램 프로젝트를 시작하며 한 주를 마감했습니다. 다음과 같은 사실을 알게 되면서 이는 매우 흥미로운 변화였습니다.

  • 이벤트 리스너 작업을 트리거하고
  • 로컬 저장소 브라우저에 직접 데이터를 저장하는
  • 동적 HTML을 생성하기 위한 템플릿 리터럴

확장 프로그램을 통해 JavaScript가 실시간으로 살아나는 것을 보는 것은 환상적인 경험이었습니다. JavaScript가 얼마나 강력한지 알게 되었고, 이 프로젝트를 계속 개발하게 되어 기쁩니다!


도전과 발전

이번 주에는 특히 배열과 객체로 작업할 때 JavaScript 메서드 관련 문제에 직면했습니다. 데이터 구조가 상호 작용하는 방식을 이해하고 방법을 효과적으로 사용하려면 인내와 연습이 필요했습니다. 하지만 하루하루가 작은 승리를 가져왔고, 문제를 해결하는 과정을 통해 문제 해결 능력이 강화되었습니다.


내 GitHub 저장소에서 내 진행 상황과 해당 프로젝트의 코드를 확인하고 X @Toptech5419에서 매일 업데이트를 확인하세요!

#100DaysOfCode를 통해 계속해서 개발자로서 성장해 나가겠습니다!

위 내용은 f주 #DaysOfCode: JavaScript 기초 익히기, 블랙잭 게임 만들기, 첫 번째 Chrome 확장 프로그램!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.