전체 글61 [코어자바스크립트] 6장. 프로토타입 [6장] 프로토타입자바스크립트는 프로토타입 기반 언어클래스 기반 언어에서는 상속을 사용하지만 프로토타입 기반 언어에서는 어떤 객체를 원형으로 삼고 이를 복제함으로써 상속과 비슷한 효과를 얻는다.❓원형(prototype) 모든 객체는 다른 객체로부터 직접적으로 생성된다. 이 때 생성된 객체는 원본이 되는 객체를 원형이라고 부른다.1. 프로토타입의 개념 이해어떤 생성자 함수를 new 연산자와 함께 호출하면constructor에서 정의된 내용을 바탕으로 새로운 인스턴스가 생성된다.이때 instance에는 __proto__ 라는 프로퍼티가 자동으로 부여되는데이 프로퍼티는 constructor의 prototype이라는 프로퍼티를 참조한다.var suzi = new Person('Suzi')suzi.__proto_.. 2024. 6. 18. [코어자바스크립트] 5장. 클로저 [5장] 클로저1. 클로저의 의미 및 원리 이해클로저함수와 그 함수가 선언될 당시의 lexical envrionment의 상호관계에 따른 현상어떤 함수에서 선언한 변수를 참조하는 내부함수에서만 발생하는 현상→ 어떤 함수 A에서 선언한 변수 a를 참조하는 내부함수 B를 외부로 전달할 경우 A의 실행 컨텍스트가 종료된 이후에도 변수 a가 사라지지 않는 현상var outer = function () { var a = 1 var inner = function () { console.log(++a) } return inner}var outer2 = outer()console.log(outer2()) // 2console.log(outer2()) // 3inner 함수의 실행 결과가 아닌 inner함수.. 2024. 6. 17. 변수 선언 삼형제 var, let, const (feat. TDZ(Temporal Dead Zone)) 자바스크립트의 변수 선언할 때 제일 처음 배우는 var, let, const.... 이 셋을 집중비교해보면 TDZ라는 용어가 나온다..! TDZ에 대해 알아보자. 🤔👊🏻 ✨var vs. let vs. const특성varletconst범위(Scope)함수 범위 또는 전역 범위블록 범위블록 범위재선언(Redeclaration)가능불가능불가능재할당(Reassignment)가능가능불가능호이스팅(Hoisting)선언과 초기화가 함께 이루어짐선언만 호이스팅, 초기화는 이루어지지 않음선언만 호이스팅, 초기화는 이루어지지 않음일시적 사각지대(TDZ)해당 없음해당됨해당됨 ❓TDZ(Temporal Dead Zone)란let과 const로 선언된 변수가 호이스팅되는 과정에서 발생하는 일시적인 사각지대를 의미한다.변수는.. 2024. 6. 14. [코어자바스크립트] 4장. 콜백 함수 [4장] 콜백 함수1. 콜백 함수란?콜백함수: 다른 코드의 인자로 넘겨주는 함수콜백함수는 제어권과 관련이 깊음어떤 함수 X를 호출하면서 특정 조건일 때 함수 Y를 실행해서 나에게 알려달라는 요청을 보내는 것임.2. 제어권📍호출시점❓제어권실행흐름 or 프로세스var count = 0;var cbFunc = function() { console.log(count); if (++count > 4) clearInterval(timer);};var timer = setInterval(cbFunc, 300);// 실행 결과// 0 (0.3초)// 1 (0.6초)// 0 (0.9초)// 1 (1.2초)// 0 (1.5초)code호출 주체제어권cbFunc()사용자사용자setInterval(cbFun.. 2024. 6. 14. [코어자바스크립트] 3장. this [3장] this❓this 대부분의 객체지향언어에서 - 클래스로 생성한 인스턴스 객체JS에서 - 어디서든 사용 가능 (상황에 따라 this가 바라보는 대상이 달라짐)→ 함수와 객체(메서드)의 구분이 느슨한 자바스크립트에서 this는 실질적으로 이 둘을 구분하는 거의 유일한 기능임!1. 상황에 따라 달라지는 thisthis는 기본적으로 실행 컨텍스트가 생성될 때 함께 결정된다.실행 컨텍스트는 함수를 호출할 때 생성함 = this는 함수를 호출할 때 결정된다.📍전역 공간에서의 this전역공간의 this = 전역객체브라우저에서의 전역객체 = windowNode.js에서의 전역객체 = globalvar a = 1console.log(a) // 1console.log(window.a) // 1 (브라우저 환경에.. 2024. 6. 14. 세션 기반 인증 vs. 토큰 기반 인증 (feat. 인증+인가) HTTP는 클라이언트(프론트)와 서버(백엔드) 간의 통신을 가능하게 한다. HTTP는 상태를 저장하지 않기 때문에 각 요청은 이전에 수행된 작업에 대해 전혀 인지하지 못한다.예) 구글 계정에 로그인하고 설정 페이지로 이동했다면, 기본 HTTP 동작에서는 서버가 우리가 방금 로그인했는지 할지 못해 다시 로그인해야 할 것이다. 하지만, 세션이나 토큰 인증을 사용하면 서버에 우리가 이미 로그인했음을 알리고 해당 페이지에 접근할 수 있도록 허용할 수 있다!!!❓인증사용자가 누구인지 확인하는 과정사용자가 이메일과 비밀번호를 입력서버는 입력된 이메일과 비밀번호가 데이터베이스에 저장된 정보와 일치하는지 확인일치하면 사용자에게 인증 토큰이나 세션 ID를 발급하여 로그인에 성공❓인가확인된 사용자가 어떤 자원에 접근할 수.. 2024. 6. 12. [코어 자바스크립트] 2장. 실행 컨텍스트 [2장] 실행 컨텍스트1. 실행컨텍스트란?스택: 후입선출 큐: 선입선출실행할 코드에 제공할 환경 정보들을 모아놓은 객체동일 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜 스택(call stack)에 쌓아올렸다가, 가장 위에 쌓여있는 컨텍스트와 관련 있는 코드들을 실행한다.실행 컨텍스트를 구성하는 방법: 함수를 실행하는 것function outer() { const outerVar = 'Outer' function inner() { const innerVar = 'Inner' console.log(innerVar) // Inner console.log(outerVar) // Outer console.log(globalVar) // Glob.. 2024. 6. 11. [코어 자바스크립트] 1장. 데이터 타입 [1장] 데이터 타입1. 데이터 타입의 종류📍기본형기본형 데이터를 변수에 할당하면 값 자체가 변수에 복제된다. 변수와 값 사이에 직접적인 관계를 갖지 않고, 값이 변경되어도 다른 변수에는 영향을 주지 않는다. (불변값)숫자, 문자열, 불리언, null, undefined, Symbol📍참조형값이 담긴 주솟값들로 이루어진 묶음을 가리키는 주솟값을 복제 (가변값)참조형 데이터를 변수에 할당하면 값이 담긴 메모리 주소(참조)가 변수에 복제된다.배열, 객체, 함수2. 데이터 타입에 관한 배경지식과거에는 메모리 용량이 제한적이었기 때문에 작은 크기의 정수형 타입(short 등)을 사용하여 메모리를 절약했다. 하지만 특정 범위를 벗어나는 값이 입력되면 오류가 발생하거나 잘못된 값이 저장되는 문제가 있었다. 이를.. 2024. 6. 10. 개발자가 SEO(검색 엔진 최적화)를 신경써야 하는 이유 SEO는 Google 검색 상단에 웹사이트나 컨텐츠의 순위를 매기는 단계를 포함하는 체계적이 프로세스다. 기업이 소비자에게 노출되고 인기를 얻으려면 소비자에게 노출되어야 한다. 오늘날은 모든 것이 디지털이기 때문에 디지털 미디어와 애플리케이션을 활용하고 브랜드를 홍보해야 한다. SEO는 그 중 하나고 매우 중요하다. SEO를 통해 웹사이트의 검색 순위를 높이면 유기적인 프래픽이 증가하고, 매출 향상이 될 것이다. ❓SEO란SEO는 웹사이트가 유기적인(무료) 검색 방식을 통해 검색 엔진에서 상위에 노출될 수 있도록 최적화하는 과정검색 엔진이 콘텐츠를 이해하고 사용자에게 더 잘 노출될 수 있도록 돕는 것이 SEO의 핵심 목적이다.✨SEO 핵심 전략기술적 SEO (Technical SEO)웹사이트의 기술적 .. 2024. 6. 3. 이전 1 2 3 4 5 6 7 다음 반응형
