자바 스크립트에서 배열에 접근할 때 다른 언어들과 유사하게 index 값을 활용한다. index는 위치를 기준으로 정의된 값이다. 배열에서의 index는 배열 시작으로부터 몇 번째에 위치하느냐를 가리키는 위치 값입니다. 따라서 배열의 첫 번째 값에 접근할 때 inde
콜백함수 > map과 forEach와 유사한 콜백함수이다. map과 forEach와는 다른 점이 있는데 > 이는 Reduce의 파라미터를 정리하고 설명하겠다. 파라미터
문자열의 길이 여러 문자열 연결하기 특정 문자열을 반복하는 새 문자열 생성하기 특정 문자열이 포함되어 있는지 확인하기 문자열의 특정 부분을 바꾼 새 문자열 생성하기 문자열의 일부를 잘라낸 새 문자열 생성하기 좌우 공백문자를 제거한 새 문자열 생성하기 좌우
배열 뒷부분의 값을 삭제한다.배열 뒷부분에 값을 삽입배열 맨 앞에 값을 삽입한다.배열 맨 앞의 값을 삭제한다.배열의 특정위치에 요소를 추가하거나 삭제한다.배열의 startIndex부터 endIndex까지(endIndex는 불포함)에 대한 shallow copy를 새로운
일반적으로 객체에서 this는 그 해당 객체를 가리킨다.보통 사용하는 예제이다.그러나 화살표 함수에서의 this는 일반함수와 달리 자신만의 this를 가지지 않는다.화살표 함수 내부에서 this를 사용하면 그것은 외부에서의 값, 즉 전역객체를 가리킨다.이 전역객체는 브
var는 한번 선언된 변수를 다시 사용할 수 있다.var는 선언하기 전에 사용할 수 있다.var로 선언된 변수는 호이스팅이 적용된다.호이스팅이란 스코프 내부 어디서든 변수 선언은 최상위에선언된 것 처럼 동작하는 것이다.호이스팅은 스코프 단위로 동작한다.할당 자체는 호이
라는 객체가 있을 때 이 코드는 다음과 같이 작성될 수 있다.이렇게 사용하면 변수 a에 할당된 값이 들어간다. 이를 Computed property 라고 한다.이렇게 대괄호 안에 식 자체를 넣는 것도 가능하다.
Object.assign(), Object.keys(), Object.values(),Object.entries(), Object.fromEntries()
[JavaScript] Symbol
Destructuring assignment > 번역하면 구조 분해 할당이다. > 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게하는 표현식이다. 배열 구조 분해 > 기본적인 사용 방식은 다음과 같다. >> 응용 예제1 : split > split을
다음과 같은 코드가 있다. 세 개의 함수 호출 구문은 에러를 발생하지 않고 정상 작동한다.자바스크립트에서 함수에 넘겨주는 파라미터의 수는 정해져 있지 않다.즉, 함수에 정의된 파라미터 개수와 호출 시 넣는 파라미터의 수를 일치시키지 않아도 된다.arguments로 접근
자바스크립트에서 스크립트 전체, 코드블록 등은 어휘적 환경(Lexical Environment)를 가진다.클로저는 함수와 어휘적 환경의 조합이다.함수가 생성될 당시의 외부 변수를 기억하고생성된 이후에도 계속 접근이 가능하다.처음 코드가 실행되면 자바스크립트 내에서 선언
지정한 시간 이후 해당 함수를 실행하도록 설정하는 메소드이다.파라미터 : 실행할 함수, 시간(ms), 함수에 들어갈 파라미터(생략가능)예정된 setTimeout()를 제거한다.파라미터 : 실행될 setTimeout의 변수명지정된 시간마다 설정한 함수를 실행한다.파라미터
일반적으로 function에서 this는 window 객체를 가리킨다.call 메소드는 모든 함수에서 사용할수 있으며 this 를 특정값으로 지정할 수 있다.매개변수 : this로 지정할 객체, 해당함수의 파라미터들apply는 함수 매개변수를 처리하는 방법을 제외하면
[JavaScript] Math Methods
객체가 Property 가지고 있는지 확인하는 메소드객체에서 property를 읽고 없으면 proto 에서 읽는다. 프로토타입에 있는 메소드들은 오버라이딩 된다.다음과 같은 코드가 있다고 가정하자. 이 코드를 보면 drive() 메소드 및 변수 wheels가 모든 객체
Class 는 ES6에 추가된 스펙이다. Class를 통해서 생성자를 만들 수 있다.생성자 함수와 다르게 Class 내부의 메소드들은 생성자의 Prototype에 저장된다.메소드 사용법은 동일하다.class는 사용자의 편의를 위해서 만들어졌다.class는 생성자 함수와
프로미스는 자바스크립트 비동기 처리에 사용되는 객체이다. 여기서 자바스크립트의 비동기 처리란 ‘특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성’을 의미합니다사용법은 다음과 같다.resolve는 성공했을때 실행하는 함수이고,
함수의 실행을 중간에 멈췄다가 재개할 수 있는 기능이다.function 옆에 \* 을 적어서 사용하고 내부에 yield 키워드를 사용한다.yield에서 함수의 실행을 멈출 수 있다.Redux Saga에서 많이 사용된다.Generator 함수를 실행하면 Generator
문자열과 문자열을 비교한다.문자열 배열 정렬 시 가독성 좋은 코드를 만들 수 있지만 속도가 매우 느리다.
동등 비교 연산자(==) 에서 피연산자들의 타입이 같지 않은 경우암묵적 타입 변환을 하여 타입을 일치 시킨 후 비교를 하는데바로 불리언 값을 반환하는게 아니라 truthly 인지 falsey 평가한 후이 값을 불리언 타입으로 암묵적 타입 변환한 값을 반환한다.falsy
자바스크립트로 구현한 순열, 조합입니다.
~ tilde 연산자는 Bitwise NOT 이라는 자바스크립트 연산자이고 두개 연달아서 붙여 양수 앞에서 사용하면, Math.floor와 동일한 효과가 있다.\~~연산자가 Math.floor 연산자 보다 조금 더 빠르다.
브라우저에서만 실행할 수 있었던 JavaScript 파일을 Java나 Python처럼브라우저가 아닌 환경에서 실행할 수 있게끔 만든 도구이다.Java나 Python 에서는 여러 사람들이 만든 기능들을 커뮤니티에 올리고공유하는 문화가 있었는데 (Java->Maven, P
document, Element 관련 메서드 간단정리
function(param, paramN, …name) { }분리하여 받은 파라미너틀 배열로 결합한다. 만약 같은 이름의 key가 있으면 맨 마지막에 있는 것으로 덮어씌워진다.
오른쪽에서 왼쪽으로 계산한다. 먼저 3의 2승을 구한다. -> 6이후 2의 6승을 구한다. -> 64
자바스크립트는 IEEE 754에 정의된 64비트 부동 소수점으로 수를 처리한다.즉, 64비트로 최소값과 최대값을 처리한다.정수와 실수를 구분하지 않는다.1을 1.0로 처리1과 1.2 를 더할 수 있음sign63번지부호 표기 비트값이 0이면 양수, 1이면 음수
아주 작은 값이다.2.220446049250313e-162^-52이러한 결과가 나오는 이유는 IEEE 754 기반이기 때문이다.이러한 미세한 값 차이로 일치하지 않을 때 사용한다.값 차이가 Number.EPSILON 보다 작으면 true 반환분모 값에 아주 작은 값을
파라미터 타입 이 Number 인지 아닌지 체크한다. NaN 도 Number 타입이다.파라미터 값 자체 가 NaN 인지 체크한다.
파라미터 값을 Number로 암묵적 타입 변환을 하여 체크한다.파라미터 값 원본 으로 체크한다.
JSON 을 이용해서 깊은복사(Deep Copy)
prototype은 생성자 함수의 식별자에서 접근할 때 사용하는 것이고,\_\_proto\_\_ 는 생성자 함수로 만든 인스턴스의 식별자로 접근할 때 사용하는 것이다.간편하게 외우기 : prototype은 하위, \_\_proto\_\_ 는 상위생성자 함수가 생성될 때
모든 특수문자를 일반 문자로 처리한다.첫번째 파라미터에 정해진 객체를 넣고 두번째 파라미터에 변수를 넣어서 조합된 값을 출력한다.정해진 객체의 틀은 {raw: 문자열} 이다.조합 방법은 문자열,변수,문자열,변수...문자열 이 된다.주의할 점은 문자열을 다 사용했을 때
특정한 목적을 가진 내장 Symbol 값들을 의미한다.ECMAScript6 에서 도입된 Symbol은 고유하고 변경 불가능한 데이터 타입으로주로 객체 속성의 키에서 사용된다.Well-Known Symbols은 언어 내에서 내부적으로 사용되는 연산을 나타내는데이를 이용하
key와 value의 컬렉션\[key, value] 형태처럼 작성한다.이때 key에는 다양한 타입을 사용할 수 있다.for-of 문에서 작성한 순서대로 순회한다.new 연산자를 반드시 사용해야한다. 사용하지 않으면 TypeError 가 발생한다.key 의 값과 타입이
Object 만 key로 사용할 수 있는 Map메모리 릭(Memory Leak)을 방지하기 위해서 만들어졌다.obj.sport의 메모리 주소는 1을 참조하고 있었는데 sports의 주소가 2로 바뀌면서 obj.sport를 사용할 수 없게 되었다.이때 obj.sport는
value의 컬렉션\[value1,,, valueN] 형태로 작성된다.작성한 순서대로 전개된다. -> \[Entries] 에 인덱스가 있다.중복된 값을 허용하지 않는다.Symbol.speices(https://velog.io/@narcoker/JavaScrip
개념은 WeakMap과 동일하다.즉, 메모리 릭을 방지하기 위해 나온 빌트인 이다.단 value만 작성하는 것이 다르다.오브젝트만 value 값 으로 사용할 수 있다.value의 참조값이 바뀌면 가비지 컬렉션 대상이 된다.WeakSet 인스턴스에 값을 추가한다.이때 값
자바스크립트는 프로토타입 기반 객체 지향 언어이다.다른 언어와 OOP 개념은 같지만, 클래스 구조와 구현 방법이 다르다.자바스크립트는 prototype에 메서드와 프로퍼티를 연결하고연결된 메소드로 인스턴스를 생성한다.class 키워드에 이어 클래스 이름을 작성한다.이름
기본적으로 객체의 동작을 사용자 정의하는 방법을 제공한다. 이는 객체에 대한 작업을 가로채고, 이를 변경하거나, 새로운 동작을 추가하거나, 기본 동작을 수행하기 전에 작업을 수행할 수 있도록 한다.
Reflect Proxy의 trap과 동일한 메소드들 13개를 가지고 있다. constructor 가 없어서 생성자 함수로 사용할 수 없다. 즉 new 를 사용할 수 없다.
모듈의 확장자는 mjs 를 사용한다.모듈은 독자적인 스코프를 갖는다.<script type="module"></script> : defer 속성이 default 이다.window 글로벌 객체를 사용해서 공유할 수는 있지만 식별자가 겹치면 대체된다.import
비동기 함수를 동기적으로 작동할 수 있도록 하는 키워드정확히 말하자면 async 가 키워드가 아니라 async function 이 키워드이다.원래 비동기 함수는 모든 동기 코드가 실행된 이후에 실행이 된다.하지만 async/await 을 사용하면 비동기 함수를 즉시 실
바이너리 데이터를 저장하는 오브젝트이다.new ArrayBuffer(바이트 수)로 생성하여파라미터에서 사용된 값의 바이트 수만큼 고정적으로 메모리를 할당하여 인스턴스를 생성한다.ArrayBuffer의 값은 직접적으로 CRUD 할 수 없다.간접적으로 TypedArray
ArrayBuffer를 볼 수 있는 뷰로, 버퍼의 이진 데이터를 읽거나 쓸 수 있게 한다.ArrayBuffer는 단순히 메모리 블록을 나타내지만, DataView는 이를 다루기 위한 API를 제공little-endian과 bigendian 바이트 순서를 지원한다.다양한
웹 애플리케이션에서 다중 스레드를 사용하여 백그라운드에서 스크립트를 실행할 수 있게 하는 API이다.이는 자바스크립트가 싱글 스레드 기반이므로 주요 페이지 렌더링 및 사용자 상호작용을 차단하지 않고 복잡한 또는 시간이 오래 걸리는 작업을 수행할 수 있게 한다.Web W
XMLHttpRequest를 사용하여 비동기로 데이터를 송수신하고,받은 데이터를 JSON으로 변경하여 관리를 하고,이 데이터를 DOM에 연결된 HTML(XHTML, HTML 이전 기술)에 연결하되,이 HTML를 CSS 표준 기반으로 프리젠테이션하는 것을JavaScrip
Object로 Resource를 fetch하기 위한 APISOP 제약은 받으나 CORS 가능하다.브라우저 Reuest이벤트 핸들러 작성서버와 연결, 전송방법, URL, 동기/비동기 통신 지정데이터 전송서버상태가 바뀔 때마다 상태를 브라우저로 전송마지막 상태에서 데이터
실행 컨텍스트(EC)렉시컬 환경(LEC) let이나 const 로 선언한 변수 등록, 초기환느 선언된 위치에 따라 다르게 진행환경 레코드(Environment Record) 식별자를 관리하는 컴포넌트선언적 환경 레코드(Declarative Environment Reco
[JavaScript] DOM 알아두면 좋을 정보
Node.js 환경에서 사용되는 모듈 시스템이다. require() 함수와 import 구문를 사용하여 다른 모듈을 가져오고,module.exports 객체를 사용하여 모듈을 내보냅니다.이는 동기 방식으로 작동하므로, 서버 사이드에서 적합하지만 브라우저 환경에서는 별도
코드는 평가, 실행(런타임) 단계로 진행되는데 렉시컬 환경은 평가 단계 이전에 생성평가 시 var로 선언한 변수는 undefined, 함수 선언문은 함수 코드 내용전역 렉시컬 환경객체 환경 레코드BindingObject: var 로 선언한 변수 - undefined,
조건문 내부에서의 빈 배열은 true로 취급한다.빈 배열도 객체로 취급하는 Javascript의 특성 때문이다.추가로 대표적인 Falsy 한 값은 다음과 같다.이 외의 값들은 Truthy 한 값으로 취급한다.false null undefined 0 NaN ''조건문에서
?? 연산자는 값이 null 또는 undefined인 경우에만 대체값을 지정하는 데 사용되고,?. 연산자는 속성이나 메소드에 안전하게 접근할 수 있도록 할때 사용한다.모두 JavaScript의 상대적으로 최신의 기능으로, 둘 다 코드를 더욱 안전하고 간결하게 만드는 데