codinghatso

일반함수의 this와 화살표 함수의 this의 차이점을 알아본다. * 메서드 : 객체의 속성으로 만들어진 함수를 의미 함수가 선언된 위치와 상관없이 호출된 객체를 가르키는 this의 특징을 다이나믹 바인딩 혹은 런타임 바인딩이라고 불림 왜냐하면 일반함수가 호출되는 런타임 시점에 결정되기 때문이다. 일반함수는 누가 호출했는지 화살표함수는 선언된 위치에 의해서 결정이 된다. 해당 위치의 this를 그대로 받아온다. 이상적인 일반함수와 화살표함수의 사용법 const object = { name: 'hatso', main: function () { setTimeout(() => { console.log(this) }, 1000); const sayName = () => { console.log(this.name..

함수 선언식 function main(){ console.log('hello'); } 호이스팅 O 익명함수 사용 X 매개변수를 명시하지 않아도 arguments 변수로 인자를 할당 O 함수 표현식 const main = function() { console.log('hello'); } main(); 호이스팅 X 익명함수 사용 O 매개변수를 명시 하지 않아도 arguments 변수로 인자를 할당 O 화살표 함수 const main = () => { console.log('hello'); } main(); 화살표 함수는 익명함수 때문에 표현식에 사용됨 매개변수를 명시해야 합니다. arguments 변수로 자동 할당 X const main = (...args) => { console.log(args); } m..

자바스크립트의 Array는 객체(함수)이기 때문에 new Array()로 특정 길이의 배열을 생성할 수 있지만 초기값이 undefined로 설정되는 문제가 있다. 하드코딩을 통한 초기값 지정 방법이 있지만 좋은 방법은 아닌 듯합니다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/from Array.from() - JavaScript | MDN Array.from() 메서드는 유사 배열 객체(array-like object)나 반복 가능한 객체(iterable object)를 얕게 복사해 새로운Array 객체를 만듭니다. developer.mozilla.org Array.from() 메서드는 유사 배열..

참고 : Link - ( https://ko.javascript.info/destructuring-assignment ) 객체와 배열은 자바스크립트에서 가장 많이 쓰이는 자료 구조입니다. 키를 가진 데이터 여러 개를 하나의 엔티티에 저장할 땐 객체를, 컬렉션에 데이터를 순서대로 저장할 땐 배열을 사용하죠. 개발을 하다 보면 함수에 객체나 배열을 전달해야 하는 경우가 생기곤 합니다. 가끔은 객체나 배열에 저장된 데이터 전체가 아닌 일부만 필요한 경우가 생기기도 하죠. 이럴 때 객체나 배열을 변수로 '분해’할 수 있게 해주는 특별한 문법인 구조 분해 할당(destructuring assignment)을 사용할 수 있습니다. 이 외에도 함수의 매개변수가 많거나 매개변수 기본값이 필요한 경우 등에서 구조 분해(..

문장 (statements) 어떤 동작이 일어나도록 작성된 최소한의 코드 덩어리 표현식 (expressions) 결과적으로 하나의 값이 되는 모든 코드 * 표현식은 표현식인 문장과, 표현식이 아닌 문장으로 나뉜다. 구분법은 1. 변수에 할당하거나 아규먼트로 전달해보는 방법. 2. 세미콜론 ; 은 표현식 { } 중괄호는 문장으로 구분 가능. * 때문에 내가 작성할 코드도 위를 인지하여 작성할 필요가 있다.

nullish 병합 연산자(nullish coalescing operator) ??를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 ‘확정되어있는’ 변수를 찾을 수 있습니다. a ?? b의 평가 결과는 다음과 같습니다. a가 null도 아니고 undefined도 아니면 a 그 외의 경우는 b nullish 병합 연산자 ??없이 x = a ?? b와 동일한 동작을 하는 코드를 작성하면 다음과 같습니다. x = (a !== null && a !== undefined) ? a : b; 예시 let firstName = null; let lastName = null; let nickName = "바이올렛"; // null이나 undefined가 아닌 첫 번째 피연산자 alert(firstName ?? las..

Javascript는 함수형 개발 언어에 최적화 되어있습니다. 우리가 개발을 할 때 함수를 만들때는 주의사항이 있습니다. 함수는 항상 어떤 목적을 수행하기 위한 하나의 기능 단위로 만들어져야 한다는 것입니다. 함수를 사용하는 이유 1. 여러가지 기능을 하는 코드를 한 단어로 묶고 싶을 때(그리고 나중에 재사용할 때) 2. 입출력기능을 만들 때 Arrow fucntion 장점 1. 함수 본연의 기능을 아주 잘 표현하는 문법입니다. 함수 본연의 입출력기능을 아주 직관적으로 잘 표현해줍니다. input을 집어 넣어 output을 출력하는 함수의 본 개념을 뜻함. 파라매터로 값을 받아 return을 이용하여 뱉어내는 것. 2. 소괄호 생략이 가능합니다. var someFunc = x => { return x *..

JS는 window라는 거대한 오브젝트 안에서 구현되는 형식을 취하고 있다. 전역에서 this를 출력하면 window 오브젝트가 호출되는 모습을 볼 수 있다. window는 모든 전역변수, 함수, DOM을 보관하고 관리하는 전역객체이다. this는 나를 담고 있는 오브젝트를 출력해준다. function person(){ this.name = 'kim' } 여기에서 this는 새로 생성되는 오브젝트(instance)이다. constructor(생성자) 안에서 사용하면 constructor로 새로생성되는 오브젝트를 뜻합니다. constructor는 오브젝트를 복사해서 생성해주는 장치입니다.