본문 바로가기

전체 글109

접근제어자 목차1. private2. protected3. public 1. private해당 클래스 내부에서만 접근할 수 있게 하는 제어자class Person { private name: string; constructor(name: string) { this.name = name; }}const person = new Person('홍길동');console.log(person.name);console.log에 person의 name을 출력하는 부분에서 접근불가하다는 에러가 발생한다. 2. protected해당 클래스 및 하위 클래스에서 속성에 접근할 수 있게 하는 제어자class Person { protected name: string.. 2024. 5. 5.
체크박스 커스텀하기 목차1.필요한 요소2. label태그로 체크박스 모양 만들기3. label 체크박스를 원형으로 만들기 4. 원형 체크박스 안에 v표시할 가상요소를 추가5. 가상요소 각도 기울기 바꾸기 6. V자 위치 조정하기7. Input의 체크박스 우리는 웹사이트를 이용하다보면 checkbox가 ihtml을 배우다가 알게된input태그의 checkbox와 모양이 다른 경우를 볼 수 있다.아래의 경우를 보면 왼쪽은 input의 체크박스, 오른쪽은 카카오톡의 체크박스이다.똑같이 만들려면 단순히 모서리를 둥글게 깎는다면 원하는 모양이 나올까?원형 체크박스를 만들기 위해 모서리를 둥글게 해주는 속성인 border-radius속성을 사용해보았다 결과는 변하지 않았다. 왜 그럴까?웹 브라우저가 checkbox 요소.. 2024. 5. 4.
setter와 getter 목차1. setter2. getter3. 왜 사용해야할까?1. setter클래스 내의 속성에 접근하여 기존 데이터를 갱신하기 위한 메소드class 클래스{ constructor(속성값1,속성값2){ this.속성1 = 속성값1; this.속성2 = 속성값2; } set속성1(속성값1){ this.속성1 = 속성값1; }}ex)class Person{ constructor(name,age){ this.name = name; this.age = age; } setName(name){ this.name = name; }}const person = .. 2024. 5. 3.
객체 타입체크 목차1. 타입 체크 하기2. 왜 해야할까?1. 타입 체크 하기 타입스크립트는 각 데이터를 담는 변수에 타입을 지정한다. 원시 타입의 데이터를 담는 변수는 타입 지정이 쉽지만 속성을 여러 속성을 가지고 있는 객체는 어떻게 타입을 지정해야 할까?1) type 키워드 사용type은 타입을 지정하는 키워드로 모든 타입을 지정할 수 있고 중복이 되지 않는다는 특징이 있다. type 타입명 = { 속성1 : 타입, 속성2 : 타입}const 객체 : 타입명 ={ 속성1 = 값, 속성2 = 값}ex)type userType = { name : string}const user : userType ={ name = '홍길동' }다만 type.. 2024. 5. 2.

티스토리툴바