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

스코프 (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는 활발히 개발중이고 브..

JavaScript란 무엇일까? 해석형, 즉석(on the fly) 컴파일링이란 무엇인가? 동적 해석형 언어란 무엇일까? 약형(weakly types)은 무슨 뜻일까? 호스팅된 환경에서의 JavaScript 실행 - JavaScript란 무엇일까? JavaScript는 동적 약형 프로그래밍 언어이다. JavaScript는 해석형 언어이므로 전송 중에 컴파일이 되며, 몇몇 프로그래밍 언어처럼 개발 중에 컴파일 되는 것이 아니라 실행되기 전에 컴파일이 된다는 특징이 있다. 또한 호스팅 된 언어이므로 여러 환경에서 실행이 가능하다. 가장 두드러진 사용 사례로는, 웹페이지의 브라우저에서 코드를 실행하여 보다 동적으로 만드는 것이다. - 해석형, 즉석(on the fly) 컴파일링이란 무엇인가? JavaScrip..

ES6란? Array Destructuring (배열 구조 분해 문법) Object Destructuring (객체 구조 분해 문법) Array & Object Destructuring (배열 & 객체 혼합 구조 분해 문법) [JavaScript] ES6 문법 ES란, ECMAScript의 약자이며, 자바스크립트의 표준, 규격을 나타내는 용어이다. ES 뒤에 붙은 숫자는 version을 의미하고, 현재 사용하는 ES6은 2015년도에 출시되었다. ① Array Destructuring (배열 구조 분해 문법) 1-1. 중첩되지 않은 배열의 경우 var nums = [10, 20, 30]; var num1 = nums[0]; var num2 = nums[1]; var num3 = nums[2]; 중첩되지 ..

JSX 문법이란? 리액트 엘리먼트(React Element)란? 리액트 컴포넌트(React Component)란? - JSX 문법이란? JSX 문법은 자바스크립트(JS)로 HTML과 같은 문법을 사용할 수 있는 편리한 문법이다. JSX 문법에는 여러가지 규칙들이 존재한다. ① 속성명은 카멜 케이스로 작성한다. - 카멜 케이스(camel case)란? var camelCase; 중간 글자들은 대문자로 시작하지만 첫 글자가 소문자인 경우, 낙타 모양과 비슷하다 하여 지어진 이름이다. ② 자바스크립트 예약어와 같은 속성명은 사용 불가하다. 안녕하세요 // 불가 안녕하세요 // 가능 ③ 반드시 하나의 요소로 감싸기 // 1. 부모 태그로 감싸기 function App() { return ( 안녕하세요 ) } /..