My Melody Kawaii

JAVASCRIPT 46

자바스크립트 오답노트

오답 노트 자바스크립트 20문제 중 틀린 문제 오답노트를 작성했습니다. 01. 결과값을 작성하세요 { if( null ){ console.log("true"); } else { console.log("false"); } } 정답 노트 false (0,null,undefined,false)는 flase의 값이 나옵니다. 02. 결과값을 작성하세요 { let num = 0; while( num 6 ){ break; } console.log(num); } } 오답 노트 while은 반복문 입니다. 반복문이 ture일 때 실행이 됩니다. num ++ 로 num이 1이 되면 조건문에 만족하지 않아서 1이 출력되고 다시 반복문으로 돌아가서 num++로 num의 값이 2가 되는데 조건문에 만족하는 조건이 아니므로 그..

퀴즈 사이트 만들기 (2)

퀴즈 이펙트 저번 시간에 강아지가 등장해서 정답을 클릭하면 알려주는 사이트를 만들어 보았습니다. 오늘은 정답을 직접 입력해서 정답이면 강아지가 웃는표정을 오답이면 실망하는 표정을 나타내보도록 하겠습니다. HTML 코드 Quiz 주관식 확인하기 유형 1 2 . 정답확인하기 설명 jeongyouna_@naver.com HTML 들여다보기 저번 시간에 썼던 HTML코드를 복사 붙이기로 가져왔습니다. Script를 사용해서 내용을 출력해 줍니다. 문제 정보에 대해 작성해 준 후 선택자를 묶어준 태그들을 저번시간과 같이 queryselector를 주고 괄호로 . 을 써서 class명을 써줍니다. 저번 시간에는 innerText를 썼지만 오늘은 textContent를 사용해 줍니다. textContent는 HTMl..

퀴즈 사이트를 만들어보자!

퀴즈 이펙트 HTML과 CSS를 이용해 퀴즈를 풀 수 있는 사이트를 만들어보았습니다. 먼저 비주얼코드로 가서 javascript폴더 안에 card폴더를 만들어 줍니다. 그리고 quizEffext html 파일을 만들어줘서 실행시켜 줍니다. HTML Quiz 정답 확인하기 유형 . 정답확인하기 jeongyouna_@naver.com HTML 들여다보기 퀴즈 이펙트라는 타이틀을 만들어 준후 코드가 지저분해지지 않게 link를 사용해서 reset과 css파일을 만들어줍니다. header, main, footer로 나누어 전체적인 body를 잡아줍니다. CSS로 묶어 줄 수 있게 quize wrap, tittle, question,view,answer로 요소들로 묶어줍니다. CSS에서 각 요소들에게 효과를 준 ..

데이터 불러오는 방법을 알아보자!

데이터 불러오는 방법 저번 시간에 데이터를 불러올 수 있는 방법으로 for문과 forEach문 그리고 for in, for of, map()을 살펴 보았습니다. 오늘은 forEach문과 map()문을 생략하여 사용해서 짧게 만드는 방법과 또 다른 배열 실행문 그리고 객체 실행문에 대해서 더 알아보도록 하겠습니다! forEach문 생략 let arr = [10,20,30,40,50,60,70,80,90]; arr.forEach(function(element){ document.write(element); }); //forEach (화살표 함수) arr.forEach((element)=>{ document.write(element); }); forEach (변수 el 괄호 생략) arr.forEach(el=..

JAVASCRIPT 2023.03.06

데이터 저장하기 좀 더 파헤쳐보자!

변수와 상수 변수 변수(variable)란 데이터를 저장하기 위해 프로그램에 의해 이름을 할당받은 메모리 공간을 의미합니다. 즉 변수란 어떠한 값을 저장할 수 있는 저장하기 위한 이름을 가진 공간을 의미하며 변수는 변수라는 이름 그대로 가지고 있는 값에서 다른 값으로 덮어 씌워지며 변할 수 있으며 연산을 하여 값들이 추가될 수도 있습니다. 변수의 종류의 데이터 타입에는 자연수, 실수, 문자 등 각기 다른 종류의 값들 저장할 수 있는 변수의 종류들이 있으며 특수문자까지 저장할 수 있습니다. { var x = 100; var y = 200; var z = "javascript"; console.log(x); console.log(y); console.log(z); } { let x = 100; let y =..

JAVASCRIPT 2023.03.04

자바스크립트 문제 오답노트

✏️자바스크립트 오답 노트 자바스크립트 시험에서 틀린 문제들을 오답노트로 정리했습니다. 01.다음의 출력값을 보고 빈칸을 채우시오 { var x = 100; var y = 200; var z = "javascript"; console.log(__); console.log(__); console.log(__); //100 //200 //300 } 정답 x, y , x+y 02.다음의 출력값을 보고 빈칸을 채우시오 { let x = 100; let y = 200; let z = "javascript"; x = ___; y = ___; z = ___; console.log(x); console.log(y); console.log(z); //300 //400 //jquery } 오답풀이 x=200; y=400;..

함수를 이용해서 함께 문제를 풀어봐요!

문제 01. 숫자를 함수로 넘겨주고, 숫자에서 양수,음수,0 판단하기 사용자가 프롬포트 창에 숫자를 입렸했을 때 그 숫자를 함수로 넘겨주고, 함수에서는 숫자가 양수인지,음수인지, 또는 0인지 판단해서 알림창에 보여주는 프로그램을 작성하는 문제입니다. 숫자를 받아서 양수,음수,0을 판단하고 알림 창에 표시하는 함수를 선언합니다. parselnt()함수를 사용해 프롬프트 창에 입력한 내용을 숫자로 변환합니다. 프롬포트 창에 입력한 내용이 숫자가 아니면 parselnt() 함수는 NaN로 변환합니다. 반환 값이 숫자일 경우에만 함수를 실행 합니다. function isPositive(n) { if (n > 0) { alert(`${n}은 양수입니다.`); //매개 변수 함수를 이용해서 if문을 실행함 } el..

자바스크립트, 제어문은 무엇으로 이루어져 있을까?

제어문 제어문이란 프로그램에서 필요한 결과 값을 도출하기 위해 실행문의 순서를 제어하거나 반복시키는 문장을 말합니다. 제어문은 크게 조건문,반복문,중지,건너뛰기의 분류로 나눌 수 있습니다. 저번에 살펴 보았던 제어문과 더불어 새롭게 추가된 제어문에 대해서 함께 알아보도록 해요! 분류 제어문 조건문 if, swich 반복문 while, do while, for 중지,건너뛰기 break,continue 01. 조건문 if문 가장 기본적인 사용하는 조건문으로 주어진 조건이 참일 경우에만 코드 블록이 실행할 수 있습니다. if(조건식){ document.write("실행되었습니다.(ture)"); //조건식을 쓴 후 실행문을 써줘야 합니다. } if문 생략 기본 if 문을 생략해서 쓸 수 있습니다. //기본 i..

JAVASCRIPT 2023.02.28

함수의 종류는 무엇이 있을까요?

함수란? 자바스크립트 프로그램은 단순히 하나의 동작이 아닌 여러가지 동작이 연결되어 실행을 합니다. 동작해야 할 목적대로 여러 개의 명령을 묶는 것을 '함수'라고 합니다. 소스를 함수로 분리해 놓으면 필요할 때마다 원하는 기능만 따로 실행 할 수 있고, 같은 기능이 필요한 다른곳에서 다시 사용 할 수 있습니다. 그러므로 복잡하게 처리할 기능이 많다면 기능별로 나누기 좋은 아주 효과적인 방법입니다. 처음에는 어색할 수 있는 단어겠지만 잘 외워 두신다면 자바스크립트를 할 때 유용하게 사용하실 수 있습니다! 그러면 함수의 종류를 살펴 보도록 하겠습니다. 01. 선언적 함수 function func (){ //function이라는 예약어를 사용하고 함수 이름을 적고 소괄호와 중괄호를 적습니다. document...

JAVASCRIPT 2023.02.27

자바스크립트, 데이터 저장하는 방법

자바스크립트에 데이터 저장하는 법은 변수,상수,배열,객체를 이용해서 저장할 수 있는 저장할 수 있는 방법이 있습니다. 숫자로 기재할 때는 ; 로 표시해주고 문자열로 표시해 줄때는 ""로 표시해줍니다. 01.변수: 데이터 저장 변수는 데이터를 저장하는 저장소입니다. x= 100, y=200, z="javascript"로 데이터를 저장하게 됩니다. 02.변수: 데이터 저장 + 데이터 변경 변수는 데이터를 저장할 수도 있지만 변경도 가능합니다. x=100에서 300으로 변경, y=200에서 200 그대로 z="javascript"에서 "react"로 데이터가 변경 되었습니다. 03.변수: 데이터 저장 + 데이터 변경 +데이터 추가 변수는 데이터를 저장할 수도 있지만 변경도 추가도 가능합니다. :연산자를 이용하..

JAVASCRIPT 2023.02.26

자바스크립트 연산자와 제어문 문제를 풀어봤어요!

문제 01. 10보다 큰 숫자 찾기 주어진 배열을 for문과 조건문을 이용해서 10보다 큰 숫자를 찾아봅니다. 길라잡이 배열 요소의 개수만큼 for문을 반복합니다. if문을 사용해서 요소의 값과 10을 비교합니다. document.wirte문을 사용해서 화면에 표시합니다. const arr = [1,3,5,7,9,11,13,15,17,19] //배열의 값을 지정 해줍니다. for(let i=1; i10){ //조건문 if문을 이용해서 arr의 값을 선언 해줍니다. }document.write(arr[i]); } //result : 11,13,15,17,19 정리 값을 구할 때 반복문과 조건문을 사용해서 문제를 풀어줍니다. 문제 02. 1보다 큰 수를 입력하게 한 후 입력한 숫자를 짝수만 더하기 연산자와 ..

자바스크립트 조건문은 어떻게 사용할까?

조건문이란? 조건문은 명령을 실행하기 위해 조건을 체크하는 문(statement)입니다. 즉 조건에 따라 실행을 달라지게 할 수 있는 문장입니다. 프로그램 소스는 작성된 순서대로 실행되는 것이 아니라 조건에 따라 명령을 실행하는 경우가 많아서 조건문은 자주 사용하게 됩니다. 01. if문 먼저 if 조건문을 알아보겠습니다. if문은 if다음에 소괄호를 사용하여 조건을 표기합니다. 그리고 조건을 체크한 뒤 결과 값이 ture이면 if문에 있는 명령들이 false이면 if문에 있는 명령을 건너뛰고 그 다음 명령을 실행합니다. if 문이란 if예약어의 다음에 오는 중괄호로 묶은 명령을 가리킵니다. if (조건) { 조건이 true일 때 실행하는 명령(들) } 예를 들어 비가 온다라는 조건이 생성되었고 그것이 ..

JAVASCRIPT 2023.02.24

자바스크립트 반복문을 알고 있나요?

반복문 이란? 반복문은 같은 동작을 여러번 실행하기 위해 사용하는 것입니다. 반복문을 사용하게 된다면 불필요하게 여러 명령을 만들 필요 없이 반복 실행을 시킬 수 있습니다. 그만큼 소스도 깔끔해지고 실행도 빨라진답니다. 1. for문 자바스크립트에서 제일 많이 사용하는 for문은 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실행할 때 사용합니다. for 문에서는 몇 번 반복했는지 기록 하기 위해 카운터를 사용하고 for문으 첫 번째 항에서 카운터 변수를 지정합니다. 기본형 : ( 초깃갑; 조건; 증가식) {....} 여기서 초깃값은 몇번 반복할지 지정하기 위해 카운터 변수를 사용합니다. 초깃값은 0이나 1부터 시작합니다. 조건은 문장을 반복하기 위해 체크할 조건 부분입니다. 이 조건을 만족해야 f..

JAVASCRIPT 2023.02.23

프로그램이 처리하는 자료의 형태를 무엇이라고 할까?

컴퓨터가 프로그램을 처리할 때 숫자를 더하거나 빼고 문자열은 뺄 수 없다는 것을 따로 알려주어야 합니다. 이렇게 숫자나 문자열처럼 프로그램에서 처리할 자료의 유형을 지정해야 하는데, 이러한 자료의 형태를 '자료형'이라고 합니다. 자료형은 크게 '원시유형' 기본형 과 '객체'로 나뉘어집니다 표와 같이 원시형 기본형은 숫자열, 문자열, 논리형, 심벌이 있고 객체는 undefined,null (답이 존재하지 않는것) 이 존재합니다. 자료형을 자세히 보기전에 typeof()함수가 존재하는데 typeof()함수는 자바스크립트에 미리 만들어져 있는 함수로, 소괄호 안에 값이나 변수를 넣으면 어떤 자료형인지 알려줍니다. 01.숫자형 숫자형은 모든 프로그램에서 가장 기본이 되는 자료형입니다. 자바나 C언어에서 정수와 ..

JAVASCRIPT 2023.02.20