📌 목차 믹스인 패턴이란? 믹스인 패턴 믹스인 패턴 심화 결론 📌 믹스인 패턴이란? 재사용 가능한 함수들을 객체나 클래스에 추가하는 패턴입니다. Vue와 React에서도 비슷한 예제를 찾아볼수 있는데 Vue의 예시는 아래와 같습니다. // mixin.js export default { method: { greet() { console.log("Hello World!"); } } } import mixin from './mixin' export default { mixins: [mixin], created() { console.log(this.greet()); } } 그럼 자바스크립트에서 이걸 어떻게 표현할 수 있는지 한번 볼까요? 📌 믹스인 패턴 class Dog { constructor(name) { ..
📌 목차 Introduction What is proxy? Basic Example of Proxy Conclusion Reference 📌 Introduction 안녕하세요. 이번에 Vue3 공부와 나만의 프레임워크 만들기에서 나온 Proxy라는 개념이 생소하여 개념을 정리한 글입니다. 📌 What is proxy? Proxy객체는 자바스크립트에서의 기본 작업에 대한 행위에 대해 사용자 커스텀 동작을 정의할 때 사용합니다. 기본적인 Proxy 사용: new Proxy(target, handler); target은 Proxy로 랩핑할 대상 객체를 지정해주고 handler는 Proxy의 동작을 정의하는 함수 객체를 넣어줍니다. 📌 Basic Example of Proxy 만약 핸들러를 지정을 해주지 않는다..
📌 목차 Introduction What is call? What is apply? What is bind? Usage Conclusion Reference 📌 Introduction 안녕하세요. 이번 포스팅에서는 가장 헷갈리는 call, apply, bind에 대해서 알아보겠습니다. 📌 What is call? 먼저 call을 정의하기 전에 해당 예제를 봐주세요. const example = (a, b, c) => { console.log(a + b + c); }; example(1, 2, 3); // 6 example.call(null, 1, 2, 3); // 6 example을 실행시킨 것과 마찬가지로 example.call도 똑같은 결과를 보냅니다. 눈치를 채신분도 있겠지만 call의 첫번 째 인..
📌 목차 Introduction Module Pattern 이란? Moudle Pattern 구현 Module Pattern의 장단점 Conclusion Reference 📌 Introduction 안녕하세요! 이번 포스팅에서는 자바스크립트에서 module pattern에 대해서 공부해보겠습니다.🎉 Singleton 패턴과는 비슷하지만 Singleton처럼 하나의 instance만 만드는것이 아닌 다수의 instance를 만드는 것이 module pattern 입니다! 📌 Module Pattern 이란? Module pattern이란 전체 어플리케이션 일부를 독립된 코드로 분리하여 만드는 것 입니다. 다른 여타 프로그래밍 언어처럼 자바스크립트는 접근 제한자(public, private,...)가 없기 ..
목차 1. 서론: reduce.. 너 이런놈이었어? 2. 본론: reduce의 참된 사용 3. 결론: reduce의 강력함 📌 서론: reduce.. 너 이런놈이었어? Javascript를 쓰면서 reduce는 이상하게 잘 사용하지 않았다. 하지만 이제 reduce의 강력함을 알고 그 사용법을 공유하고자 한다. 기본적인 책에서 나오는 reduce문법을 먼저 소개하고 그뒤에 실사용의 예제를 소개하고자 한다. 📌 본론: reduce의 참된 사용 기본적인 문법: const temp = [1, 2, 3, 4, 5]; temp.reduce((a, c) => a + c, 0); // 15 간단하게 1 부터 5까지 더하는 reduce를 작성해보았다. reduce의 첫번째 인자로는 call-back function이 ..
