오늘도 삽질

JavaScript

[JavaScript] 승부차기 게임 만들기 - 2

저번에 레이아웃 구성에 이어서 스크립트를 보자. 구현은 JavaScript 기본적인 문법을 익히기 위해서 사용했다.. 중간중간 코드가너무길어지는 경우에는 jQuery를 이용하기도 했다. 우선 사용된 오브젝트와 배열을 보자. JavaScript 1234567891011121314var korea = { score : 0, percent : 0.75};var japen = { score : 0, percent : 0.7};var soccerGame = { jpScoreNumber: 5, krScoreNumber: 5} var krTeam = ["손흥민","조현우","황희찬","이승우","박지성"];cs korea 오브젝트에 스코어에 초기 값인 0 을 줬다. 슛을 눌렀을 때 한국의 슛 성공 확률은 0.75% ..

JavaScript

[JavaScript] 승부차기 게임 만들기

이번 아시안 게임에서 한일전이 한번 나오지 않을까 하는 마음에 승부차기 게임을 만들었다. 순서대로 슛을 쏘아서 스코어를 갱신.마지막엔 스코어를 비교해서 3가지의 결과를 도출하는 게임이다. 팀은 한국과 일본이며우선 구조부터 보자. HTML 123456789101112131415161718192021222324252627282930313233343536 한국 남은슛 5 번 일본 남은슛 5 번 한국0 0일본 Shoot 버튼을 클릭해서 진행합니다. 한국 Shoot 일본 Shoot Colored by Color Scriptercs 구성은 간단하다. 아래에 슛버튼을 누를수있는 컨트롤 패널이 있으며 위에는 스코어가 표시될 점수 , 남은슛 횟수 , 아래에 상황을보여줄 상황판이 있다. 그리고 자세히 보면 컨트롤 패널에 ..

JavaScript/Es6

ES6 에서 변수 선언 let

기존에 사용하던 var는 선언문의 생략 또는 중복된 변수명으로 선언이 가능하고 함수를 끌어올리는 것 등 가독성이 떨어졌다.const ,let은 이런 점을 보완했다. var는 함수 블록에서 스코프가 설정된다. 그 외 블록에서는 스코프가 설정되지 않는다.* 스코프는 변수 또는 함수의 접근 가능한 범위를 의미한다. 1. var의 스코프 설정 123456var a = 300;function f(){ var a = 600; console.log(a); // 여기서 a 의 값은 600}console.log(a) // 여기서 a의 값은 300cs위의 예제를 보면 같은 변수 a 를 선언하고 있는데 함수 안에서 와 밖은 다른 스코프가 설정이 되어 값이 다른 걸 확인 할 수 있습니다. 2. var 블록에서 스코프 1234..