자바스크립트

· Javascript
데이터 타입은 크게 원시 타입과 객체 타입으로 구분한다. 왜 두가지로 분리할까? 이유는 원티 타입과 객체 타입이 근본적으로 다르기 때문이다. 3가지 측면에서 다르게 볼 수 있는데 원시 타입의 값, 즉 원시 값은 변경 불가능한 값이다. 객체(참조) 타입의 값, 즉 객체는 변경 가능한 값이다. 원시 값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장되는데, 이에 비해 객체를 변수에 할당하면 변수에 참조 값이 저장된다. 원시 값을 갖는 변수를 다른 변수에 할당시 원시 값이 복사되어 전달되고 이를 값에 의한 전달이라 한다. 이에 비해 객체를 가르키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달된다. 이를 참조에 의한 전달이라 한다. 원시 값 변경 불가능한 값 원시 타입의 값, 즉..
· Javascript
제어문은 프로그래밍을 함에 있어서 없어서는 안될 필수 내용이다. 제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행 할 때 사용한다. 일반적으로 코드는 위에서 부터 아래 방향으로 순차적으로 실행되는데 실행 흐름을 인위적으로 제어 할 수 있다. 하지만 자연스럽게 위에서 부터 아래로 순차적으로 실행되는 코드를 인위적으로 흐름을 변경하려는 순간 우리는 직관적인 코드의 흐름 해치기 때문에 가독성이 떨어지도록 만들 수 있다. 다시말해, 필요 이상의 제어문을 많이 사용한다면 코드의 가독성을 해치기 때문에 적당히 사용하는 것이 좋다. 제어문을 사용할 때 여러 고차 함수를 사용한 프로그래밍 기법들이 있지만 가장 기본적인 for 문을 알고 사용해야 고차 함수에서도 무리없이 사용이 가능한다. 블록문 블록문은 0개 이상..
· Javascript
제어문은 프로그래밍을 함에 있어서 없어서는 안될 필수 내용이다. 제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행 할 때 사용한다. 일반적으로 코드는 위에서 부터 아래 방향으로 순차적으로 실행되는데 실행 흐름을 인위적으로 제어 할 수 있다. 하지만 자연스럽게 위에서 부터 아래로 순차적으로 실행되는 코드를 인위적으로 흐름을 변경하려는 순간 우리는 직관적인 코드의 흐름 해치기 때문에 가독성이 떨어지도록 만들 수 있다. 다시말해, 필요 이상의 제어문을 많이 사용한다면 코드의 가독성을 해치기 때문에 적당히 사용하는 것이 좋다. 제어문을 사용할 때 여러 고차 함수를 사용한 프로그래밍 기법들이 있지만 가장 기본적인 for 문을 알고 사용해야 고차 함수에서도 무리없이 사용이 가능한다. 블록문 블록문은 0개 이상..
· Javascript
연산자는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산을 수행해 하나의 값을 만든다. 이때 연산의 대상자를 피연산자라고 한다. 피연산자는 값으로 평가될 수 있는 표현식 이어야 한다. // 산술 연산자 5 + 4 // 20 // 문자열 연결 연산자 'My name is ' + 'Song' // My name is Song // 할당 연산자 color = 'red' // 'red' // 비교 연산자 3 > 5 // false // 논리 연산자 true && false // false // 타입 연산자 typeof 'Hi' // string 피연산자가 값 이라는 명사의 역할을 한다면 연산자는 피연산자를 연산하..
· Javascript
종류 구분 데이터 타입 설명 원시 타입 Number 숫자를 나타내며, 정수와 실수 구분 없이 하나의 숫자 타입만 존재합니다. String 문자열을 나타내며, 문자의 시퀀스로 이루어져 있습니다. Boolean 논리적 값(true 또는 false)을 나타냅니다. Undefined 변수가 값 없이 선언되었을 때 기본적으로 할당되는 값입니다. Null 어떤 값이 의도적으로 비어있음을 나타냅니다. Symbol ES6에서 추가된 타입으로, 고유하고 수정 불가능한 데이터 타입으로 주로 객체 속성의 키로 사용됩니다. BigInt Number 타입으로 표현할 수 있는 범위를 넘어서는 큰 정수를 표현할 때 사용됩니다. ES2020에서 도입되었습니다. 객체 타입 Object 키와 값으로 구성된 속성들의 집합입니다. 배열, ..
· Effect
퀴즈 이펙트 - 객관식 (여러문제 슬라이드) 결과 확인하기 자바스크립트를 이용해 다중문제가 나오도록 설정하였고 for문, forEach문을 사용해 코드를 효과적으로 사용하였습니다 또한 문제를 풀고 정답 확인 버튼을 누르면 맞은 문제 갯수와 틀린문제 갯수를 출력하도록 하였습니다. 문제 출력하기 템플릿 리터럴을 사용하여 ${}속에 변수를 지정하였습니다. . 또한 각각 칸에 알맞게 변수명을 집어넣어 정보를 입력하였습니다. 문제출력코드 //문제출력 const quizQuestion = document.querySelector(".quiz__question"); //문제 번호, 질문 const quizSelects = document.querySelector(".quiz__selects") const quizTy..
· Effect
퀴즈 프로그램 객관식문제 자바스크립트를 이용해 다중문제가 나오도록 설정하였고 for문, forEach문을 사용해 코드를 효과적으로 사용하였습니다 자바스크립트 객관식문제 ▶우선 선택자를 정합니다.(각각 선택자가 무엇을 출력할지 정해주고 알맞는 이름을 써줘서 변수에 넣어준다.). ▶문제의 정보를 가져와서 각각의 정보들을 quizInfo 변수에 대입해서 넣어줍니다. ▶문제 출력을 담당하는 메서드와 보기를 출력하는 반복문을 updateQuiz라는 함수를 만들어서로 묶어주고 실행문을 적습니다. (한눈에 보기 쉽기 때문에 묶어줍니다.) ▶이전에는 사용자의 정답과 문제의 정답만 비교해서 확인하면 되었는데 객관식에서는 사용자가 선택한 답을 문제에 답과 비교해 주어야합니다. 위에서 quiz__selects 클래스를 만들..
songs
'자바스크립트' 태그의 글 목록