영부터 구까지 영부터 구까지

forEachmapreducefilter오늘은 배열을 다루는 4가지 메서드에 대해서 알아보려고 한다. 배열을 다루는 메서드는 다양한데, 그 중 가장 많이 사용한다고 생각하는 forEach(), map(), reduce(), filter()에 대해서 알아보자.- array.forEach() forEach()는 배열의 각 요소에 대해 부작용(side effect)을 발생시키는 작업을 수행할 때 사용한다. 특징으로는, 반환값이 없으며, 원본 배열을 변경하지 않는다는 특징이 있다. 주로 로그 출력, API 호출, 데이터 저장 등의 작업에 적합하다. 아래의 코드는 배열의 모든 요소를 출력하는 코드이다.// forEach()const numbers = [1, 2, 3];numbers.forEach(number =>..

클로저 (Closure) 란?클로저 패턴의 프로그래밍 패턴은닉화 (Encapsulation)함수 팩토리 (Function Factory)비동기 프로그래밍에서 클로저메모이제이션 패턴 (Memoization Pattern)- 클로저 (Closrue) 란? 클로저는 반환된 내부 함수가 선언됐을 때의 렉시컬 환경(Lexical envirionment)인 스코프를 기억하며, 만약 자신이 선언됐을 때 환경(scope) 밖에서 호출되어도 스코프에 접근할 수 있는 함수를 말한다. 여기서 스코프는, 함수를 어디서 선언했는지에 따라 결정된다. 이를 렉시컬 스코핑(Lexical scoping)이라고 한다. function outer() { const x = 10; const inner = () => { console..

호이스팅이란?변수 호이스팅var로 선언한 변수 호이스팅const, let으로 선언한 변수 호이스팅함수 호이스팅함수 선언식으로 선언한 함수 호이스팅함수 표현식으로 선언한 함수 호이스팅var로 선언한 함수 표현식const, let으로 선언한 함수 표현식- 호이스팅이란? 호이스팅(Hoisting)이란, 자바스크립트 문법을 선언과 할당으로 구문을 분리하여 선언 부분을 최상위로 끌어올려 실행하는 특징을 말한다.- 변수 호이스팅 ① var로 선언한 변수 호이스팅 var로 선언한 변수의 경우, 호이스팅 시 undefined로 변수를 초기화 시키는 특징이 있다. 변수가 호이스팅 될 때에는 선언, 초기화만 된 채로 호이스팅 되고 , 할당까지 호이스팅이 되지는 않는다.console.log(name); // undefin..

스코프 (Scope) 란?전역 스코프 (Global Scope)지역 스코프 (Local Scope)함수 스코프 (Function Scope)블록 스코프 (Block Scope)제외인 var로 코드 진행할 경우자바스크립트를 공부할 때 스코프(Scope)라는 단어를 많이 접할 수 있다. 많이 접한다는 것은 꼭 알아야 한다는 것이 아닐까..? 그러므로 이번에는 자바스크립트의 스코프(Scope)에 대해 알아볼 것이다.- 스코프 (Scope) 란? 스코프(Scope)는 단어 뜻 그대로 '범위'라는 의미를 가지고 있다. 즉, 스코프(Scope)는 '변수에 접근할 수 있는 범위'라고 할 수 있다. 자바스크립트에서는 크게 두가지 타입의 스코프(Scope)가 존재한다. 하나는 전역 스코프(Global Scope), 다른..

증감 연산자란?증가 연산자 (Increment ++)감소 연산자 (Decrement --)전위 연산자 (prefix operator)후위 연산자 (postfix operator) 이번에는 JavaScript의 증감 연산자(Increment, Decrement)와, 전위 연산자(prefix operator), 후위 연산자(postfix operator)에 대해 알아볼 것이다. - 증감 연산자란? 증감 연산자는 증가 연산자(++)와 감소 연산자(--)로 나뉜다. 증가 연산자(Increment)는 어떠한 숫자형 변수의 값을 1을 증가시키는 것을 의미하고, 감소 연산자(Decrement)는 어떠한 숫자형 변수의 값을 1을 감소시키는 것을 의미한다. - 증가 연산자 (Increment ++)let number =..

Head에 넣었어요.   이렇게 작성하게 되면, 위에서부터 쭉 내려오기 때문에    태그 안에 작성하게 되면, 브라우저는 태그 요소를 읽고 나서 async 속성입니다.  - defer 속성  defer 속성입니다.   이미지 출처: https://media.licdn.com/dms/image/v2/C5112AQFW3cKEhP9AkQ/article-cover_image-shrink_600_2000/article-cover_image-shrink_600_2000/0/1520214760879?e=2147483647&v=beta&t=vDdQPieyUHqIdU8HjtKncTHxoPLeLa_KCVF630yzE_I이미지 출처: https://blog.kakaocdn.net/dn/..

변수(Variables) & 상수(Constants)변수 선언 및 정의 방법- 변수(Variables) & 상수(Constants) 단어를 직역하자면, 변수는 변하는 숫자를 의미하고 상수는 항상 같은 숫자를 의미한다. 이를 해석하자면, 변수는 기존에 존재하던 변수에 새로운 값이 할당 가능하단 의미이고 상수는 기존에 생성된 상수의 값을 변경할 수 없다는 의미이다. 만약 바꾸려고 하면 오류가 발생한다.    먼저, 변수를 사용하는 예제를 한번 보자. // 변수는 일종의 데이터 컨테이너 또는 저장소라고 할 수 있다.// 변수에는 주로 let을 사용한다.// userName이라는 변수 이름에 Max라는 값 할당let userName = 'Max';// 기존에 있던 변수에 새로운 값 할당// let은 새로운 값을..

이번에는 간단하게 ECMAScript와 JavaScript에 대해 알아보려고 한다. 쉽게 한마디로 말하자면, ECMAScript가 브라우저 공급 업체에 의해 JavaScript로 구현된 것이다. 정확하게 어떤 관계인지 알아보자. 아래의 내용들은 1-1, 2-1 / 1-2, 2-2 / 1-3, 2-3 을 서로 비교하며 보는 것이 이해하기 쉽다. 1. ECMAScript 1-1. ECMA 국제 기구에서 개발한 언어이지만 브라우저 공급 업체에 의해 JavaScript로 구현된다. 즉, 브라우저를 개발한 회사에 의해 구현이 된다. 1-2. ECMAScript 자체가 직접 사용되는 것이 아닌 브라우저 공급 업체가 이를 이용해 JavaScript 엔진에 구현한다. 1-3. ECMAScript는 활발히 개발중이고 브..