blog

https://vc-xz.tistory.com/152 이미 한번 정리했던 내용이지만 apply,bind,call에 대해 이해가 완벽하지 않은것같아서 다시 정리한다. 위 글이랑 같이 보면 좋음. apply 메소드 *사용법: function.apply(thisArg, [argsArray]) -apply 메소드는 함수를 호출하면서 this 값을 지정하고, 배열 형태로 인수를 전달하는 역할을 한다. -thisArg: 함수 내부에서 사용할 this 값을 지정한다. (선택사항이며, null 또는 undefined일 경우 전역 객체를 가리킴.) -argsArray: 배열 형태로 함수에 전달할 인수들을 지정한다. function greet(name) { console.log(`Hello, ${name}!`); } gr..

링크드 리스트(Linked List)는 데이터 요소들을 노드(Node)라고 하는 객체로 구성된 선형 데이터 구조이다. 각 노드는 데이터 필드와 다음 노드를 가리키는 링크(포인터)로 이루어져 있다. 링크드 리스트에서는 데이터 요소들이 순차적으로 저장되는 것이 아니라 각 노드들이 연결(linked)되어 있음. 링크드 리스트의 특징 동적 크기: 링크드 리스트는 동적으로 크기를 조정할 수 있다. 새로운 노드를 삽입하거나 기존 노드를 삭제하는 등의 연산을 통해 크기를 변경할 수 있음. 삽입 및 삭제의 용이성: 링크드 리스트는 특정 위치에 노드를 삽입하거나 삭제하는 것이 배열과 달리 간단함. 단지 링크(포인터)의 변경만으로 삽입 및 삭제를 수행할 수 있다. 메모리의 비효율성: 링크드 리스트는 포인터를 사용하여 노드..

JavaScript와 메모리 관리 JavaScript는 가비지 컬렉터(Garbage Collector)가 메모리 관리를 자동으로 처리해주기 때문에 개발자가 직접 메모리 할당과 해제에 대해 신경쓰지 않아도 된다. 하지만 메모리 할당과 관련된 기본적인 개념과 동작 원리를 이해하는 것은 개발자의 필수 지식..🥲 메모리 할당에 대한 이해를 가지고 있다면 효율적인 코드 작성과 메모리 누수(memory leaks)를 방지하는 데 도움이 될것이다. 예를 들어, 큰 데이터 구조를 다룰 때 불필요한 메모리 할당을 피하고 메모리 사용량을 최적화하는 방법을 고려할 수 있다. 또한 메모리 관리는 다른 언어에서도 중요한 개념이기 때문에 JavaScript 이외의 언어를 다루는 경우가 생길때 도움이 될것이다. 시간복잡도 시간 복..

JavaScript 클로저(closure)는 함수와 해당 함수가 선언된 렉시컬 환경(Lexical Environment)의 조합.(=함수가 선언될 당시의 외부 변수 등의 정보 등이 담겨있는 것) 클로저는 함수 내부에서 정의된 함수가 외부 함수의 변수와 스코프에 접근할 수 있는 메커니즘을 제공한다. 클로저는 내부 함수가 외부 함수의 변수에 접근할 수 있는데, 이때 내부 함수가 외부 함수를 벗어난 후에도 외부 함수의 변수에 접근할 수 있는데, 외부 함수의 변수가 클로저에 의해 "닫힌(closed)" 상태로 유지되기 때문이다. 클로저를 쓰는 이유는? 1. 데이터 은닉화와 정보 보호: 클로저를 사용하여 변수와 함수를 비공개(private)로 만들 수 있다. 내부 함수는 외부에서 직접 접근할 수 없으므로, 변수와..

JavaScript 클래스는 객체 지향 프로그래밍에서 사용되는 구조로, 비슷한 속성과 동작을 가진 객체들을 생성하기 위한 템플릿이다. 클래스는 생성자 함수와 메서드를 포함하며, 이를 통해 객체를 생성하고 사용할 수 있다. 아래는 기본적으로 클래스를 선언하는 코드이다. class ClassName { constructor(parameter1, parameter2) { // 객체가 생성될 때 실행되는 생성자 함수 this.property1 = parameter1; this.property2 = parameter2; } method1() { // 클래스의 메서드 // ... } method2() { // 클래스의 메서드 // ... } } 위의 코드에서 ClassName은 클래스의 이름이다. construct..

제너레이터 함수(Generator function)는 ES6에서 도입된 특별한 종류의 함수이다. 이 함수는 함수 실행을 중간에 일시 중단하고 나중에 다시 시작할 수 있는 기능을 가지고 있는데, 이를 통해 이터레이터(Iterator)를 생성하고, 이터레이터를 통해 값을 생성하거나 전달할 수 있다. 제너레이터 함수의 특징 -함수 내부의 실행을 일시 중단하고, 나중에 재개할 수 있다. -yield 키워드를 사용하여 값을 생성하고, 이터레이터에 반환한다. -이터레이터를 통해 제너레이터 함수의 실행을 제어할 수 있다. function* generateSequence() { yield 'Apple'; yield 'Banana'; yield 'Cherry'; } const sequence = generateSeque..

콜백함수란 무엇일까!? JavaScript에서 콜백 함수는 다른 함수에게 전달되어 나중에 호출되는 함수이다. 콜백 함수는 비동기적인 작업, 이벤트 처리, 타이머 등 다양한 상황에서 사용되는데, 콜백 함수를 사용하면 비동기적인 동작을 다룰 수 있으며, 함수 간의 상호작용과 흐름 제어를 유연하게 구성할 수 있다. 다음은 콜백함수의 예를 알아보자 콜백함수의 예시 1. 함수 인자로 전달하기 다른 함수의 인자로 콜백 함수를 전달하여 해당 함수의 특정 작업이 완료된 후에 콜백 함수를 호출할 수 있다. 이때, 콜백 함수는 보통 인자로 결과나 추가 동작을 받는다. function fetchData(url, callback) { // 비동기적인 데이터 요청 // 요청이 완료되면 콜백 함수 호출 const data = ...

Promise Promise는 비동기 작업을 처리하기 위한 객체로, 비동기 작업의 성공 또는 실패를 나타내는 결과를 나중에 반환하거나 전달하는 역할을 함. Promise는 콜백 지옥(callback hell)을 피하고 비동기 코드를 더 명확하고 구조화된 방식으로 작성할 수 있도록 도와줌. function asyncOperation() { return new Promise((resolve, reject) => { // 비동기 작업 수행 setTimeout(() => { var result = ...; // 비동기 작업 결과 if (/* 성공적인 조건 */) { resolve(result); // Promise를 이행하고 결과 반환 } else { reject(new Error("작업 실패")); // Pr..

유사 배열 객체는 배열과 유사한 동작을 하는 객체를 말한다. 유사 배열 객체는 배열처럼 인덱스를 통해 요소에 접근할 수 있고, length 속성을 가지고 있다. 하지만 배열의 메서드를 직접 사용할 수는 없다! 1. arguments 객체 함수 내에서 사용되는 특별한 객체로, 함수에 전달된 인자들을 유사 배열 객체로 나타냄. function sum() { console.log(arguments); // [1, 2, 3] (arguments 객체는 유사 배열 객체로 함수에 전달된 인자들을 나타냄) console.log(arguments.length); // 3 (전달된 인자의 개수) } sum(1, 2, 3); 2. NodeList 객체 DOM 요소를 선택한 결과로 반환되는 객체. querySelectorA..

다른 객체지향 언어에서의 this는 곧 클래스로 생성한 인스턴스를 말함. 그러나 자바스크립트에서는 this가 어디에서나 사용될 수 있다. 전역 공간에서의 this 전역 공간에서 this는 전역 객체를 가리킨다. 런타임 환경에 따라 this 는 window(브라우저 환경) 또는 global(node 환경)을 의미한다. console.log(this); // window console.log(this); // global 함수에서의 this 함수를 단순히 호출할 때는 호출 주체를 알 수없다. 고로 this는 전역 객체(window, global) 또는 undefined를 가리킨다. function sayHello() { console.log(this); } sayHello(); // 전역 객체(window ..