더 나은 웹개발을 꿈꾸는 기술 블로그. 웹이즈프리.
총 7개의 일치하는 문서를 찾았습니다.
js[Typescript] 2편. 타입스크립트 클래스 생성 및 interface
타입스크립트를 사용하여 클래스(class)를 생성하고 사용하는 방법에 대하여 알아봅니다.# 타입스크립트에서의 클래스 사용하기타입스크립트에서도 자바스크립트와 동일하게 클래스를 선언하고 사용할 수 있습니다. 먼저 간단하게 Site라는 이름의 클래스를 하나 만들어 봅니다.class Site {}아무것도 없는 빈 클래스를 하나 생성하였습니다. 이제 클래스에 새로운 프로퍼티를 선언해보겠습니다.class Site { no: number;}class 내부에 no, url 두 개의 프로퍼티를 선언하였습니다. 하지만 타입스크립트에서는 다음과 같이 에러를 발생합니다. "Pr...
Last Modified : 2022-01-19 21:36:27
Created : 2022-01-17 19:12:00
vuejs[VueJS] v-bind:class 사용방법 및 예제
vuejs에서 클래스 이름을 저장된 scope 값에 따라서 다이나믹(dynamic)하게 적용하는 방법을 알아보려고합니다. vuejs 역시 다른 프론트엔드 엔진처럼 클래스명을 값에 따라 그때그때 다르게 적용할 수 있습니다. 이때 v-bind:class를 사용합니다.v-bind:class="{ condition }"위와 같이 조건식을 사용하여 원하는 클래스명을 추가하거나 제거할 수 있습니다. 예를들어 vuejs에서 사용되는 변수 hide의 값이 true인 경우에만 hidden이라는 클래스를 보여줄 수도 있고 아니면 status='active'인 경우에만 active 클...
Last Modified : 2019-01-04 00:36:06
Created : 2019-01-04 13:37:31- js
ECMA Script 2015, ES6에서 class를 사용하여 클래스 선언하기
ES 5 이후의 자바스크립트... 즉 ECMA Script 2015, ES 6부터는 자바스크립트에서도 클래스를 사용할 수 있게 되었습니다. ES 6에서 어떻게 클래스를 선언하고 사용하는지 자세히 알아봅니다.@ 이전에는 어떻게 클래스, 객체지향을 구현하였나...ES 6 이 후부터는 자바스크립트에서 클래스를 사용하여 선언할 수 있지만 이 전에는 프로토타입(prototype) 방식을 사용하는 방법으로 생성자 함수를 만들 수 있습니다. 하지만 클래스를 사용하면 더 쉽게 클래스를 만들고 확장하는게 간단하겠죠. 그렇다면 클래스는 무엇일까요?! 자바스크립트에서 클래스(class)...
Last Modified : 2022-01-19 14:54:56
Created : 2017-07-31 01:39:51 - etc
자바스크립트 객체 상속하기 create()
자바스크립트에서 객체를 상속하는 방법은 몇 가지 존재합니다. 이 중에서 Object 객체의 create() 함수를 사용한 객체 확장, 상속에 대하여 알아봅니다. create()은 EC5에서 표준화된 객체의 상속 방법입니다.# 자바스크립트 create() 객체상속 예제보기만약 아래와 같은 생성자 함수를 사용하여 객체상속을 만든다고 생각해봅니다.function Mysite(name) { this.name = name;}이때 생성자함수 Myste를 사용하여 상속받기 위하여 create() 함수를 사용해보겠습니다.webisSite = Object.create(Mysite....
Last Modified : 2017-08-29 06:04:58
Created : 2017-06-09 22:50:37 
angularjsng-class 속성 사용하기 ngClass 디렉티브 사용방법
AngularJS에서는 클래스명을 추가할때 가장 많이 사용되는 ngClass 디렉티브에 대하여 알아보려 합니다. ngClass를 사용하는 방법은 매우 다양합니다. 언제 ngClass를 쓸 수 있을까요?! ngClass 디렉티브를 사용하는 경우는?ngClass는 받아오는 데이터값이 다른 경우 서로 다른 class를 적용할 때 주로 사용합니다. 데이터는 scope 변수로 저장하고 html에서 이를 읽어서 각각 다른 class를 적용할 수 있는점이지요. 즉, html 내에서 유연하게 클래스를 사용하기 위해서 사용합니다. 이를 사용하여 쉽게 클래스명을 변경할 수 있...
Last Modified : 2018-08-01 10:36:20
Created : 2016-12-04 22:20:23
js[jQuery] toggleClass() 메소드 알아보기
제이쿼리의 toggleClass() 메소드 매우 자주 사용됩니다. 이 메소드를 사용하면 원하는 요소에 새로운 클래스를 추가하거나 제거하기를 매우 쉽고 간단하게 반복할 수 있습니다.toggleClass()는 설정된 클래스명을 해당하는 요소가 가지고 있는지 판단하여 해당 요소가 있으면 이를 제거합니다. 반대로 해당 요소가 없다면 이를 부여하는 매우 유용한 메소드입니다. 간단한 사용방법은 아래와 같습니다.element.toggleClass('클래스명')[ 1 ] toggleClass() 예제소스 코드 보기<html><head><style type...
Last Modified : 2017-12-22 04:15:20
Created : 2016-07-04 13:55:07
jquery[jQuery] 클래스의 추가, 제거 및 확인, removeClass(), addClass(), hasClass()
제이쿼리를 사용하여 스타일 추가 및 제거하기 위해 클래스(class) 속성을 선택자로 사용합니다. 그 외에 동적인 스크립트 및 액션 등은 자바스크립트의 ID 값을 많이 사용합니다. 이렇게 클래스명을 추가하거나 제거하면 간단하게 원하는 스타일을 추가 또는 제거하는 것이 가능합니다. 물론 해당하는 class에는 스타일이 css에 선언되어야겠죠.# 제이쿼리를 사용한 스타일 추가 및 제거 방법아래는 제이쿼리(jQuery)를 사용하여 클래스명을 추가, 삭제하는 방법에 대하여 알아보려고 합니다. 또한 현재 어떤 클래스를 가지고 있는지도 확인할 수 있는 메소드도 함께 ...
Last Modified : 2018-07-25 19:46:38
Created : 2016-05-30 11:16:48