728x90 반응형 SMALL 기술 개발/Javascript18 프로토타입과 객체지향 프로그래밍 프로토타입이란? JavaScript는 프로토타입 기반 객체지향 프로그래밍 언어입니다. 클래스 기반 객체지향 프로그래밍 언어는 객체 생성 이전에 클래스를 정의하고 이를 통해 객체(인스턴스)를 생성하지만, 프로토타입 기반 객체지향 프로그래밍 언어는 클래스 없이도 객체를 생성할 수 있습니다. 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있기 때문에, 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용할 수 있게 합니다. 이 때, 부모 객체를 Prototype(프로토타입)이라고 하고, Prototype은 생성자 함수에 의해 생성된 각각의 객체에 공유 프로퍼티를 제공하기 위해 사용합니다. 이는 객체를 생성할 때, 그 객체는 자신의 부모 역할을 하는 프로토타입 객체를 가리키는 [[proto.. 2024. 3. 20. 동기(Synchronous)와 비동기(Asynchronous) 동기(Synchronous)와 비동기(Asynchronous)는 프로그래밍에서 매우 중요한 개념이다. 동기(Synchronous) 동기는 호출하는 함수가 반환하기 전에 작업이 완료될 때까지 기다리는 것을 의미한다. 즉, 호출한 함수는 결과가 반환될 때까지 블로킹(blocking)되며, 결과가 반환된 후에야 다음 코드를 실행할 수 있다. 이러한 특성 때문에, 동기 방식은 순차적인 처리를 보장하고, 코드가 간단하고 직관적이다. 하지만, 작업이 끝날 때까지 대기해야 하기 때문에, 시간이 오래 걸리는 작업을 수행할 때는 성능 이슈가 발생할 수 있다. function func1(){ console.log('func1'); func2(); } function func2(){ console.log('func2'); .. 2023. 4. 16. 순수 함수 (feat. 불변성, 사이드 이펙트) 함수형 프로그래밍 Funtional Programming은 순수함수를 중심으로 Side-Effect가 없도록 프로그래밍을 하는 것을 말한다. 순수함수 (Pure Function) input : 어떠한 함수에서 외부의 데이터를 직접적으로 사용하지 않고, 파라미터로 받는다. output : input값에 의해 output이 결정되기 때문에 외부의 값들이 변경되더라도 함수 자체에는 외부에 영향을 받지 않기 때문에 Side-Effect가 없다. 순수 함수는 동일한 입력에 대해 항상 동일한 출력을 반환하며, 외부 상태를 변경하지 않는 함수를 말한다. 즉, 함수 내부에서 어떤 값이 변경되지 않으며, 외부에서 관찰 가능한 상태에도 영향을 주지 않는 함수다. ex) 더하기 함수 function add(x, y) { r.. 2023. 4. 5. const - 요소나 속성을 추가할 수 있는 이유 const란? const 선언은 블록 범위의 상수를 선언한다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없다. 즉, const로 선언된 배열이나 객체의 경우, 해당 변수를 다른 값으로 재할당하는 것이 불가능하다. 또 다른 말로는, const로 선언된 변수에 다른 값을 할당하려고 하면 에러가 발생한다는 것이다. 하지만, 배열이나 객체의 요소나 속성에 대한 수정은 가능하다. 배열, 객체를 const로 선언했는데 요소나 속성을 추가할 수 있는 이유 const가 변수 자체를 불변으로 만드는 것이 아니라 변수가 참조하는 값의 변경을 막는 것이기 때문이다. 배열이나 객체는 참조 타입이고, const로 선언된 변수가 참조하는 메모리 공간 자체는 변경되지 않는다. 따라서 변수가 참조하는 배열이나 객체의 요소나.. 2023. 4. 3. require vs import 모듈 시스템 4가지 CommonJS (이하 CJS) – NodeJS 환경을 위해 만들어진 모듈 시스템 ES Module (이하 ESM) – ES6 에 도입된 자바스크립트 모듈 시스템 AMD – 가장 오래된 모듈 시스템, require.js 라이브러리를 통해 개발됨 UMD – AMD와 CommonJS 등 모듈 시스템을 함께 사용하기 위해 개발됨 모듈 내보내기, 불러오기 CJS : require, module.exports, exports ESM : import, export, export default CommonJS 문법 require : 가져오기 exports : 내보내기 module.exports : 내보내기 require 특징 NodeJS 에서 사용하고 있는 CommonJS 모듈 키워드 루비 언어 .. 2023. 4. 3. this 가 동작하는 원리와 용법 This JavaScript에서 this는 실행 중인 함수의 컨텍스트를 참조하는데 사용되는 특수한 키워드다. function 키워드로 생성한 일반 함수와 화살표 함수의 가장 큰 차이점은 this이다. 일반 함수의 this 자바스크립트의 경우, 함수 호출 방식에 의해 this에 바인딩할 어떤 객체가 동적으로 결정된다. 즉, 함수를 호출할 때 함수가 어떻게 호출되었는지에 따라 값이 달라진다는 것이다. 함수의 호출하는 방식 함수 호출 메소드 호출 생성자 함수 호출 apply/call/bind 호출 var foo = function () { console.dir(this); }; // 1. 함수 호출 foo(); // window // window.foo(); // 2. 메소드 호출 var obj = { foo.. 2023. 3. 31. 이전 1 2 3 다음 728x90 반응형 LIST
