자바스크립트 36

자바스크립트 요약정리

블로그의 내용을 흐름에 맞게 정리하였습니다. 본 페이지를 기준으로 공부순서를 잡고 정리하시면 됩니다. 1. 자바스크립트 기초 가이드 https://d-craftshop.tistory.com/206 자바스크립트 기초 가이드 JavaScript 는 무엇이며, 어디에서 사용될까요? 그리고 장,단점은 무엇일까요? 웹사이트의 모든 페이지는 JavaScript를 사용할 가능성이 높습니다. Google 애널리틱스, 이벤트 추적 또는 디스플레이 광 d-craftshop.tistory.com 2. 자바스크립트 데이터 자료형 https://d-craftshop.tistory.com/208 자바 스크립트 자료형 자바스크립트에서는 다양한 자료형을 사용할 수 있습니다. 그 중에서도 가장 기본적인 자료형은 문자형(String),..

자바스크립트 2024.03.27

자바스크립트 연산자

연산자(Operator) 연산자(Operator)는 프로그래밍에서 값을 연산하거나 조작하는 데 사용되는 기호나 키워드입니다. JavaScript에서도 다양한 연산자가 있습니다. 이 중에서 산술 연산자와 단항 산술 연산자를 설명해 드리겠습니다. 산술 연산자(Arithmetic Operators): 산술 연산자는 숫자 값들을 연산하는 데 사용됩니다. 주요 산술 연산자는 다음과 같습니다: 덧셈(+): 두 피연산자를 더합니다. 뺄셈(-): 첫 번째 피연산자에서 두 번째 피연산자를 뺍니다. 곱셈(*): 두 피연산자를 곱합니다. 나눗셈(/): 첫 번째 피연산자를 두 번째 피연산자로 나눕니다. 나머지(%): 첫 번째 피연산자를 두 번째 피연산자로 나눈 나머지를 반환합니다. 예시: let x = 10; let y = ..

자바스크립트 2024.03.27

자바 스크립트 자료형

자바스크립트에서는 다양한 자료형을 사용할 수 있습니다. 그 중에서도 가장 기본적인 자료형은 문자형(String), 숫자형(Number), 논리형(Boolean)입니다. 문자형(String): 개념: 문자열은 텍스트 데이터를 나타내는 데 사용됩니다. 문자열은 작은따옴표('')나 큰따옴표("")로 감싸져 있습니다. 예시 코드: let message = "Hello, world!"; // 큰따옴표로 둘러싼 문자열 let name = 'Alice'; // 작은따옴표로 둘러싼 문자열 숫자형(Number): 개념: 숫자형은 숫자를 나타내는 데 사용됩니다. 정수나 실수를 포함하여 다양한 숫자를 표현할 수 있습니다. 예시 코드: let age = 25; // 정수 let pi = 3.14; // 실수 논리형(Boole..

자바스크립트 2024.03.26

자바스크립트 용어정리

식별자(Identifier): 식별자는 변수, 함수 등을 구별하는 데 사용되는 이름입니다. let age = 25; function greet() { console.log("Hello!"); } 연산자(Operator): 연산자는 값들을 조작하고 계산하는 데 사용됩니다. let sum = 10 + 5; // 덧셈 연산자 let difference = 20 - 8; // 뺄셈 연산자 let product = 4 * 6; // 곱셈 연산자 let quotient = 50 / 2; // 나눗셈 연산자 표현식(Expression): 표현식은 값, 변수, 연산자의 조합으로 이루어진 구조입니다. let result = (5 * 3) + (10 / 2); // 표현식 값(Value): 값은 데이터의 기본적인 단위로,..

자바스크립트 2024.03.26

자바스크립트 기초 가이드

JavaScript 는 무엇이며, 어디에서 사용될까요? 그리고 장,단점은 무엇일까요? 웹사이트의 모든 페이지는 JavaScript를 사용할 가능성이 높습니다. Google 애널리틱스, 이벤트 추적 또는 디스플레이 광고를 사용하는 경우 이미 JavaScript를 사용하고 있는 것입니다. 사용자에게 훌륭한 경험을 제공하기 위해 JavaScript를 더욱 활용해야 합니다. 그러기 위해서는 먼저 JavaScript가 무엇이며 어떤 용도로 사용되는지 알아야 합니다. JavaScript는 무엇인가요? JavaScript(JS)는 웹사이트와 애플리케이션을 동적이고 상호작용적으로 만드는 데 사용되는 컴퓨터 프로그래밍 언어입니다. 서버뿐만 아니라 브라우저에서 직접 실행할 수 있다는 점이 독특합니다. HTML(hypert..

자바스크립트 2024.03.26

웹 페이지와 Javascript

[JS] 웹 페이지와 Javascript Javascript는 원래 HTML 파일 안에서 HTML태그나 CSS를 제어하기 위한 언어였습니다. 그렇기 때문에 늘 Javascript의 기초는 웹 페이지에 어떻게 인터렉티브한 효과를 주는가를 이야기 합니다. 이제 본격적으로 웹 페이지에서의 Javascript를 시작해 봅시다. #01. Javascript 소스코드의 위치 JS 소스코드는 HTML 페이지의 어느 위치에나 올 수 있다. 대체로 가장 많이 사용하는 위치는 태그가 끝나기 전과 태그가 끝나기 전이다. 1) 태그에 JS가 위치하는 경우 웹 브라우저가 HTML 파일을 실행하는 과정에서 JS소스를 인식하고 JS코드를 해석한다. 만약 형태로 외부 스크립트 파일을 참조하는 처리가 있다면 해당 파일을 다운로드 받기..

자바스크립트 2023.12.01

async & await

async & await는 뭔가요? async와 await는 자바스크립트의 비동기 처리 패턴 중 가장 최근에 나온 문법입니다. 기존의 비동기 처리 방식인 콜백 함수와 프로미스의 단점을 보완하고 개발자가 읽기 좋은 코드를 작성할 수 있게 도와주죠. 개발자에게 읽기 좋은 코드란? 처음 프로그래밍을 배웠을 때 아래와 같이 변수와 조건문을 사용하셨던 기억이 있으시죠? var user = { id: 1, name: 'Josh' }; if (user.id === 1) { console.log(user.name); // Josh } 이 코드는 user라는 변수에 객체를 할당한 뒤 조건문으로 사용자의 아이디를 확인하고 콘솔에 사용자의 name을 찍는 간단한 코드입니다. 우리는 이렇게 위에서부터 아래로 한 줄 한 줄 차..

자바스크립트 2023.11.17

프라미스 (promise)

Promise가 뭔가요? “A promise is an object that may produce a single value some time in the future” 프로미스는 자바스크립트 비동기 처리에 사용되는 객체입니다. 여기서 자바스크립트의 비동기 처리란 ‘특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성’을 의미합니다. Promise가 왜 필요한가요? 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용합니다. 일반적으로 웹 애플리케이션을 구현할 때 서버에서 데이터를 요청하고 받아오기 위해 아래와 같은 API를 사용합니다. $.get('https://jsonplaceholder.typicode.com/posts/1', function(re..

자바스크립트 2023.11.17

문풀2 ^^

연습문제 #1. 보기 중 정답인 것을 고르시오 a = 2; var a; console.log(a); ① 오류가 발생한다. ② 정상적으로 실행되고 undefined가 출력된다. ③ 정상적으로 실행되고 2가 출력된다. 연습문제 #1 풀이 var a = 2;를 하게 되면 JavaScript는 아래와 같이 동작한다. var a - 인터프리터가 변수를 선언 a = 2 - a라는 변수를 찾는다. - 없다 → 전역 변수를 생성하고 값을 대입 - 있다 → 변수에 값을 대입 연습문제 #2. 위치별 a의 값을 적으시오. var a = 'g'; function fn(){ console.log(a);// ① var a = 'l'; console.log(a); // ② } fn(); ① undefined ② l 연습문제 #2 ..

자바스크립트 2023.11.16