'자바스크립트'에 해당되는 글 7건

document 에서 id값으로 속성을 선택하는 경우 

주어진 ID와 일치하는 앨리먼트 속성을 찾는다. ID 요소는 대소문자를 구별하며 , 문서내에서 유일한 값이어야한다.

document 에서 TagName 으로 선택하는 방법

TagName에 해당하는 엘리먼트를 찾고 HTMLCollection  형태를 반환한다. (과거 브라우저 방식)

HTMLCollection 형태에 DOM 을접근하기 위해서는 item 메서드를 사용하거나 배열형태로 접근한다.

document 에서 클래스명으로 선택하는경우

클래스 이름을 가진 모든 자식 요소를 반환한다. (HTMLCollection  형태를 반환한다. )

클래스선택자를 사용하는 경우 

선택자에 해당하는 첫 번째 Element 를 반환한다. selectors 요소느 하나 이상의 선택자를 포함하는 DOMString 이어야한다. 

참고원문 

• getElementsByTagName()
• getElementById()
• getElementsByClassName()
• querySelector()
• querySelectorAll()
• 노드(Node)
• 요소 노드(Element Node)
• 노드리스트(NodeList)

패스트컴퍼스 프론트엔드 강의

자바스크립트 객체지향 프로그래밍

객체지향 프로그래밍 기본적인 문법

• 클래스 : 연관있는 변수와 함수를 묶어 재사용하기 위한 것 
  
  • 자바스크립트에서는 class 키워드 명렁어를 제공하지 않는다. 대신 오브젝트 리터럴 방식, 함수방식, 프로토타입방식 으로 클래스형태를 비슷하게 만들어 사용 할 수 있다.
• 인터페이스 : 구현체가 없이 선언으로만구성된것 
  
  • 자바스크립트에서는 interface 키워드 명령어를 제공하지 않으며, 인터페이스가 있다는 가정하에 코딩을 하는 방법밖에 없다. -_-

• 추상클래스

• 캡슐화 : 클래스에 담은 내용중 데이터가 기능을 외부에 접근하지 못하게 하는 것

  • 자바스크립트에서 캡슐화 지정 키워드는 없다. 대신 객체 외부에서 접근하지 못하게 하는 접근 지정자 private 과 protected 대신 요소 이름 앞에 “_” 를 붙여 만들어 사용한다. 그렇다고해서 자바스크립트가 문접적으로 접근 지정자 기능을 지원하지 않기 때문에 외부에서 얼마든지 접근할 수 있다. 단지 일종의 약속 같처럼 사용하는 것임.

• 상속 : 상속을 사용하는 가장 큰 이유는 코드를 재사용하기 위함이며, 중복된 코드를 제거하며 확장성을 높이기 위해서이다.

function 부모클래스(){
    this.프로퍼티 = 값
}

부모클래스.prototype.메서드 = function(){
    . . . . .
}

function 자식클래스(){
}

자바스크립트에서 상속은 자식클래스의 prototype 속성에 부모 클래스를 인스턴스를 대입하는 방식으로 이루어진다. 이렇게 하면 부모 객체의 모든 기능이 자식 객체의 프로토타입에 연결되어 자식객체에서 부모의 기능을 사용할 수 있게된다.

function Parent(){
    this.property1 = 값''
}

Parent.prototype.method1 = function(){
    console.log(this.property1);
}

function MyChild(){
}

//상속
MyChild.prototype = new Parent();

//자식클래스 인스턴스 생성
var myChild = new MyChild();
//자식객체에서 부모의 메서드 호출
myChild.method1();

실제 운영중에 그리드에 레이블명을 DB상에서 가져와야 되는경우가 발생하여 사용하였다.

1) 정적인 콜모델 정보를 선언한다.

2) 서버에서 읽어온 정보를 jstl를 이용하며 label, name 정보를 동적으로 생성한다.

3) 그리드 로드시 설정한 콜모델 정보를 배열형태로 셋 해준다.