mixin 2

class - mixin

1. mixin 자바스크립트는 단일상속만을 허용합니다. 객체에는 단 하나의 [[ Prototype ]] 만 존재할 수 있고, 클래스는 단 하나의 클래스만 상속 받을 수 있습니다. 이런 제약에서 벗어나기 위해 mixin 을 사용할 수 있습니다. mixin이란 특정 행동을 실행해주는 메서드를 제공하는 객체입니다. 이 객체를 다른 클래스에 병합해 사용합니다. let helloMixin = { sayHello(){ console.log(`Hello ${this.name}`) } } class User { constructor(name){ this.name = name; } } Object.assign(User.prototype, helloMixin); new User('Bob').sayHello(); // 'H..

react - SCSS

자 이제 SCSS가 무엇이냐 하면 CSS를 프로그래밍 언어스럽게 작성가능하게 만드는 친구임 CSS에서 변수, 연산자, 함수 등등 요런 아이들을 사용할 수 있게 해주는 친구란다. 근데 또 이걸 쓰려니깐 브라우저는 SCSS 문법을 모른다. CSS 문법을 알고 있을뿐 그래서 SCSS로 짜놓은 것을 CSS로 컴파일 해주는 친구가 필요함. 고로 터미널에 npm install node-scss ㄱㄱ 이 친구가 그 친구임. 사용법은 아주 간단하다. Detail.js 파일에 대한 SCSS 파일을 만들었다. 위 사진처럼 기본적인 셋팅을 하고나서 본격적으로 문법을 배워보자. 첫번째 SCSS에서는 변수에 데이터를 저장해서 쓸 수 있다. 내가 자주 사용할 색상이 있다면....? 위에 사진에서는 '#ff0000'이라는 색상을 ..

Frontend/React 2021.06.09