>웹 프론트엔드 >JS 튜토리얼 >EXT_extjs에서 xtype의 의미 분석

EXT_extjs에서 xtype의 의미 분석

WBOY
WBOY원래의
2016-05-16 18:37:091402검색

머리말

포럼에서 관찰한 바에 따르면 xtype을 사용할 때 더 많은 의구심이 있습니다. 어떤 사람들은 xtype을 전혀 무시하거나 그것이 무엇인지 모릅니다. 그래서 나는 xtype의 개념에 대해 자세히 설명하기로 결정했습니다.

정의

xtype은 클래스(Class)를 나타내는 식별명이다.

예를 들어 Ext.ux.MyGrid라는 클래스가 있습니다. 일반적으로 클래스를 인스턴스화하려면(클래스의 객체 생성) 이 이름을 사용해야 합니다.

클래스 이름 외에도 다음과 같이 클래스의 xtype을 등록할 수 있습니다.
Ext.reg('mygrid', Ext.ux.MyGrid)

where xtype은 mygrid이고 클래스 이름의 일반적인 형식은 Ext.ux.MyGrid입니다. 위의 명령문은 새로운 xtype을 등록합니다. 즉, xtype mygrid는 Ext.ux.MyGrid 클래스에 연결됩니다.

어떤 혜택이 있나요?

사용자 작업에 응답하기 위해 프로그램에 많은 수의 개체(창, 양식, 그리드)가 포함되어 있는 대규모 프로젝트가 있다고 상상해 보십시오. 사용자가 아이콘이나 버튼을 클릭하면 양식 내부에 그리드가 있는 새 양식이 생성되고 최종적으로 화면에 렌더링됩니다.

그럼 Ext2.x 이전의 코딩으로 돌아가 보겠습니다. 당시에는 페이지가 처음 로드된 후(프로그램 코드가 처음 실행된 후) 모든 개체를 인스턴스화했습니다. 클라이언트 메모리에는 Ext.ux.MyGrid 클래스의 객체가 이미 존재하며 사용자의 클릭을 기다리고 있습니다. 동일한 그리드에 대해 수백 개의 인스턴스가 있다고 가정하면... 귀중한 리소스를 낭비하는 셈입니다! 실제로 많은 그리드의 경우 사용자가 그리드를 클릭하여 표시하지 않을 수도 있습니다.

지연된 인스턴스화

xtype을 사용하는 경우 메모리에 있는 것은 다음과 같은 구성 항목 개체일 뿐입니다.

복사 코드 코드는 다음과 같습니다:

{xtype:'mygrid", border:false, width:600, height:400, ...}


복잡한 인스턴스 객체만큼 비싸지 않습니다.

글쎄, 사용자가 버튼이나 아이콘을 클릭하면 Ext는 이를 준비된 그리드로 인식합니다. 인스턴스화는 즉시 이루어지지 않습니다. Ext는 ComponentMgr의 도움으로 이를 이해합니다. "xtype mygrid의 객체를 인스턴스화하려면 내가 만들고 싶은 것이 실제로 Ext.ux.MyGrid 클래스의 객체라는 것을 알고 있습니다." 다음 코드는 다음과 같습니다.
코드 복사 코드는 다음과 같습니다.

create: function (config, defaultType){
return new versions[config.xtype || defaultType](config)
}

은 다음과 같습니다.
Java 코드
코드 복사 코드는 다음과 같습니다.

return new Ext.ux.MyGrid(config); >
그런 다음 그리드를 인스턴스화하고 렌더링 및 표시를 진행합니다. 기억하세요: 필요할 때만 인스턴스화하세요.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.