Nuri-KSLV-II

1. Rest Syntax란?Rest Syntax는 함수가 호출될 때 전달된 모든 인자를 하나의 배열로 받아들이는 문법입니다. 즉, 함수의 매개변수 앞에 ...을 붙이면, 해당 매개변수는 나머지 모든 인자들을 배열로 받을 수 있습니다.예제:function f(...args) { const sum = args[0] + args[1]; return sum;}console.log(f(3, 4)); // 7f(3, 4)를 호출하면, 함수 내부에서 args는 [3, 4]가 됩니다.이처럼 함수에 전달된 모든 인자를 배열로 다룰 수 있게 해줍니다.2. 왜 Rest Syntax를 사용할까?처음에는 "그냥 배열을 함수에 전달하면 되는 거 아닌가?"라는 생각이 들 수 있습니다. 하지만 Rest Syntax는 가변적인..

함수가 객체라는 사실은 다른 프로그랭 언어와 구별되는 자바스크립트의 중요한 특징이다.- 모던 자바스크립트 딥다이브, 이응모JS 에서 함수를 호출하는 로직자바스크립트 엔진은 생성된 함수를 호출하기 위해 함수 이름과 동일한 이름의 식별자를 암묵적으로 생성하고, 거기에 함수 객체를 할당함일급객체자바스크립트의 함수는 값처럼 변수에 할당되거나, 프로퍼티 값 또는 배열의 요소가 될 수 있음. 값의 성질을 갖는 객체를 일급객체 라고 함// 기명 함수 표현식var add = function foo (x,y) { return x+y;};// 함수 객체를 가리키는 식별자로 호출console.log(add(2,5)); //7// 함수 이름으로 호출 -> ReferenceError// 함수 이름은 함수 몸체 내부에서만 유효한..

구글 공식 검색엔진 최적화 문서 참고 https://developers.google.com/search/docs/crawling-indexing/consolidate-duplicate-urls?hl=ko#rel-canonical-link-method URL 표준화 및 표준 태그 | Google 검색 센터 | 문서 | Google Developers 사이트에 중복 콘텐츠가 있는 경우 Google은 표준 URL을 선택합니다. 표준 URL 및 중복 URL 통합 방법을 자세히 알아보세요. developers.google.com - 하나의 페이지를 여러 URL로 액세스할 수 있거나 서로 다른 페이지에 유사한 콘텐츠가 있는 경우(예: 한 페이지에 모바일 버전과 데스크톱 버전이 모두 있는 경우) - Google은 이..

AMP란 무엇인가요? 웹사이트 로드가 3초를 넘어가면 웹사이트에서 나간다는 사람이 40% - 사용자의 휴대기기에 콘텐츠가 로드되는 시간을 줄이기 위해 Google에서는 Accelerated Mobile Pages 프로젝트를 시작 - 모든 사용자를 위해 모바일 웹 사용환경을 개선하는 것을 목표로 하는 오픈소스 프로젝트 https://amp.dev AMP - a web component framework to easily create user-first web experiences Explore AMP success stories Don’t take our word for it - read case studies from industry success stories and see how AMP has pro..

📌 검색엔진최적화란?(SEO, Search Engine Optimization) 검색엔진이 이해하기 쉽도록 홈페이지 구조와 페이지를 개발해 검색 결과 상위에 노출될 수 있도록 하는 작업 📌 검색엔진 최적화 가이드라인 1. 네이버 블로그/카페/지식인 위주로 콘텐츠가 노출되기 때문에 동일한 내용의 콘텐츠일 때 네이버가 아닌 독립적인 홈페이지에 위치한 콘텐츠는 상위에 잘 노출되지 않음 2. 구글 홈페이지 관리자를 위한 '웹마스터'도구를 제공. 해당 도구를 통해 현재 구글 검색엔진이 자신의 홈페이지 콘텐츠를 어떻게 수집해가고 있는지, 각 페이지에 인덱싱이 잘 되고 있는지 등의 정보를 확인할 수 있음 → 따라서 네이버와 구글 등 홈페이지를 어떤 브라우저에 더 중요하게 노출할 것인지 결정해서 SEO를 최적화하는 것..

📌 Image Lazy Loading이란? 페이지 안에 있는 실제 이미지들이 화면에 보여질 필요가 있을 때 로딩 할 수 있도록 지연시키는 것 - 디바이스 내 리소스 활용도 증가 - 웹 성능 최적화 - EX. SPA(Sing Page Application) 내에서 바로 보여질 필요가 없는 이미지를 지연 로딩 ✔ 방식 1. 자바스크립트를 이용해 image load를 트리거하기 HTML JS document.addEventListener("DOMContentLoaded", function() { var lazyloadImages = document.querySelectorAll("img.lazy"); var lazyloadThrottleTimeout; function lazyload () { if(lazylo..

📌 기존의 mvc 패턴 SPA형태로 만들면 단 하나의 controller로 여러가지 view와 model을 관리하게 됨 view에서 일어난 상호작용으로 인해 여러 model이 변경되거나 그 반대의 문제도 있었을 것 📌 페이스북은 이러한 상황을 줄이고자 Flux 패턴을 만들어냄 flux 패턴의 키워드는 단방향 데이터 흐름이다 기본형 action이 발생하면 dispatcher에서 이를 받아와 해석한 후 store에 저장된 정보에 변경을 가하고 그 결과가 view로 전달됨 발전형 모바일에서 터치를 하는 것처럼, 웹에서도 사용자가 View를 통해서 클릭 같은 액션을 발생시킬 수 있다. action이 발생하면 dispatcher 통해 단방향으로 데이터가 흐름 📌 단계별 설명 Action Action은 일종의 Ac..

📌 자바스크립트 원시값과 참조값 원시값 참조값 특징 데이터 복사가 일어날 때 메모리 공간을 새로 확보하여 독립적인 값을 저장 메모리에 직접 접근이 아닌 메모리의 위치(주소)에 대한 간접적인 참조를 통해 메모리에 접근 mutability immutable mutable 예시 string number bigint boolean undefined symbol 그 외(array, object, function..) 📌 예시 - myArray의 데이처 자체는 별도의 메모리 공간(Heap)에 저장되며, 변수에 할당 시 데이터에 대한 주소(힙 메모리 주소 값)이 저장되기 때문에 자바스크립트 엔진이 변수가 가지고있는 메모리 주소를 이용해서 변수의 값에 접근 - 변수의 복사나 수정 시 참조 여부를 잘 고려해야함 📌 얕은..

📌가상돔의 개념 - 공식문서 정의 The virtual DOM (VDOM) is a programming concept where an ideal, or “virtual”, representation of a UI is kept in memory and synced with the “real” DOM by a library such as ReactDOM. This process is called reconciliation. 가상으로 UI를 버츄얼돔에 저장해두었다고 Real Dom과 연동(sync) 시켜주는 프로그래밍 컨셉 일명 reconciliation(화해) 과정이라 정의 📌Diffing 알고리즘 - 리액트는 Real Dom과 Virtual Dom을 참고하면서 diffing 알고리즘을 이용해 변화가 일..

var let const 선언과 초기화 선언 + 초기화 동시 진행 선언, 초기화 분리 진행 선언, 초기화 분리 진행 스코프 함수스코프 블록스코프 블록스코프 재선언 가능 불가 불가 재할당 가능 가능 불가 호이스팅 호이스팅됨 TDZ TDZ 참고 https://www.zerocho.com/category/ECMAScript/post/5757d74345041aaae7493479 https://www.zerocho.com/category/ECMAScript/post/5757d74345041aaae7493479 www.zerocho.com