전체 글30 [Javascript] 렉시컬 스코프란? 렉시컬 스코프는 정적 스코프라고도 부른다. 렉시컬 스코프는 함수를 어디서 정의했는 지만 확인한다. 즉, 어디서 호출하였는 지는 전혀 중요하지 않다는 뜻이다. 자바스크립트 언어는 렉시컬 스코프 방식을 채택하였다. 아래 코드를 보면서 렉시컬 스코프를 이해 해보자. var x = 1; function foo() { var x = 10; bar(); } function bar() { console.log(x); } foo(); //1 bar(); //1 첫번째 foo()함수가 호출 되었을 때 foo() 스코프 안에서 x=10인 상태로 bar()를 호출하였음에도 1이 출력된다. 왜냐하면 함수를 정의한 곳은 전역 스코프기 때문에 전역 스코프에 선언된 x를 출력하는 것이다. 이에 반대되는 개념은 동적 스코프이다. 동.. 2023. 2. 25. [Javascript] 함수 파라미터의 기본 값 설정 방법 세가지 함수안에 파라미터(인자)의 기본값을 주는 방법은 여러가지가 있겠지만 대표적으로 3가지가 있다. 1. 가장 직관적인 방법 //문 const add = (a, b) => { if (a == undefined) a = 0; if (b == undefined) b = 0; return a + b; } console.log(add(1, 2)); //3 console.log(add(1)); //1 console.log(add()); //0 //표현식 const add = (a, b) => { a = a ? a : 0; b = b ? b : 0; return a + b; } console.log(add(1, 2)); //3 console.log(add(1)); //1 console.log(add()); //0 직관적.. 2023. 2. 18. [Javascript] 원시 타입 vs 객체 타입 메모리 사용법 비교 자바스크립트에서 원시 타입은 (number, string, boolean, null, undefined, symbol) 을 말한다. 이외의 모든 값은 객체 타입의 값이다. 두 타입의 차이점은 다음과 같다. 1. 원시값은 메모리에 직접 값이 들어가고, 객체 타입은 참조하고있는 메모리 주소 값이 들어간다. 2. 원시 타입은 값이 변경 불가(immutable)하고 객체 타입은 값이 변경 가능하다. (값이 변경 불가하다는 것이지 재할당은 가능하다.) 먼저 객체 타입은 immutable하지 않고 값을 변경 가능하기에 갖는 장단점이 있다. 장점 : 깊은 복사를 하지 않아 메모리를 덜 사용한다. 단점 : 데이터 신뢰성이 낮다. var person1 = { name: 'Choi' } person2 = person1; .. 2023. 2. 12. [Javascript] 객체 프로퍼티 (key, value) 동적으로 생성 및 조회하기 실무를 하다보면 객체의 key value값을 동적으로 할당해야 할 때가 많다. 이럴경우 객체 표현식중 대괄호를 사용하여 쉽게 생성할 수 있다. var prefix = 'prefix'; var i = 0; var obj = {}; for (i; i < 3; i++) { obj[prefix + '-' + i] = i; } console.log(obj); // { 'prefix-0': 0, 'prefix-1': 1, 'prefix-2': 2 } 이렇게 생성된 obj 객체를 조회하는 방법은 다음과 같다. 방법1. for..in 문법 이용 for (var key in obj) { console.log(key + ":::" + obj[key]); } 방법2. Object.keys 함수를 이용 var objKeyAr.. 2023. 2. 9. [Javascript] 객체 프로퍼티 접근 방법 객체의 프로퍼티는 마침표(.)와 대괄호 []로 접근이 가능하다. 프로퍼티의 키가 식별자 네이밍 규칙을 따를 경우에만 마침표(.)접근이 가능하다. 예를 들어 다음과 같은 person 객체가 정의되어 있다. var person = { firstName: 'JunSung', 'last-name': 'Choi', 1: 10 }; person 객체의 각각의 프로퍼티에 접근할 수 있는 방법은 다음과 같다. var person = { firstName: 'JunSung', 'last-name': 'Choi', 1: 10 }; console.log(person.firstName) // JunSung console.log(person['firstName']) // JunSung console.log(person['las.. 2023. 2. 9. [Javascript] null 병합 연산자(??) ES11에서 도입된 null 병합 연산자(??)에 대해 알아보자. 정의는 좌항의 피연산자가 null 또는 undefined인 경우 우항, 그렇지 않으면 좌항을 리턴한다. 간단하게 [null, undefined]만 false 취급한다고 생각하면 쉽다. var elem = null; var value = elem ?? 'default value'; console.log(value) // default value 따라서 기본값을 설정할 때 유용하게 사용할 수 있다. function getString (str) { console.log(str) // undefined str = str ?? 'Default String'; return str; } console.log(getString()) // Default .. 2023. 2. 9. 이전 1 2 3 4 5 다음
