반응형

코딩 공부/JAVASCRIPT 53

퀴즈(Quiz) 사이트를 만들어봅시다!

자바스크립트 퀴즈(Quiz) 사이트 만들기 아래에 있는 사진과 같이 퀴즈를 풀 수 있는 사이트를 만들어 보겠습니다! 직접 만들어 본 퀴즈 사이트 코드 Quiz 정답 확인하기 유형 . 정답 확인하기 연변대비 script 코드 수업 시간에 배운 변수 부분을 활용해보았습니다. const 변수를 선언해주고 선택자, 문제 정보를 만들어주었습니다. 참고 quizWrap, quizTitle, quizTime 등 처럼 중간에 대문자로 적어주어야한다. 문제 출력은 변수와 .innerText를 써서 문제를 출력하여줍니다. 정답 부분은 정답을 클릭하면 나타날 수 있게 quizAnswerResult.style.display = "none"; 을 써서 정답을 숨겨주었습니다. 이렇게 정답 확인하기를 클릭하면 바로 정답이 나옵니다..

데이터 불러오기 정리를 해보자!

데이터 불러오기 자바스크립트에서 데이터를 불러오는 종류를 알아봅시다. 변수 : 데이터 불러오기 상수 : 데이터 불러오기 배열 : 데이터 불러오기 객체 : 데이터 불러오기 01. 변수 : 데이터 불러오기 변수 안에 저장된 데이터를 불러오는 방법입니다. { let x = 100, y = 200, z = "javascript"; console.log(x, y, z); } 😎결과 확인하기 100 200 javascript 02. 상수 : 데이터 불러오기 상수 안에 저장된 데이터를 불러오는 방법입니다. { const x = 100, y = 200, z = "javascript"; console.log(x, y, z); } 😎결과 확인하기 100 200 javascript 03. 배열 : 데이터 불러오기 : 기본 ..

forEach(), for of, for in, map()을 알아보자

새롭게 배운 배열 데이터 불러오기 배열은 인덱스를 가지는 복수의 자료를 저장할 수 있는 자료구조 입니다. 데이터는 순차적으로 저장되며 중복이 가능합니다. 저장된 데이터에는 인덱스를 이용하여 접근이 가능합니다. 자바스크립트에서 배열의 사용법을 알아보겠습다. 01. 배열 : 데이터 불러오기 : forEach() forEach문을 사용해 배열값을 실행하는 방법입니다. { const num =[100,200,300,400,500]; num.forEach(function(element){ document.write(element); }); } // 결과 : 100 200 300 400 500 forEach forEach 메서드도 배열을 순회하기 위해 사용되지만, 기본적인 for 반복문과는 다른 방식으로 함수를 사..

지금까지 배운 모든 함수(function) 정리하기!

자바스크립트 함수(function) 함수(function)란 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록을 의미합니다. 이러한 함수는 필요할 때마다 호출하여 해당 작업을 반복해서 수행할 수 있습니다. 자바스크립트에서는 함수도 하나의 타입(datatype)입니다. 따라서 함수를 변수에 대입하거나, 함수에 프로퍼티를 지정하는 것도 가능합니다. 또한, 자바스크립트 함수는 다른 함수 내에 중첩되어 정의될 수도 있습니다. 함수 정의 자바스크립트에서 함수의 정의는 function 키워드로 시작되며, 다음과 같은 구성요소를 가집니다. 1. 함수의 이름 2. 괄호 안에 쉼표(,)로 구분되는 함수의 매개변수(parameter) 3. 중괄호({})로 둘러싸인 자바스크립트 실행문 자바스크립트에서 함수를 정의..

자바스크립트 마무리 문제(2)

자바스크립트 마무리 문제 모던 자바스크립트 프로그래밍의 정석 155,156 페이지 마무리 문제를 풀어보자! 마무리 문제 1 사용자가 프롬프트 창에 숫자를 입력했을 때 그 숫자를 함수로 넘겨주고, 함수에서는 숫자가 양수인지, 음수인지, 또는 0인지 판단해서 알림 창에 보여 주는 프로그램을 작성해 보세요. let num = parseInt(prompt("숫자를 입력하세요.")); function func(num){ if(num>0){ document.write(num + "은(는) 양수입니다."); } else if(num num2 ? num1 : num2; let GCD = 0; for(let i=1; i

조건문 (데이터 제어하는 방법)을 알아보자!

조건문(conditional statements) 조건문이란 프로그램 내에서 주어진 표현식의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문입니다. 조건문 중에서 가장 기본이 되는 실행문은 if 문입니다. 조건문은 프로그래밍에서 가장 기본적인 구문 중 하나입니다. 조건문을 사용하면 프로그램이 특정 조건에 따라서 다른 동작을 하도록 할 수 있습니다. 데이터 제어하기 자바스크립트에서 데이터를 제어하는 종류에는 if문 if문 생략 삼항 연산자 다중 if문 중첩 if문 switch문 while문 do while문 for문 중첩 for문 continue문 break문 이 있습니다. 01. if문 if 문은 표현식의 결과가 참(true)이면 주어진 실행문을 실행하며, 거짓(false)이면 아무것도 실행하지 않..

함수에 대해서 알아보자!

함수(Function) 함수는 프로그램에서 반복적으로 사용되는 기능을 만들어 내기 위한 코드들의 집합입니다. 함수는 JavaScript에서 기본 구성 요소 중 하나입니다. JavaScript의 함수는 작업을 수행하거나 값을 계산하는 명령문의 집합인 프로시저(procedure)와 비슷하지만, 프로시저가 함수로 쓰이려면 입력을 반드시 받아야 하고 입력과 명확한 관계가 있는 출력을 반환해야 합니다. JavaScript 함수의 특징 함수는 Function 객체이다. 함수도 하나의 데이터타입이다. 따라서 함수를 변수에 대입하거나 프로퍼티 지정하는 것이 가능하다. 기본적으로 함수는 undefined를 반환한다. 다른 값을 반환하기 위해서는, 함수는 반환값을 지정하는 return 문이 있어야 한다. 다른 함수 내에 ..

데이터 저장과 표현 방법

데이터 저장 javascript에서 데이터를 저장하는 방법은 변수, 상수, 배열, 객체가 있습니다. 이 4가지를 한번 알아보겠습니다. 변수 변수는 데이터를 하나만 저장할 수 있다. 변수는 데이터를 변경 할 수 있다. 변수는 데이터를 하나만 저장하지만 추가도 가능하다. 상수 상수는 데이터를 하나만 저장할 수 있다. 상수는 데이터 변경을 할 수 없다. 배열 배열은 데이터를 순서대로 여러개 저장할 수 있다. 객체 객체는 데이터를 여러개 저장할 수 있다. 객체는 저장한 데이터의 키와 값을 저장할 수 있다.

자바스크립트 마무리 문제(1)

자바스크립트 마무리 문제 모던 자바스크립트 프로그래밍의 정석 113 페이지 마무리 문제를 풀어보자! 마무리 문제 1 : 주어진 배열 : [1, 3, 5, 7, 9, 11 ,13, 15, 17, 19] const arr = [1, 3, 5, 7, 9, 11, 13, 15, 17, 19] for(let i=0; i 10){// if 문을 사용해서 arr[i] 값과 10을 비교한다. document.write(arr[i] + " "); } } // 결과 : 11 13 15 17 19 길라잡이 배열 요소의 개수만큼 for 문을 반복합니다. if 문을 사용해서 요소의 값과 10을 비교합니다. document.write 문을 사용해서 화면에 표시합니다. 마무리 문제 2 : < 주어..

조건문에 대해서 알아보자

조건문 자바스크립트 if 조건문은 조건식이 참일 경우 코드가 실행됩니다. if else 조건문은 조건식이 참/거짓일 경우 각각 실행 코드를 지정할 수 있습니다. if else if 조건문은 두 개 이상의 조건식을 설정할 수 있습니다. 01. if 문 조건문 중 가장 유명하고 대표적인 조건문은 if 문입니다. if 문의 기본 문법은 다음과 같습니다. 자바스크립트 if 조건문은 if ( 조건식 ) 영역이 참이면, { } 코드 블록 사이의 실행문을 1회 실행합니다. if ( 조건식 ) 영역이 거짓이면, if문을 탈출합니다. 입력받은 숫자가 0보다 크거나 같으면, '양수'를 출력하는 if 조건문입니다. prompt() 함수는 자바스크립트에서 사용자로부터 데이터를 입력받을 수 있는 간단한 함수로써 사용 방법은 하..

728x90
Adventure Time - BMO