자바스크립트
-
[JavaScript] 자바스크립트 Date 객체 이해하기 - 1프로그래밍 이야기/JavaScript 공부 2020. 6. 17. 00:05
자바스크립트에서 날짜와 시간과 관련된 부분을 다룰 때는 Date 객체를 유용하게 활용할 수 있다. Date 객체 만드는 법 객체를 만드는 방법은 총 4가지가 있는데 하나씩 살펴보자. 1. 파라미터로 아무 값도 전달하지 않는 경우 // new Date() const date = new Date(); Date 객체는 new 연산자를 통해서 새로운 객체를 만들어 주어야 한다. 이렇게 Date 객체를 생성할 때, 소괄호 안에 아무런 값도 전달해주지 않으면, 현재시간으로 객체가 생성된다. 2. 파라미터로 숫자 값을 전달하는 경우 // new Date(milliseconds) const date = new Date(1000); console.log(date); // Thu Jan 01 1970 09:00:01 GM..
-
[JavaScript] 자바스크립트 this 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 6. 14. 23:06
자바스크립트를 공부하다 보면 객체와 메서드를 다룬 뒤부터는 this라는 키워드가 심심찮게 등장한다. 만약 react 같은 라이브러리를 다루기 시작하면 훨씬 더 this라는 키워드를 자주 보게 되는데, 과연 this란 무엇일까? this란? 결국 이 this는 함수에서 나타나는데, this키워드를 사용하면 그 함수를 호출한 주체(객체)를 가리키게 된다. 쉽게 말해서 '누가 이 함수를 불렀느냐'가 된다. const myObject = { printThis: function() { console.log(this); } } function printThis() { console.log(this); } myObject.printThis(); // {printThis: ƒ} printThis(); // Window..
-
[JavaScript] 자바스크립트 배열 메서드 (Array Method) 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 6. 13. 20:01
메서드를 활용하면 배열을 훨씬 더 자유롭게 다룰 수 있다. 배열이 기본적으로 갖추고 있는 다양한 메서드들 중에서 기본적으로 배열을 다루는 몇 가지들을 가볍게 정리해 보고자 한다. 배열의 끝 요소를 다루는 push, pop push와 pop은 배열의 끝부분을 다루는 메서드이다. push는 파라미터로 넘겨준 값을 배열 끝에 요소로 추가하고, pop은 파라미터 없이 해당 배열의 가장 끝에 있는 요소를 제거한다. const numbers = [1, 2, 3, 4, 5]; numbers.push(6); console.log(numbers); // (6) [1, 2, 3, 4, 5, 6] numbers.pop(); console.log(numbers); // (5) [1, 2, 3, 4, 5] 한 가지 독특한 점은..
-
[JavaScript] 자바스크립트 메서드 (Method) 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 6. 11. 18:30
메서드(method)란? 때로는 메소드라고 불리기도 하는 메서드는 어떤 객체가 가지고 있는 어떤 동작을 말한다. 언어마다 조금씩 의미가 다르긴 하지만 자바스크립트에서는 일반적으로 객체 안에 프로퍼티로 정의된 함수를 메서드라고 부른다. 메서드 만들기 객체 안에 메서드를 만들어 보자. 메서드는 간단하게 [JavaScript] 자바스크립트 객체(Object) 이해하기 - 1에서 정리한 것 처럼 객체를 정의할 때 프로퍼티 값으로 함수를 선언하는 것으로 만들 수 있다. const bigtop = { sayHi: function() { console.log('Hi!?'); } }; 당연히 화살표 함수로도 정의할 수 있다. const bigtop = { sayHi: () => { console.log('Hi!?');..
-
[JavaScript] 자바스크립트 화살표 함수(Arrow Function) 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 6. 7. 00:41
화살표 함수(Arrow Function)란? ECMA2015 이후에 등장한 화살표 함수는 기존의 방식보다 상대적으로 함수를 좀 더 간결하게 표현하는 새로운 방식이다. 이름에서도 유추할 수 있듯이 화살표 함수는 화살표 모양의 => 기호를 사용한다. 화살표 함수도 생각보다 다뤄야 할 것들이 많은데, 이번 포스트에서는 화살표 함수에 대해서 가볍게만 정리해보자. 기본 문법 화살표 함수는 함수 표현식에 사용되는데 function 키워드 대신에 화살표 모양의 기호를 소괄호 뒤에 작성한다. // 일반 함수 표현식 let myFunction = function (파라미터1, 파라미터2, ...파라미터들) { return '이것은 함수 표현식 입니다.'; } // 화살표 함수 표현식 let myArrow = (파라미터1..
-
[JavaScript] 자바스크립트 var, let, const 차이 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 5. 30. 00:54
자바스크립트에 변수를 선언하는 방식은 키워드 별로 3가지가 있다. var, let 그리고 const 이 셋이 각가 어떤 차이를 가지고 있는지 살펴보자. 1. 중복선언과 재할당 이 셋의 가장 큰 차이는 선언과 할당에 있다. 먼저, var 키워드는 중복선언이 가능하다. var myName = 'Bigtop'; console.log(myName); // Bigtop var myName = 'KimBigtop'; console.log(myName); // KimBigtop 혹시라도 중복이 가능하니 좋지않으냐고 생각할 수도있겠지만, 코드의 양이 늘어나고 복잡도가 높아질수록 변수의 중복선언을 허용하는 것은 이 변수 관리를 한층 더 어렵게 만든다. 그래서 이를 보완해 ECMA2015 부터 등장하게된 let과 cons..
-
[JavaScript] 자바스크립트 호이스팅(Hoisting) 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 5. 28. 02:07
호이스팅도 스코프와 마찬가지로 이를 좀 더 명확하게 이해하려면 scope의 깊은 개념과 자바스크립트의 실행 문맥을 이해한 상태에서 살펴보는 것이 좋지만, 그런 부분을 이해하기에는 생각보다 많은 배경지식들이 필요하다. 하지만, 그냥 가볍게 호이스팅이 어떠한 현상인지 정도만 이해해도 코드를 작성하거나 다른 개념들을 이해하는 데에 생각보다 적잖이 도움이 되기에 이 포스트를 작성하게 되었다. 호이스팅(Hoisting)이란? 호이스트를 구글에 검색해보면, 위키백과에서 '호이스트는 로프 또는 체인이 감싸는 드럼 또는 리프트 휠을 사용하여 하중을 들어 올리거나 내리는 데 사용되는 장치입니다.'라고 알려준다. 이와 비슷한 의미로 자바스크립트에서는 선언문을 끌어올리는 동작을 호이스팅(Hoisting)이라고 부른다. 자바..
-
[JavaScript] 자바스크립트 스코프(scope) 가볍게 이해하기프로그래밍 이야기/JavaScript 공부 2020. 5. 26. 00:58
스코프(Scope)란? Scope. 자바스크립트에서 스코프는 우리말로 유효 범위라고 해석하는데, 유효 범위로 번역하는 글도 많이 있지만 그냥 한글 그대로로 스코프라는 용어를 상대적으로 더 많이 사용하는 것 같다. 아무튼 말그대로 어떤 값이 영향을 미칠 수 있는 범위를 스코프라고 말한다. 깊은 내용들을 다루려면 scope도 생각보다 심오하고 디테일하게 다룰 수도 있다는 걸 최근에서야 깨닫게 되었는데, 아직 확실하게 이해하는 경지에는 도달하지 못했기 때문에, 이번 포스트에서는 이후에 정리할 개념들을 이해하는데 도움이 될만한 수준의 스코프에 대해서만 가볍게만 다루고자 한다. 아무튼, 스코프는 크게 전역 범위(Global Scope)와 지역범위(Local Scope) 두 가지로 나뉜다. 코드를 살펴보자. let..