자바스크립트 기초

1. 변수 선언: let, const var 대신 let과 const를 사용합니다. React에서는 주로 const를 사용합니다. 예제 1: let과 const의 차이 let age = 20; // let: 재할당 가능한 변수 age = 21; // 값 변경 가능 console.log(age); // 21 출력 const name = '철수'; // const: 재할당 불가능한 상수 // name = '영희'; // 오류 발생! … 더 읽기

이벤트

1. 이벤트 자바스크립트에서 이벤트는 웹 페이지에서 발생하는 특정한 동작이나 사건을 의미합니다. 사용자의 마우스 클릭, 키보드 입력, 페이지 로딩 완료, AJAX 요청 완료 등과 같은 다양한 상황에서 이벤트가 발생할 수 있습니다. 웹브라우저나 사용자가 행하는 어떤 동작을 이벤트라 칭하며 웹 브라우저 내에 새로운 페이지를 불러오는것도 이벤트에 해당합니다. 웹문서 영역 내에서 이루어 지는 동작에 한해 이벤트라 하며 웹문서 … 더 읽기

windowlocation

URL 정보 확인을 위한 window.location 속성 사용 window.location 속성을 사용하여 현재 페이지의 URL 정보를 확인할 수 있다. window.location은 Location 객체를 반환하며, 이 객체의 여러 속성을 통해 URL의 다양한 정보를 확인할 수 있다. 예시 URL: https://coalacoding.com/documentation?category=1 window.location.href // "https://coalacoding.com/documentation?category=1" window.location.protocol // "https:" window.location.host // "coalacoding.com" window.location.hostname // "coalacoding.com" window.location.port // "" window.location.pathname // "/documentation" window.location.search // … 더 읽기

5-객체

1-개념 1-1-정의 0개 이상의 프로퍼티(property:속성) 의 집합. 화살표함수에서는 함수의 렉시컬 스코프를 가르킴" const person = { name: 'Kim', // 프로퍼티 age: 30, // 프로퍼티 ~~ greet: function () { // 메서드 return `Hello, I'm ${this.name}`; } ~~greet() { // 메서드 return `Hello, I'm ${this.name}`; } }; 프로퍼티는 키(key)와 값(value)으로 구성됨. 프로퍼티: 객체의 상태를 나타내는 값 … 더 읽기

4-클로저

1. 가비지컬렉션 콜스택에서 메모리를 자동으로 삭제하는 과정을 가비지 컬렉션이라고 하고 이 시스템을 가비지 컬렉션 이라고 한다. 메모리의 누수를 방지하려는 목적으로 평가가 완료된 코드를 콜스택에서 제거하는 것인데 자바스크립트는 이것을 자동으로 지원한다. 1-1-가비지 컬렉터(Garbage Collactor): 메모리에서 더이상 사용되지 않는 실행컨텍스트 감지하고 해당 메모리를 회수 하여 삭제하는 시스템 function outer() { let a = 10; return function inner() … 더 읽기

콜백-함수

함수는 매개변수(parameter)를 넣을 수 있다. 함수는 값을 반환할 수 있다 함수는 javascript의 꽃이라고 불리는 이유는 함수가 정말 많은 곳에서 사용되기 때문입니다. 함수 중 callback(콜백) 함수의 개념을 이해 한다면 함수의 세계는 일차정복 하시는 겁니다. 콜백 함수는 함수가 나중에 불린다고 해서 CallBack 함수입니다. 보통 콜백 함수를 구현할 때 함수의 인자에 함수를 넣는 방식으로 진행합니다. //1. sayHello라는 함수가 … 더 읽기

제어문

Info: 💡 1. 제어문 제어문이란 프로그램의 실행 흐름을 제어하는 구문 입니다. Info: 제어문 에는 조건문, 선택문, 반복문 이 있습니다. 조건문이란 조건에 따라 실행이 달라지게 할 때 사용되는 제어문입니다. ◦ 자바 스크립트의 조건문 에는if, else, else if가 있습니다. 선택문이란 값에 따라서 실행 내용을 선택하여 실행 할때 사용되는 제어문입니다. ◦ 자바 스크립트의 선택문 에는 switch가 있습니다. 반복문이란 주어진 조건에 … 더 읽기

3-실행컨텍스트와-스코프

ECMAScript는 4가지로 소스코드를 구분한다. 4가지 타입의 소스코드는 실행 컨텍스트를 생성한다. 전역코드 – 전역에 존재하는 소스코드 함수코드 – 함수 내의 코드 eval 코드 – eval 함수의 인수로 전달된 실행 코드 모듈코드 – 모듈내의 코드 위 4가지 타입별 실행컨텍스트의 생성과정과 관리방법의 차이가 있으나 1과 2의 사용빈도가 높으므로 이것만 다루도록 한다. 1-실행컨텍스트(Excution Context) 1-1-정의 자바스크립트 코드가 실행되는 공간(환경) … 더 읽기

연산자

연산자 mdn 1. 연산자란? 프로그램에서 특정한 동작을 하도록 지시하는 기호. 프로그래밍에서 연산이란 사칙연산은 물론 문자열을 연결해서 새로운 문자열을 만들고 값의 크기를비교하는 등의 여러가지 동작을 의미한다. 이런 연산을 지시하는 기호가 연산자이다. 산술,관계,할당,논리,부정,삼항,비트,단항,등이 있다. 1.1. 연산자의 종류 연산자 유형 연산자 설명 산술 연산자 + 덧셈 – 뺄셈 * 곱셈 / 나눗셈 % 나머지 계산 ++ 증가 (값에 … 더 읽기

promise-thencatch

Info: Promise : javascript의 비동기 처리를 지원하는 객체 중 하나 Promise 객체는 then과 catch 메서드를 가지고 있다. 1. then (콜백) 는 통신성공시 결과값 반환 1. catch (콜백) 는 통신에러시 결과값 반환 ☑ promise 객체를 반환하는 대표적인 함수 fetch 를 알아보자 Info: 📢 Fetch API 기본예제 🔗mdn 문서를 읽어보자 🔗문법을 보자 🔗리턴되는 값을 보자 ✏️실습 1 … 더 읽기