본문 바로가기
반응형

컴퓨터/Front (Html, JS)47

프론트앤드 면접준비 링크 모음 (JavaScript, SPA(React/Next, Vue/Nuxt) 정리 ing...) 보통 블로그에다가 정리를 하면서 프론트앤드 공부를 하는데 정리가 되지 않아서 이미 포스팅한 지식들도 다 까먹고 있더라구요 이참에 중구난방으로 퍼져있는 프론트앤드 지식들을 하나에 모아놔야 할 필요가 생긴 것 같아서 만들었습니당 라우터처럼.. + 정리하는 김에 다른 블로그 글들도 모아볼 예정,,ㅎㅎ🤫 + 계속 업데이트 할 예정,,ㅎㅎ😮 목차 1. 자바스크립트 2. SPA 공통 3. 리액트/넥스트 4. 뷰/넉스트 1. 자바스크립트 1-1 돔 웹 브라우저 동작 원리 DOM https://gallery-k.tistory.com/345 https://gallery-k.tistory.com/346 This 전역에서 사용: window 전역 함수에서 사용: window object 의 함수 (메소드) 에서 사용: 그 .. 2023. 6. 10.
[Js] 매크로처럼 특정 시간에 원하는 버튼 누르기😃(자바스크립트 setInterval, new Date) 인공지능분야에서 일하고 있는 친구가 deview? 이거 듣고싶은데 경쟁이 너무 치열해서 신청을 못했대여 (+저두여..) https://deview.kr/2023 DEVIEW 2023 DEVIEW는 국내외 개발자들이 서로의 지식을 나누고, 탁월함을 추구하며, 함께 성장하는 컨퍼런스 입니다. deview.kr 3시에 딱 버튼을 눌러서 신청하면되는건데... 3시 되자마자 눌렀는데도 마감되어버렸대요 그래서 제가 친구를 위해서 3시가 되면 원하는 버튼을 누르는 코드를 만들었어요! 저한테는 쉬운데, 자스를 1도 안해본 친구한테는 개쩔어보였나봐여 이거는 회사에서 코드 호다닥 짜고 뿌듯해서 찍은거에요! 코드 전문이에여 // 누르고 싶은 버튼 let btn = document.querySelector('div.verti.. 2023. 2. 8.
[JavaScript] 오늘 날짜 + 현재 시간 출력하기_new Date() 코드 /** * 오늘 날짜 + 시간 출력하는 함수 * dateFormat: 날짜 포매팅 기호 (/,-,. 같은거) * timeFormat: 시간 포매팅 기호 (/,-,. 같은거) */ function GetCurDayTime(dateFormat,timeFormat) { return this.TimeString(dateFormat,timeFormat,new Date()); } function TimeString (dateFormat='/',timeFormat=':',date) { let year = date.getFullYear(); let month = date.getMonth() + 1; // 1월=0,12월=11이므로 1 더함 let day = date.getDate(); let hour = date.. 2022. 10. 30.
[JavaScript] 오늘 날짜 출력하기, 원하는 날짜 출력하기_new Date() 코드 /** * 오늘 날짜 출력하는 함수 * format: 포매팅 기호 (/,-,. 같은거) * addMonth: 월 더하기 * addDay: 일 더하기 * addYear: 년 더하기 */ function today(format='',addMonth=0,addDay=0,addYear=0){ let date = new Date(); let year = date.getFullYear(); let month = date.getMonth() let day = date.getDate(); if(addMonth!=0){date.setMonth((date.getMonth()+addMonth))}; if(addDay!=0){date.setDate((date.getDate()+addDay))}; if(year!=0){d.. 2022. 10. 29.
[jQuery, JavaScript]클릭이벤트 정리(addEventListener,querySelector) jQuery Click Click 1. id 값으로 $('#btn_plus').on('click',() => { // 원하는 코드 }) 2. class 값으로 $('.btn_plus').on('click',() => { // 원하는 코드 }) 3. onClick 메소드 사용 let 플러스함수 = () => { // 원하는 코드 } 바닐라 JS Click Click 1. id 값으로 document.getElementById("btn_plus").addEventListener('click', () => { // 원하는 코드 }); 2. class 값으로 let className = document.getElementsByClassName("btn_plus"); // for 문으로 for (leti = 0;.. 2022. 8. 29.
[JavaScript] Class 로 생성자 Constructor 만들기_ 생성자를 상속받아서 생성자 만들 때, extends 편 (2) 생성자가 생성자를 상속받을 수도 있습니다. 엄마토끼 생성자입니다. class 엄마토끼 { constructor(이름){ this.first = '김' this.last = 이름; } } 이제 이 엄마토끼 생성자를 상속받는 아가토끼 생성자를 만들어볼게요 엄마토끼 생성자를 상속받은 아가토끼 생성자입니다. class 아가토끼 extends 엄마토끼 { constructor(이름, a = 0){ super(이름); // super 를 꼭해줘야됨 이거는 엄마토끼의 constructor 임 this.키 = 150+a; } } 자세히 보면 여기 extends 랑 super 라는 키워드가 보입니다. extends 는 말 그대로 상속받을 대상이 엄마토끼입니다~ 라는 뜻이규여 super 는 엄마토끼의 constructor.. 2022. 8. 14.
[JavaScript] Class 로 생성자 Constructor 만들기_ 상속편 (1) 생성자 아시나요? 다른 컴퓨터 언어에도 있는 생성자요 자바스크립트로도 생성자를 만들 수 있답니당 자바스크립트의 생성자로는 Object 를 찍어낼 수 있어요ㅎㅎ ES6 Class vs 구버전 생성자 // ES6 버전 생성자 class 생성자 { constructor(){ //여기다 이제 this. 어쩌구 쓰면 됨 } } // 구버전 생성자 function 생성자(){ //여기다 이제 this. 어쩌구 쓰면 됨 } 구버전 function(){}으로 생성자를 구현하는거와 조금 다르게 생겼지만 this 키워드를 쓰는거랑 파라미터를 사용하는 거는 완전 똑같습니당 ES6 Class 생성자 class 엄마토끼 { constructor(이름,키=0,무게=0){ this.first = '김'; this.name = 이름.. 2022. 8. 13.
[JavaScript] 파라미터에 = 넣기 _ default parameter 로 NaN 오류 해결ㄱ 제가 얼마전에 냈던 실수중에 하나인데여 db 에 있는 날짜 개수만큼 행 개수를 늘려주는 함수를 만들어놨는데 안늘어나는겁니다. 왜그런지 로그 찍어봤더니 NAN 이라고 뜨더라구여 그래서 왜 NAN 이라고 뜨는지를 봤더니 글쎄 제가 파라미터에다가 값을 안넣고 있었지 뭐에여 (시뻘겋게 오류메세지라도 뜨던가...js 왕시러 😥) NaN function 함수1 (a){ console.log(a+1); } 함수1(); 이거 오류 날까여 안날까여 안나여 근데 NaN 이라고 나왔어요 NaN 은 Not a Number 라는 오류인데여 숫자형식이 다른형식이랑 연산되었을 때 나오는 오류입니당 짠 function 함수1 (a){ console.log( (a === undefined ? 0 : a)+1 ); } 함수1(); 파라.. 2022. 8. 12.
반응형

티스토리툴바