💪JavaScript/script.js

ES6 이전과 이후의 함수 우리가 함수를 사용하다 보면, new 키워드를 사용해 인스턴스를 생성하는 생성자 함수로서 호출할 수도 있고, 객체에 바인딩 되어 있는 메서드로 호출할 수도 있으며, 일반 함수로서도 호출할 수가 있는데요. ES6 이전의 함수는 사용 목적에 따라 호출을 하는 건 전적으로 개발자의 몫이었습니다. 따라서 모든 함수는 일반 함수로서 호출도 되었고, 생성자 함수로서 호출도 할 수 있었습니다. 하지만 이렇게 불명확한 사용방식은 실수를 유발할 수 있기 때문에 옳지 않습니다. ES6 함수의 구분 constructor prototype super arguments 일반함수 O O X O 메서드 X X O O 화살표 함수 X X X X 이제 ES6이후의 함수는 각각 명확하게 3가지로 구분됩니다. ..

클래스와 생성자 함수 비교 자바스크립트에서 어떤 객체를 만들 때 공장처럼 찍어낼 수 있다면 그건 바로 클래스 혹은 생성자 함수를 말하는 것입니다! 바로 정해진 틀을 준비하고 그 안에 값을 넣어주면 찍어내 듯 객체를 만드는 것인데요. 사실 굉장히 생소한 개념이라 어렵게 느껴질 수 있지만 공장에 있는 모형틀을 생각하면서 이해해 나가시면 되겠습니다. 그럼 바로 이전에 배웠었던 생성자 함수를 살펴보고 이어서 클래스도 살펴보겠습니다. //생성자 함수 var Person = (function () { function Person(name) { this.name = name; } Person.prototype.sayHi = function () { console.log('Hi!' + this.name); }; Per..

var 키워드로 선언한 변수의 문제점 이전에 배웠던 var와 let 그리고 const 키워드에 대해 다시 복습하는 시간이 되겠습니다. var 키워드는 우리가 알다시피 변수 중복 선언 허용 함수레벨 스코프에서만 지역변수 적용 변수호이스팅 등의 특징이자 문제를 가지고 있습니다. 이것이 문제인 이유는 우리가 변수를 선언하고 값을 이용할때 일정한 규칙이 없다면 값을 추적하기 어려워지고, 이는 우리가 원하는 기능을 구현하는데 걸림돌이 되기 때문입니다. 값을 할당하지 않았는데 오류가 발생하지 않는다는 것은 우리가 어디서 잘못된 코드를 작성했는지 알기 어려워지기 때문에 기본적인 코딩에서 선언 전에 값을 참조하면 안된다는 암묵적인 규칙에 어긋나게 됩니다. let 키워드 위와 같은 var 키워드의 문제점을 보완하고자 새..

변수의 생명 주기 변수는 이전에 배운 스코프에 따라 생명주기가 결정됩니다. 만약 전역스코프에서 선언되었다면 코드가 끝날 때까지가 생명주기이겠고, 지역스코프에서 선언되었다면 코드블록이 끝날 때까지가 생명주기입니다. var x = 'global'; // ----------- // | function goo() { // ----| | var x = 'local';// 지역스코프 | consol.log(x); // | | return x; // ----| | } // | // 전역스코프 foo(); // | console.log(x); // ------------- 전역 변수의 문제점 암묵적 결합 전역변수는 코드 전체에서 사용하기 위해 선언을 하게 되는데 그렇게 하다보니 지역변수 속에서 의도치 않게 값이 변경될..

스코프란? 스코프는 사전적인 의미로 범위를 말합니다. 어떤 변수 혹은 값이 제 역할을 할 수 있는 범위를 말하는 것입니다. 우리가 코드를 작성할 때 들여쓰기로 각 영역을 보기 좋게 구분하는 것도 일종의 범위를 보기 위함인데요. const foo = 123 const bar = 'go!' function start(x, y) { return x+y; } 이제 조금 더 자세히 알아보겠습니다. 스코프의 종류 전역스코프와 지역스코프 두가지가 존재합니다. 전역스코프는 코드 전체에서 참조할 수 있는 범위(변수)를 말합니다. 지역스코프는 마치 상자 속 세상처럼 밖에서는 참조할 수 없고 그 안에서만 참조할 수 있는 범위(변수)를 말합니다. 그래서 우리는 전역변수를 함수 속에서도 참조할 수 있으며, 조건문밖에서도 참조할..

함수란? 함수는 입력을 받아 출력을 내보내는 일련의 과정을 의미합니다. 즉 일정한 로직을 코드로 구현하고, 코드상에서는 블록으로 닫아 실행단위로 구분한 것을 말합니다. 함수으 구성요소는 다음과 같습니다. function add (x, y) { return x+y; } add(2, 5); add는 함수의이름을 뜻하고, x와 y는 매개변수를 의미합니다. 그리고 함수가 실행되고 return 키워드를 통해 값을 반환하게 되지요. 함수를 실행할 때 들어가는 2, 5를 인수라고 합니다. 함수를 사용하는 이유 함수는 실행단위로 묶은 코드 블록입니다. 따라서 언제든 원하는 기능을 정의하고 그대로 인수만 바꿔 적용하면 보다 코드를 간결하게 유지할 수 있습니다. 재사용성이 좋다고 할 수 있겠네요. 함수 리터럴 함수도 역시..