자바스크립트

수민·2022년 9월 28일
0

프론트엔드

목록 보기
25/48

논리적 연산자 - 요약
다음은 다시 복습, 혹은 출력을 위한 참고자료로 JavaScript에서 논리 연산자와 비교 연산자가 어떻게 작동하는지에 대한 간단한 요약입니다.

const userName = 'Max';
const altName = '';
console.log(userName === 'Max'); // 불리언 값 참을 생성하고 출력
console.log(userName); // 문자열 'Max'에서 변경되지 않음

console.log(userName || null); // userName이 Truthy이므로 ||로 'Max'가 반환됨
console.log(altName || 'Max'); // altName은 (빈 문자열이므로)Falsy이며 'Max'가 반환됨
console.log(altName || ''); // altName과 ''는 모두 Falsy이지만 만일 첫 피연산자가 Falsy라면 항상 두 번째 피연산자가 반환되므로 ''이 반환됨

console.log(altName || null || 'Anna'); // altName과 null은 Falsy이므로 'Anna'가 반환됨

console.log(userName && 'Anna'); // userName은 Truthy이므로 두 번째 (!) 값인 'Anna'가 반환됨
console.log(altName && 'Anna'); // altName은 Falsy이므로 첫 번째 값인 ''이 반환됨
console.log(userName && ''); // userName은 Truthy이므로 두 번째 값인 ''이 반환됨
항상 명심하세요. 그 어떤 연산자 (===, > 등이나 && 혹은 ||)도 비교에 쓰이는 변수를 변경하지 않습니다. 위의 예에서 userName 과 altName에 저장된 값은 절대 변경되지 않습니다.

===, >등은 단지 비교에 쓰이는 불값만 생성합니다. || 와 && 는 불리언을 생성하는 것이 아니라, 연산자 전후에 있는 값을 조건으로 취급합니다 (따라서 불값을 산출하고 필요한 경우 불리언으로 강제 변환됩니다).

위에서 설명한 작동 방식 때문에 JavaScript에서는 || 으로 변수/상수에 기본/대체 값을 할당합니다.

const enteredValue = ''; // let's assume this is set based on some input provided by the user, therefore it might be an empty string

const userName = enteredValue || 'PLACEHOLDER'; // will assign 'PLACEHOLDER' if enteredValue is an empty string

for-of 배열을 위한 반복문
for-in은 객체를 위한 반복문
키-값쌍과 객체의 접근

var vs let vs const

const-상수를 생성
var,let-
함수밖에서 생성하면 전역변수고
함수안에서 생성하면 지역변수이다.

1) JavaScript 언어
핵심 구문(let, const 등)은 이해하지만 예를 들어 DOM에 대해서는 아무것도 모릅니다.

2) Browser API
코드를 이해할 책임이 없는(이는 1)이 하는 역할입니다) 대신 스크립트 코드 내부에서 사용할 수 있는 DOM API와 같은 API를 노출해야 합니다.

JavaScript 언어(1)는 Ecma 조직의 일부인 그룹인 Ecma International Technical Committee 39(TC39)에 의해 발전되었습니다. JavaScript 언어 자체에 새로운 기능을 추가하는 일을 담당합니다. 예를 들어 과거에는 let및 const를 추가하는 역할을 하기도 했죠.

TC39에 대해서는 이 링크에서 자세히 알아볼 수 있습니다. https://tc39.es/

그리고 해당 그룹에서 논의 중인 현재 제안, 즉 향후 핵심 JavaScript 언어로 만들 가능성이 있는 기능을 탐색할 수 있습니다. https://github.com/tc39/proposals

중요한 참고 사항. 한 기능이 언어에 포함된다고 해서 모든 JavaScript 엔진이 해당 기능을 즉시 지원한다는 의미는 아닙니다 . 물론 엔진을 개발하는 사람들은 가능한 한 빨리 지원을 제공하기 위해 최선을 다하겠지만 그 과정에도 시간이 걸립니다.

반면에 엔진 공급업체는 때로는 TC39가 기능을 JavaScript의 공식 부분으로 만들기 전에 특정 기능을 지원하기 시작하기도 했습니다. 결국 JS 엔진이 이해하는 구문을 결정하는 것은 전적으로 엔진을 작업하는 사람들에게 달려 있기 때문입니다.

브라우저 API 또한 다양한 브라우저 공급업체(Chrome용 Google, Edge용 Microsoft 등)가 기능 패리티와 (대략) 유사한 API를 제공하고자 표준화되었습니다. 스크립트가 다른 브라우저에서 작동하도록 하기 위해 다른 기능을 호출해야 한다면 훌륭한 개발자 경험이라고 할 수 없겠죠. 하지만 과거에는 이런 경우가 대부분이었습니다.
다음 자료들이 도움이 될 수 있습니다 - 그 중 일부는 매우 심화된 내용을 담고 있다는 점에 유의해 주세요.

JavaScript 메모리 관리에 대한 추가 정보 (가비지 컬렉션): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management

V8의 가비지 컬렉션 논리: https://v8.dev/blog/free-garbage-collection

V8의 JavaScript 엔진의 세부사항: https://hackernoon.com/javascript-v8-engine-explained-3f940148d4ef

원시 값 vs 참조 값에 대한 추가 정보: https://academind.com/learn/javascript/reference-vs-primitive-values/

profile
헬창목표

0개의 댓글