본문 바로가기

전체 글

[typescript 기본] 제네릭 문법
제네릭을 쓰는 이유 function logText(text) { console.log(text) return text; } const number = logText(10); console.log(number + 1); logText("하이"); logText(true); 매개변수로 숫자, 문자, boolean 중 어떤걸 보낼지 모르고 보낸 값으로 나중에 뭔가 다른 처리를 하려고 할때 정의하기가 애매하다. 이럴때 쓰는게 제네릭 문법이다. 제네릭을 쓰는 이유2 - uniontype으로도 불가 function textLog(text: string) { console.log(text) text.split(""); //예시 return text; } function numberLog(num: number) { c..
[typescript 기본] class와 prototype
[Class] js에서의 Class 생성되었습니다. Person: { "name": "세호", "age": 30 } ts에서의 Class 상단에 name과 age의 타입을 지정해준다. [Prototype] js에서의 Prototype 위에는 예시인데, 보면 admin의 내용이 user와 겹치는 것을 알 수 있다. 이걸 prototype을 사용하여 간략하게 만들 수 있다. admin.__proto__ 에 user값을 담고 role부분만 따로 추가하고 admin을 console 을 찍어보면 아래와 같이 나온다. admin.name //캡틴 admin.age // 100
[Vue3] vue에서 전체선택 체크박스 로직 구현하기 (checkbox select all)
전체선택 체크박스 만들기 기능구현 로직 1. 전체가 선택되면 판매대기, 판매중 모두 선택 2. 전체가 해제되면 판매대기, 판매중 모두 해제 3. 판매대기, 판매중이 모두 선택되면 전체 선택 4. 판매대기, 판매중 중 하나라도 해제되면 전체 해제 구현된 화면 See the Pen Untitled by JieunShin (@joannashin3) on CodePen. [소스 설명] 1. 전체선택 체크박스 html 전체 전체선택박스인데 v-model의 checkedAllComputed는 아래에서 computed를 사용하고 있다. (아래 js부분 참고) 2. 개별선택 체크박스 html {{ item.name }} js에서 받아올 checkedItems를 반복을 돌려 개별 체크박스를 만들었다. 각각의 input에..
[javascript] overloading 과 overriding
overloading 함수는 같고 매개변수가 다른것 (js에는 없음) function a(매개변수1, 매개변수2) { } function a(매개변수new1, 매개변수new2) { } overriding 이름이 같은 함수가 2개있으면 밑에 함수가 위에 함수를 덮어씌우는 것 function a() { console.log("test") } function a() { console.log("test2222") } a() //test2222
[javascript] es5환경에서 객체 반복 돌리기
webpack 환경에서만 작업하다가 오래된 소스에서 객체 반복을 돌리려는데 Object.entries() Object.keys() Object.value() for in 이런거밖에 생각이 안나서 찾아보았다.. for of for (var key of object) { key, object[key] //이런식으로 접근 가능! } key와 object[key]가 value로 key, value가 접근이 가능하다.
[css] css 가상클래스로 1. 2. 3. 쓰기 (counter)
1. 2. 3. 이렇게 순번을 써야하는데 css로 하는 방법 ! html scss .wrapper { counter-reset:아무이름 0; dl { &:before { counter-increment: 아무이름; content: counter(아무이름); } } }
[html & javascript] 가상요소 이벤트 바인딩 (template 태그)
html
[html] 크롬 input 자동완성 끄기
autocomplete="off" 속성을 넣었는데도 크롬에서 주소가 자동완성 되는 이슈 발생. 해결 autocomplete="no" 로 바꾸니 정상적으로 작동했다.
[javascript & html] 라디오 input 클릭했을때 확인 후 안되게 하기
(in 오렌즈프로젝트) 주문결제에서 배송비 쿠폰을 선택한 상태에서 배송지를 변경하면 confirm 이 뜨는데 "배송비 쿠폰이 리셋됩니다. 계속하시겠습니까?" >> 취소, 확인 중 선택 취소를 선택하면 >> checked 바뀌지 않고 그대로 확인을 선택하면 >> checked 변경 해결 $(document).on("click", "input[type=radio]", function () { if (confirm("배송비 쿠폰이 리셋됩니다. 계속하시겠습니까?")) { return false; //이게 포인트 } }) return false를 추가하면 된다.
[vue] directive 에서 상위 parent의 methods를 가져오고 싶을때
vue directive 에서 상위 parent의 methods를 가져오고 싶을때 vnode.context.함수명

티스토리툴바