reflection ($object) 사용법

개요

reflection 페이지는 $object(전역 객체, syn.$ 형태의 별도 alias 없음)가 제공하는 타입 확인/복제 등 리플렉션 관련 확장 함수를 보여주는 예제입니다. $object는 syn.js 내부에서 $number, $string과 같은 위치(약 4165~4385번째 줄)에 정의되어 있으며, extension_object.html과 완전히 동일한 모듈을 다루는 별도의(더 오래된) 데모 페이지입니다.

참고: 이 페이지는 $w.initializeScript({ ... }) 형태의 레거시(구형) 스크립트 등록 방식을 의도적으로 그대로 유지합니다. extension_object.html, template.html 등 대부분의 최신 예제 페이지는 let $x = { extends, hook, event, method } 형태의 객체를 선언하는 새 방식을 사용하지만, HandStack은 두 방식을 모두 지원하며 reflection.html은 그 대안/구형 등록 관례를 보여주기 위한 목적으로 남겨둔 페이지입니다.

로드 방법

<script src="/lib/highlight.js/highlight.min.js"></script>
<script src="/lib/showdown/showdown.min.js"></script>
<script src="/js/syn.loader.js"></script>

syn.loader.js가 페이지의 moduleScript(파일명 기준 reflection)를 읽어 reflection.js를 로드하고, 그 안의 $w.initializeScript({...}) 호출로 이벤트 핸들러를 등록합니다.

빠른 시작

$w.initializeScript({
    btnGetType_click() {
        syn.$l.get('txtGetType').value = $object.getType('txtGetType')
    },
    // ...
})

각 키는 {id}_{이벤트명} 규칙으로 대응되는 HTML 엘리먼트의 이벤트에 자동으로 바인딩됩니다.

주요 시나리오 / 사용 방법

타입 판별: getType, isDefined, isNull, isArray, isDate, isString, isNumber, isFunction, isObject, isObjectEmpty, isBoolean, isEmpty
객체 복제: clone

실전 예제 페이지

reflection.html / reflection.js (본 페이지, 레거시 등록 방식)
extension_object.html / extension_object.js (동일한 $object 모듈을 최신 등록 방식으로 보여주는 페이지)

주의 사항

reflection.js는 의도적으로 $w.initializeScript 스타일을 유지합니다. 새 예제 페이지를 작성할 때는 template.html/template.js를 스캐폴드로 참고해 let $x = { extends, hook, event, method } 형태의 최신 방식을 사용하는 것을 권장합니다.
$object에는 syn.$ 형태의 별도 alias가 없습니다. 항상 전역 $object로 접근합니다.

API 참조

모듈 정보

전역 변수: $object (별도 syn.$ alias 없음)
위치: 2.Modules/wwwroot/wwwroot/js/syn.js 약 4165~4385번째 줄 ($object.extend({...}))
이 문서는 object의 API 참조 섹션와 동일한 $object 모듈을 다룹니다. 두 문서는 같은 API 표면을 설명하므로 내용이 겹치는 것이 정상이며, reflection.html은 레거시 $w.initializeScript 등록 방식으로, extension_object.html은 최신 등록 방식으로 이 모듈을 시연합니다.

속성/메서드

메서드	시그니처	설명
`getType`	`getType(val)`	값의 타입을 문자열로 반환합니다 (`'null'`, `'array'`, `'date'`, `'element'`, `'object'` 등 세분화 포함).
`isDefined`	`isDefined(val)`	값이 `undefined`가 아닌지 확인합니다.
`isNull`	`isNull(val)`	값이 `null`인지 확인합니다.
`isArray`	`isArray(val)`	값이 배열인지 확인합니다 (`Array.isArray`).
`isDate`	`isDate(val)`	값이 유효한 `Date` 인스턴스인지 확인합니다.
`isString`	`isString(val)`	값이 문자열 타입인지 확인합니다.
`isNumber`	`isNumber(val)`	값이 `NaN`이 아닌 숫자 타입인지 확인합니다.
`isFunction`	`isFunction(val)`	값이 함수 타입인지 확인합니다.
`isObject`	`isObject(val)`	값이 `null`이 아닌 객체 타입인지 확인합니다.
`isObjectEmpty`	`isObjectEmpty(val)`	값이 순수 객체(`{}`)이며 키가 없는(빈) 객체인지 확인합니다.
`isBoolean`	`isBoolean(val)`	값이 boolean 이거나 `'TRUE'/'FALSE'/'T'/'F'/'Y'/'N'/'1'/'0'` 형태의 boolean 표현 문자열인지 확인합니다.
`isEmpty`	`isEmpty(val)`	`undefined`, `null`, `NaN`, 빈 문자열, 빈 배열, 빈 객체 등 "빈 값"인지 확인합니다.
`clone`	`clone(val, isNested = true)`	객체/배열/`Date`/`HTMLElement`를 포함해 값의 사본을 반환합니다 (`isNested`가 `true`면 재귀적으로 복제).

같은 모듈에 존재하지만 reflection.html에서는 시연하지 않고 extension_object.html에서 시연하는 메서드:

메서드	시그니처	설명
`isNullOrUndefined`	`isNullOrUndefined(val)`	값이 `undefined` 또는 `null`인지 확인합니다.
`toCSV`	`toCSV(obj, options = {})`	객체(배열)를 CSV 문자열로 변환합니다.
`toParameterString`	`toParameterString(jsonObject)`	JSON 객체를 `@key:value;` 형태의 파라미터 문자열로 변환합니다.
`defaultValue`	`defaultValue(type)`	타입 이름 문자열에 대응하는 기본값을 반환합니다.
`extend`	`extend(to, from, overwrite = true)`	두 객체를 재귀적으로 병합합니다.
`excludeKeys`	`excludeKeys(sourceObject, keysToExclude)`	지정한 키를 제외한 새 객체를 반환합니다.
`parseJsonValue`	`parseJsonValue(value, jsonType)`	지정한 JSON 타입에 맞게 값을 파싱/변환합니다.

참고: 과거 버전의 reflection.js에는 $object.method(...)를 이용해 동적으로 메서드를 추가하는 데모가 있었으나, 현재 syn.js의 $object에는 그런 method 함수가 존재하지 않아 본 갱신 작업에서 제거했습니다.

개요​

로드 방법​

빠른 시작​

주요 시나리오 / 사용 방법​

실전 예제 페이지​

주의 사항​

관련 모듈​

API 참조​

모듈 정보​

속성/메서드​

개요