Javascript

자바스크립트의 프로토타입에 대해

기준 sooopd
2016-08-07
Javascript

객체지향 프로그래밍 언어하면 떠올리는 단어가 바로 “클래스”이고, 실제로 대부분의 객체 지향 성격을 갖는 언어들은 대부분 클래스를 지원한다. 그런데 자바스크립트는 클래스가 아닌 프로토타입 기반의 OOP를 사용한다. 오늘은 이 프로토타입에 대하여 살펴보도록 하겠다.

constructor Object.prototype.constructor constructor는 특정 객체 인스턴스를 생성한 함수 객체를 리턴한다. 나역시 prototype이니, constructor니 하는 것이 보이는 것이 그리 탐탁치는 않지만, 객체 인스턴스를 대량으로 생성해야 하는 상황이라면 이에 대한 기본 지식을 조금 알고 있는 것이 여러 모로 도움이 될 수 있다. var o = {}; o.constructor === Object; // true var a = []; a.constructor === Array; // true var n = new Number(3); n.constructor === Number; // true 컨스트럭터와 프로토타입 다음은 매우 평이한 컨스트럭터 예제이다. 객체가 새롭게 호출되면, 객체는 name이라는… 더 보기 »Javacript – constructor

LiveScript + NodeJS

기준 user
2015-10-20
Javascript

back call

livescript는 자바스크립트로 컴파일되는 스크립트 언어로, 그 문법적 특징이 하스켈
의 것을 많이 참고하고 있다. 예를 들면 괄호없이 함수를 호출한다거나, 함수 파라미
터간의 컴마를 생략할 수 있다거나 하는 것들이 있다.
한 때 흥미삼아서 조금 만져보다가 관뒀었는데, 갑자기 모 사이트에서 NodeJS 튜토리얼을 몇 개 따라해보려다가¹ 생각이나서 그 사이트의 튜토리얼 코드들을 라이브스크립트로 코딩해봤더니 이거 썩 괜찮더라.
특히 화살표(->)를 이용한 익명함수 정의 문법²을 이용해서 함수를 인자로 전달하거나 함수가 함수를 리턴하는 것을 좀 더 간단하게 표기할 수 있게 한다.
예를 들어 이벤트핸들러를 등록하는 코드를 생각해보자.

var xhr = new XMLHttpRequest();
...
xhr.addEventListenser('onload', function(complete){
    console.log(complete.target.responseText);
});

더 보기 »LiveScript + NodeJS

현재 사이트의 쿠키만 제거하는 법

기준 user
2015-07-042022-02-21
Javascript

아래 스크립트는 현재 페이지까지의 경로 내에서의 모든 쿠키의 만료일을 예전 일자로 바꿔서 만료되도록해 삭제한다. 콘솔을 열고 아래 스크립트를 붙여넣고 실행하면 된다. (2022년 기준으로 코드를 좀 더 읽기 좋게 다듬고, 깔끔하게 정리했다.)

날짜 계산 레시피

기준 user
2015-02-17
Cocoa, Javascript, Objective-C, Python, Swift

아주 짧은 기간 사이의 차이를 계산하는 법

Javascript

두 Date 객체를 빼면 그 사이의 밀리세컨드 값이 나온다.

var start = new Date();
/* perform some time-taking work... */
var end = new Date();
console.log(end - start);

정규식을 사용한 비밀번호 유효성 검사

기준 user
2014-08-02
Javascript

정규식의 그룹 패턴 중에 Look-around라는 게 있는데, 특정 패턴의 앞/뒤로 만족하는 패턴이 있는 경우에만 해당 패턴을 만족시키는 케이스를 말한다. 예를 들어 apple(?=s)는 apples의 apple만 매칭되고 apple이나 appled는 매칭되지 않도록 하는 것이다. 이를 활용하여 비밀번호 유효성 검사에 정규식을 활용할 수 있다. 예를 들어,

6자리 이상
1개 이상의 영어 대문자
1개 이상의 숫자

라는 조건을 만족해야 한다면 저 전진 검색 패턴을 활용하면 된다.
더 보기 »정규식을 사용한 비밀번호 유효성 검사

자바 스크립트 날짜 계산 방법

기준 user
2014-07-12
Javascript

자바스크립트에서 날짜 계산하기. 흔하게 사용하는 것인데 잠깐 생각이 안나서 메모. 두 날짜의 차이 날짜 객체를 빼면 밀리세컨드 값이 나온다. var a = new Date(2014, 4, 10); var b = new Date(2014, 4, 12); var c = b – a; console.log(c/(24 * 3600 * 1000)); 몇일 전 혹은 몇일 후 구하기 var today = new Date(); today.setDate(today.getDate() + 3); console.log(today.toLocaleString());

초경량 MVC 자바스크립트 프레임워크 Mithril

기준 sooopd
2014-06-15
Javascript

Mithril

Mithril은 경량 웹 프론트엔드용 MVC 프레임워크이다. 이 분야에서 가장 인기있는 프레임워크 중 하나인 AngularJS의 경우 JS소스코드의 용량도 만만치 않고, 템플릿을 컴파일하여 렌더링하는 초기 로딩 시간이 상당한데, Mithril의 경우 gzipped로 압축 전송되는 용량이 4kb에 불과하며, HTML마크업상에서 템플릿을 컴파일하지 않고 스크립트 레벨에서 프론트엔드 객체를 생성하거나, 엘레멘트를 그냥 가져오는 방식이라 동작 속도 또한 매우 빠르다.
더 보기 »초경량 MVC 자바스크립트 프레임워크 Mithril

마크 다운을 PDF 문서로 변환하기

기준 sooopd
2014-06-14
Javascript, Python

마크 다운을 HTML 문서로 변환하고, 다시 HTML 문서를 PDF로 변환하는 과정을 거치면 PDF 파일을 얻을 수 있다. HTML 파일을 PDF로 만드는 데는 파이썬으로 제작된 xhtml2pdf라는 패키지가 있긴 하지만 동작이 좀 불안정하거나 한글이 제대로 렌더링 되지 않는 (한글을 제대로 랜더링하는 방법은 있는데, 이 경우 CSS가 제대로 적용되지 않는다.) 등의 문제가 있어서 웹킷 엔진으로 렌더링하는 것과 같은 결과를 얻을 수 있는 PhantomJS를 사용하기로 결정했다.
더 보기 »마크 다운을 PDF 문서로 변환하기

자바스크립트 포스트 전송

기준 user
2014-03-09
, Javascript

FormData

XMLHTTPRequest 레벨2는 FormData 인터페이스를 지원한다. 폼데이터 객체는 폼필드의 키-밸류 쌍을 쉽게 구성하여 XHR를 통해 전달할 수 있도록 한다.

생성

다음 구문을 통해 생성한다.

new FormData([HTMLFormElement])

더 보기 »자바스크립트 포스트 전송