Study Record 썸네일형 리스트형 [JavaScript] 에러 해결하는 방법 (구문 오류, 런타임 오류, 논리 오류) * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2: 50) 에러는 다양하게 발생할 수 있다. 그중에서 가장 대표적인 에러를 해결할 수 있는 방법을 알아보자. 1. 구문 오류 IDE에서 잘못된 부분은 빨간 줄로 표시해주기 때문에 바로 해결할 수 있는 오류이다. 2. 런타임 에러 에러 메시지가 뜨는 경우이다. 이 경우는 비교적 쉽게 해결할 수 있는 편이다. 크롬의 개발자 도구 console 창에 뜨는 에러 메시지를 먼저 읽고 어떤 부분으로 인해 에러가 났는지 찾아보면 된다. 하지만 에러 메시지를 이해하지 못하겠거나 어떻게 해결해야 할지 모르겠을 때는 구글링을 통해 해결 방안을 찾아갈 수 있을 것이다. .. 더보기 [JavaScript] 스크립트 import 하는 방법에 대해 알아보기 - defer&async * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2: 50) 스크립트를 import 하는 방법에 따라서 스크립트를 실행하는 것과 HTML 코드가 구문 분석하는 등의 순서가 바뀌게 되어 웹페이지가 가장 효율적으로 빠르게 작동할 수 있도록 할 수 있다. 방법의 종류는 4가지가 있다. Inline External File External File - async External File - defer 즉시 실행, HTML 분석 및 렌더링을 차단 즉시 로드 및 실행, HTML 분석 및 렌더링 차단 즉시 로드, HTML 분석 및 렌더링 후 실행 HTML 분석 및 렌더링 후 즉시 로드 및 실행 이에 대해 자세히 .. 더보기 [JavaScript] undefined&null&NaN와 Typeof 연산자 * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2: 48~49) undefined, null, NaN은 비슷한 듯하지만 쓰임과 유형이 모두 다르다. 각각에 대해서 자세히 알아보자. undefined 초기화되지 않은 변수의 기본 값 (아무것도 없음을 나타내는 값) 변수를 생성한 후에 등호로 값을 할당하지 않거나 요소를 생성하지 않은 인덱스에서 배열 요소에 접근하려고 할 때 뜬다. 이때 주의해야 할 점은 undefined가 데이터 유형이긴 하지만 직접 값으로 할당하면 안 된다는 것이다. 그 이유는 값을 할당한 적이 없을 경우의 기본 값이기 때문이기 때문이다. 예시를 통해 알아보자. userName이라는.. 더보기 [JavaScript] 객체를 사용하는 재사용 가능한 함수 만들기 * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2: 47) 코드를 작성할 때는 재사용이 가능하도록 작성하는 것이 중요하다. function add(num1, num2) { const enteredNumber = getUserNumberInput(); const initialResult = currentResult; currentResult += enteredNumber; createAndWriteOutput("+", initialResult, enteredNumber); const logEntry = { operation: "ADD", prevResult: initialResult, number: .. 더보기 [JavaScript] 객체에 대해 알아보기 * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2 : 44~46) 객체란? 키-값으로 구조화된 그룹화된 데이터 데이터를 그룹화하는 데에 사용한다. 객체 생성 방법 const 객체 이름 = {키: 값, 키: 값, ... }; * 값은 어떤 것이든 가능하다. 문자열, 숫자, 배열, 다른 객체 등 사용 예시 코드 const logEntry = { operation: "ADD", prevResult: initialResult, number: enteredNumber, result: currentResult, }; 객체 사용 방법 객체 전체를 사용할 때 logEntries.push(logEntry); con.. 더보기 [JavaScript] 배열에 대해 알아보기 * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2 : 43) 배열이란? 모든 데이터 종류의 목록 (숫자, 문자열, 혼합 데이터 등) 개인 분석 서버 등에 데이터 목록을 저장을 하고자 할 때 사용 배열 생성 방법 let 배열 이름 = [데이터(선택)]; let logEntries = []; 배열 사용 방법 배열의 이름으로 사용할 수 있고 배열의 요소에 접근할 때는 배열의 이름[접근할 요소의 인덱스]을 통해 할 수 있다. logEntries.push(enteredNumber); console.log(logEntries[0]); 배열의 요소를 출력하게 되면 그 해당 인덱스 요소만 출력하므로 배열의 값을 .. 더보기 [JavaScript] 연산자와 데이터 타입 종류 (이어서) * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2: 41 ~42) 연산자 값을 조종할 수 있도록 해주는 JavaScript의 구문 기능 연산자의 종류 + : 곱하기 연산자 - : 빼기 연산자 * : 곱하기 연산자 / : 나누기 연산자 % : 나머지 연산자 ** : 거듭제곱 연산자 = : 할당 연산자 +=, -=, *=, /=, %= : 축약 연산자 ++, -- : 증감 연산자 ※ 증감 연산자는 붙이는 위치에 따라서 반환 값이 달라진다. ++변수와 변수++의 출력 값은 다름 📍 이전 글 참조 2022.06.15 - [Study Record/Javascript] - JavaScript 변수와 연산자 J.. 더보기 [JavaScript] 계산기 연산 버튼 함수 만들기 * 이 글은 Udemy의 "JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정" 강의를 수강한 뒤 개인 복습을 위해 정리하는 글입니다. (섹션 2: 39~40) 📝 전체 코드 const defaultResult = 0; let currentResult = defaultResult; // Gets input from input field function getUserNumberInput() { return parseInt(userInput.value); } // Generates and writes calculation log function createAndWriteOutput(operator, resultBeforeColc, calNumver) { const calcDescription = .. 더보기 이전 1 2 3 다음
