ksw_devlog

require와 import는 모듈 키워드이고 둘 모두 다른 파일의 코드를 불러온다는 동일한 목적을 가지고 있지만 다른 문법 구조를 가지고 있습니다. require는 CommomJS 의 함수이고 import는 ES6의 키워드로, 원하는 모듈을 불러올 수 있습니다. require는 파일에 들어있는 곳에 남아 있으며 import는 항상 맨 위로 이동합니다. require는 프로그램의 어느 지점에서나 호출할 수 있지만 import는 파일의 시작 부분에서만 실행할 수 있습니다. ES6 사양을 지원하지 않는 환경이거나, Babel 과 같은 인터프리터가 없을 땐 require을 사용해야 합니다.

브라우저 저장소로 Cookie와 Web Storage가 있습니다. Cookie와 Web Storage는 모두 해당 도메인과 관련된 데이터를 클라이언트 웹브라우저에 저장할 수 있도록 해주고 둘 다 사이트의 도메인 단위로 접근이 제한됩니다. Cookie는 매번 서버로 전송되고, 문자열만 저장이 가능하며, 용량에 제한이 있고, 만료 일자가 존재합니다. Web Storage는 데이터를 클라이언트에 저장만 하고 서버로 전송되지는 않습니다. 문자열 외에도 구조화된 객체를 저장할 수 있어 개발 편의성을 제공해주고, 하나의 사이트에서 저장할 수 있는 용량이 제한되어있지 않습니다. 또한 한 번 저장한 데이터는 영구적으로 존재하게 됩니다. Web Storage는 지속성에 따라 LocalStorage와 SessionStor..

this JS 에서 this 는 일반적으로 해당 함수를 호출하는 방식에 따라 동적으로 결정됩니다. 하지만 화살표 함수의 경우 해당 함수를 호출하면 선언 단계에서 정적으로 상위 컨텍스트를 참조하여 this 가 결정됩니다. (lexical this) 동작원리 this는 현재 실행 중인 함수의 객체를 참조합니다. this의 값은 함수가 어떻게 호출되었는지에 따라 달라집니다. 1. 일반 함수 호출에서 this는 전역 객체를 가리킨다. 2. 객체의 메소드로 호출된 함수에서 this는 해당 객체를 가리킨다. 3. 생성자 함수에서 this는 생성된 객체를 가리킨다. 4. call() 또는 apply() 메소드를 사용하여 명시적으로 this를 지정할 수 있다. 따라서 this의 값은 실행 컨텍스트에 따라 동적으로 결정..

position 속성은 웹 문서 안 요소들을 어떻게 배치할 지를 정하는 속성입니다. position 속성을 이용하면 텍스트나 이미지를 원하는 위치로 배치할 수 있고 어떤 방식으로 놓을지를 결정할 수 있습니다. position 속성에는 static, relative, absolute, fixed, sticky 등이 있는데 static을 제외한 나머지 속성값들은 top, left, bottom, right 와 같이 어느 위치에 요소를 위치시킬 건지 지정할 수 있습니다.

HTTP(HyperText Transfer Protocol) 웹브라우저와 웹서버가 통신을 할 때 사용하는 통신규칙 클라이언트와 서버 사이에서 html, css, js, 이미지 파일 등을 요청하고 응답하면서 주고 받는다. 서버와 클라이언트가 서로 알아들을 수 있는 공통의 약속 -> HTTP HTTP는 크게 request(요청)와 response(응답)를 위한 메시지로 구분되어 있다 HTTP 특징 Stateless(무상태성) : HTTP는 특정 상태를 유지하지 않는 특징이 있다. Connectionless(비 연결성) : HTTP는 실제로 요청을 주고 받을 때만 연결을 유지하고 응답을 주고나면 서버와의 연결을 끊는다. HTTP 메시지 구조 요청(Requests)과 응답(Responses)의 구조 1. sta..

캐시(Cache) 자주 사용하는 데이터나 값을 미리 복사해 놓은 임시 장소 캐시의 장점 캐시 데이터를 미리 복사해 놓으면, 계산이나 접근 시간 없이 더 빠른 속도로 데이터에 접근 할 수 있습니다. 캐시의 단점 메모리공간이 상대적으로 작습니다. 프론트엔드에서는 캐시를 웹 서비스 최적화에 사용합니다. 캐시 사용 영역 1. 브라우저 캐시 : 한 번 받아온 리소스들을 재사용하여 속도가 빨라집니다. 2. 프록시 캐시 : 조직 내에서 접속하는 웹 사이트의 리소스들을 캐시하여 속도가 빨라지고 네트워크 사용량을 줄여줍니다. https://yanacoding.tistory.com/entry/CS-%EC%BA%90%EC%8B%9CCache%EB%9E%80 [CS] 캐시(Cache)란? 1. 캐시(Cache)란? 컴퓨터 과..

프레임워크(Framework) 소프트웨어에서의 프레임워크는 '소프트웨어의 특정 문제를 해결하기 위해서 상호 협력하는 클래스와 인터페이스의 집합' 이라 할 수 있으며, 완성된 어플리케이션이 아닌 프로그래머가 완성시키는 작업을 해야합니다. 객체 지향 개발을 하게 되면서 통합성, 일관성의 부족이 발생되는 문제를 해결할 방법중 하나라고 할 수 있습니다. 프레임워크의 특징 특정 개념들의 추상화를 제공하는 여러 클래스나 컴포넌트로 구성되어 있습니다. 추상적인 개념들이 문제를 해결하기 위해 같이 작업하는 방법을 정의합니다. 컴포넌트들은 재사용이 가능합니다. 높은 수준에서 패턴들을 조작화 할 수 있습니다. 라이브러리(Library) 라이브러리는 단순 활용가능한 도구들의 집합을 말합니다. 즉. 개발자가 만든 클래스에서 ..

parameter : 매개변수(인자) argument : 전달인자(인수) parameter와 argument는 쓰임의 차이가 있습니다. 함수를 정의할 때 사용되는 변수를 매개변수(parameter), 실제로 함수가 호출될 때 넘기는 변수값을 인수(argument)라고 설명할 수 있습니다. 예시) https://7942yongdae.tistory.com/155 매개변수(Parameter)와 인수(Argument)의 차이점은 무엇일까? 매개변수와 인수는 프로그래밍에서 자주 사용되는 용어입니다. 영어로는 Parameter(매개변수), Argument(인수)로 정의되고 쓰이는데요. 프로그래밍을 할 때 자주 쓰이는 용어인 만큼 명확하게 구분하 7942yongdae.tistory.com