'Yahoo Global Object'에 해당되는 글 1건

  1. 2008.01.12 YUI Library: The YAHOO Global Object (2)
YUI, YAHOO USER INTERFACE 세미나 자료
Simple Use Case: YAHOO Object

사용자 삽입 이미지

가장 심플리티한 사용!! YAHOO 글로벌 오브젝트를 사용하기 위해서 어떤 액션도 필요 하지 않습니다.

YUI 의 YAHOO 오브젝트 라이브러리는 모든 구성요소들에 실용적인 메서드들의 컨테이너와 프로바이더 역활을 한다..






Type-Checking Your Data

타입체크를 위한 YAHOO.lang 오브젝트 Yahoo Global Object 에 포함되어 있으며 여러가지 유용한 타입체크 메서드를 제공합니다.

isArray
  : 제공된 오브젝트가 Array 인지 체크, array 이면 true 아니면 false 를 반환한다.
isBoolean
  : 제공된 오브젝트가 Boolean 인지 체크, boolean 이면 true 아니면 false 를 반환한다.
isFunction
  : 제공된 오브젝트가 Function 인지 체크, function 이면 true 아니면 false 를 반환한다.
isNull
  : 제공된 오브젝트가 Null 인지 체크, null 이면 true 아니면 false 를 반환한다.
isNumber
  : 제공된 오브젝트가 Number 인지 체크, number 이면 true 아니면 false 를 반환한다.
isObject
  : 제공된 오브젝트가 Object 인지 체크, object 이면 true 아니면 false 를 반환한다.
isString
  : 제공된 오브젝트가 String 인지 체크, string 이면 true 아니면 false 를 반환한다.
isUndefined
  : 제공된 오브젝트가 Undefined 인지 체크, undefined 이면 true 아니면 false 를 반환한다.
isValue
  : 꾀 편리한 메서드 입니다. null/undefined/NaN 의 경우에는 false를 그외의 것들은 true를 반환합니다.
    0과 false 그리고 ''(공백) 도 true를 반환합니다.

User Agent Detection

YAHOO.env.ua 오브젝트 Yahoo Global Object 에 포함되어 있으며 다양한 브라우저를 구분하는 도구로 쓰입니다. 
우리는 다양한 브라우저에서 어느 브라우저에서는 지원되지만 어느 브라우저에서는 지원되지 않거나 합니다. 하지만 크로스 브라우징을 위해서 모든 브라우저에서 지원되도록 만들어야 합니다.
이때 브라우저 스니핑은 부정확한 합니다.  브라우저의 환경과는 많은 것들이 연관됩니다.
그동안 나온 많은 기술들을 매우 정확합니다. 하지만 100% 보장하지는 않습니다.

YAHOO.env.ua.gecko : FireFox 버젼 정보를 반환한다. 아니면 int(0) 을 반환
YAHOO.env.ua.ie : IE이면 버젼 정보를 반환한다. 아니면 int(0) 을 반환
YAHOO.env.ua.opera : Opera 이면 버젼 정보를 반환한다. 아니면 int(0)을 반환
YAHOO.env.ua.webkit : Apple Webkit 이면 버젼 정보를 반환한다. 아니면 int(0)을 반환
YAHOO.env.ua.mobile : 아직은 제한적으로 Webkit 기반 브라우저와 Opera Mini 를 사용하는 Safari, iPhone/iPod tuch, Nokia N-series 들만 지원


Creating Class Hierarchies with YAHOO.lang.extend

자 바스크립트(javascript)는 계층적 클래스(class) 개념을 제공합니다. 다른 객체지향 언어들처럼 슈퍼클래스(super class)의 기능적 오버라이드(overrid) 추가(extend)가 가능한 클래스(class)를 만들 수 있습니다.

Creating a Composition-Based Class Structure Using YAHOO.lang.augmentProto

YAHOO.argument 와 매우 유사한 메서드입니다. argumentProto는 배경지식을 위해서 argumentProto 의 히스토리를 보고 구문을 위해서 한번쯤 보기를 권장합니다.
사용자 삽입 이미지

composition 은 상속의 개념이 아닙니다.
왼쪽 이미지를 통해 설명 합니다.

만약 Foo가 클래스 계층의 일부분이다면 상속 사슬에서 EventProvider를 포함하는 것은 부적당하게 되므로 근본적으로 두 가지는(Foo 와 EventProvider) 다릅니다.

확장된 클래스와는 다릅니다.

argumentProto의 의도는 컴포지션 스타일(Composition-style) 클래스 체계를 고려하고 많은 클래스들에 의해 공유되는 중요하지 않는 습성또는 성질을 뽑아내는데 도움을 줍니다.


이것은 다중상속과 매우 유사해 보일지 모릅니다. 하지만 그렇지 않습니다. argumentProto는 단지 어떤 클래스의 프로토타입에 또 다른 하나의 프로토타입까지 public 메서드와 멤버를 추가합니다.

이것은 Prototypejs 의 Object.extend 와 똑같은 기능을 말합니다. dest class에 source class 의 property 를 copy하는 기능입니다.

이런 경우 a class instanceof b class 의 경우 false 로 나오겠죠? 

Prototype.js Framework 에 익숙해져서 argumentProto 라는 네이밍이 왠지 어색합니다.
Object.extend 가 왠지 직접적이고 어떤 기능을 한다라고 느끼기에 참 좋은것 같습니다.


Add Behavior to Objects or Static Classes with YAHOO.lang.augmentObject

YAHOO.lang.argumentObject 는 YAHOO.lang.argumentProto 와 매우 유사합니다. 실제로 argumentProto는 내부적으로 argumentObject를 사용하고 있습니다.  그러나 클래스의 정의(즉 펑션 프로토타입)에 기능적 추가 보다는 오히려 argumentObject는 오브젝트 literals 과 클래스 인스턴를 포함한 어떤 오브젝트와도 동작할 수 있습니다.

여러분의 코드 구조 관리를 돕기 위한 다른 기술들을 위해서  argumentProto와 extned를 보세요.


Combining Simple Data Sets with YAHOO.lang.merge

YAHOO.lang.merge 는 data object 를 단일 셋으로 만드는 역활을 합니다.
Prototype.js 의 hash.merge 와 동일한 기능을 합니다. 중복되는 key 는 나중에 merge 되는 것들로
모드 replace 됩니다.



이렇게 YAHOO Global Object 에 대한 자료는 마칩니다. 예시는 YUI pdf cheat 에 모두 나와있고 또한
여러곳에 나와있기 때문에 따로 기재하지는 않습니다.

쓰임새에 대해서 알아보고 나중에 좀더 고급화된 활용법에 대해서 이야기할 기회가 있다면
그때 좀더 자세한 예시와 함께 포스팅하도록 하겠습니다.

첨부로 Class diagram 을 자료로 첨부합니다. 
다운로드 :
신고

'JavaScript > Study-YUI' 카테고리의 다른 글

야후! YUI 2.5 released  (6) 2008.02.21
YAHOO UI 2.4.0 - core 분석 발표자료.  (0) 2008.01.22
YUI Library: The YAHOO Global Object  (2) 2008.01.12
Posted by Rhio.kim