FEDev Story

참고문서 : Beautiful Javascript 다음 조건문은 프로퍼티가 존재하는지 확인한다. 만약 존재하지 않으면 메서드를 호출한다. if ( !this.username ) { this.setUsername(); } username이 없으면 username 을 설정한다. 그러나 논리 연산자 OR을 사용하면 더욱 간결한 방법으로 같은 것을 표현할 수 있다. this.username || this.setUsername() username이 존재하지 않으면 username을 설정한다는 표현식이다. 다음은 username에 대한 배열을 살펴보자. username이 없으면 배열에 username을 추가하고자 한다. if ( users.indexOf(this.username) == -1){ users.push(..

출처 : A fresh look at JavaScript Mixins 믹스인이란 프로토타입을 바꾸지 않고 한 객체의 프로퍼티를 다른 객체에게 ‘복사’해서 사용하는 방식이다. 이 믹스인 패턴은 어디에 쓰일 수 있을까? 이 패턴은 기존에 있던 객체의 기능을 그대로 가져가면서 다른 객체에 추가할 때 주로 사용된다. 예를 들어 이벤트를 지원할 때는 상속보다는 믹스인이 더 어울린다. 아래는 믹스인과 관련된 유용한 정보를 담고 있다. https://vnthf.github.io/blog/mixin/ 아래는 원형, 타원, 네모 버튼을 생성하는 사례를 구현하고자 기능과 동작을 정의하는 전통적인 믹스인 오브젝트를 프로토타입 방식으로 정의하였다. var Circle = function() {}; Circle.prototyp..

웹사이트 제작시 많이 사용되는 webfont는 시스템 폰트보다 훨씬 큰 용량을 차지한다. 그런 이유로 웹폰트 제작업체는 webfont의 로딩후 콜백함수를 호출하는 등 작업에 필요한 API를 제공하는게 보통이다. 하지만 API를 제공하지 않는다면? 페이지를 정상적으로 렌더링하려면 이미지, css, 자바스크립트 등 많은 resource 파일들이 정상적으로 먼저 로딩되어야 한다. 하지만 큰용량을 차지하는 webfont의 로딩을 관리하는 API가 제공되지 않는다면 생각지 못한 오류를 만날 수 있다. fontfaceonload.js fontfaceonload.js (github.com/zachleat/fontfaceonload) 플러그인은 webfont가 정상적으로 로딩되었는지 실패하였는 지에 따라 콜백함수를 실..