안오늘의 devlog

분류 전체보기

• [Vanilla JS] Form Validator

  🔥𝗔𝗰𝘁𝗶𝘃𝗶𝘁𝘆/진행한 프로젝트들 2021. 7. 14. 07:05

  주요기능 - 에러 발생 시 빨간색 외곽선 + 에러메시지 표시 - 성공 시 초록색 외곽선 - 이메일 형식 맞는지 확인 - 안 채운 칸 있는지 확인 - 제한 길이 이내인지 확인 - 비밀번호 확인과 비밀번호가 맞는지 확인 시연영상 https://youtu.be/xe0tPTZJJOw

  Read More
• JavaScript 정규식 활용 이메일 체크

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 13. 22:01

  function isValidEmail(email) { // js email regex const re = /^(([^()[\]\\.,;:\s@"]+(\.[^()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; return re.test(String(email).toLowerCase()); } test() 메서드는 주어진 문자열이 정규 표현식을 만족하는지 판별하고, 그 여부를 true 또는 false로 반환한다. // Check email is valid function checkEmail(input) { // js email regex con..

  Read More
• JavaScript preventDefault()란?

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 13. 15:09

  a 태그나 submit 태그는 누르게 되면 href 를 통해 이동하거나, 창이 새로고침하여 실행된다. preventDefault 를 통해 이러한 동작을 막아줄 수 있다. 1. a 태그를 눌렀을때도 href 링크로 이동하지 않게 할 경우 2. form 안에 submit 역할을 하는 버튼을 눌렀어도 새로 실행하지 않게 하고싶을 경우 (submit은 작동됨) 예제 const form = document.getElementById('form'); form.addEventListener('submit', function (e) { e.preventDefault(); console.log('submit'); }); preventDefault()를 하지 않을 경우, submit버튼을 누르면 submit이 consol..

  Read More
• [제코베/JavaScript] 42번. 2020년. 요일구하기, Date 객체

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 11. 14:22

  1. 문제 2020년 1월 1일은 수요일입니다. 2020년 a월 b일은 무슨 요일일까요? 두 수 a, b를 입력받아 2020년 a월 b일이 무슨 요일인지 리턴하는 함수 solution을 완성하세요. 요일의 이름은 일요일부터 토요일까지 각각 SUN, MON, TUE, WED, THU, FRI, SAT 입니다. 예를 들어 a = 5, b = 24라면 5월 24일은 일요일이므로 문자열 "SUN"를 반환하세요. 제한 조건 2020년은 윤년입니다. 2020년 a월 b일은 실제로 있는 날입니다. (13월 26일이나 2월 45일 같은 날짜는 주어지지 않습니다.) 2. 나의 풀이 const day = ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT']; const month = [..

  Read More
• JavaScript 특정 문자 치환 방법: replaceAll 함수사용과 정규식을 사용한 replace()

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 10. 11:35

  1. replaceAll() 함수 사용 replace는 첫번째 문자만 바꿔주기 때문에, 문자열에 있는 모든 특정문자를 치환하기 위해서는 replaceAll을 사용해야 한다. function replaceAll(str, searchStr, replaceStr) { return str.split(searchStr).join(replaceStr); } 2. 정규식 사용 replace(/o/g, "*") : o를 *로 전체 치환한다. replace(/o/gi, "*") : o를 *로 대/소문자 구분 없이 전체 치환한다. g: 발생할 모든 pattern에 대한 전역 검색 i: 대/소문자 구분 안함 특수문자 치환 시 \를 붙여주어야 한다. 관련문제 : 제코베 자바스크립트 39번. 오타 수정하기 혜원이는 평소 영타가..

  Read More
• [제코베/JavaScript] 38번 호준이의 아르바이트

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 10. 10:28

  1. 문제 설명 호준이는 아르바이트로 영어 학원에서 단어 시험지를 채점하는 일을 하고 있다. 호준이가 일하는 학원은 매번 1위부터 3위까지의 학생에게 상으로 사탕을 준다. 그런데 오늘은 마침 사탕이 다 떨어져서 호준이가 채점을 하고 점수를 보내면, 당신이 아이들의 숫자만큼 사탕을 사러 가기로 했다. 1위 ~ 3위 학생은 여러명일 수 있고 1~3위 학생 중 중복되는 학생까지 포함하여 사탕을 사기로 한다. 학생들의 점수를 공백으로 구분하여 입력을 받고 사탕을 받을 학생의 수를 출력하세요. 2. 나의 풀이 set으로 중복 없애고, 순위 3개 점수를 구해서 배열을 만든다. 새롭게 만든 배열(중복없는 순위3개)과 동일한 점수가 있으면 count를 1 증가시킨다. const data = prompt('점수를 입력하..

  Read More
• JavaScript reduce()

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 9. 21:21

  제코베 자바스크립트 37번, 반장선거 새 학기를 맞아 호준이네 반은 반장 선거를 하기로 했습니다. 그런데 표를 하나씩 개표하는 과정이 너무 번거롭게 느껴진 당신은 학생들이 뽑은 후보들을 입력받으면 뽑힌 학생의 이름과 받은 표 수를 출력하는 프로그램을 작성하기로 하였습니다. const array = prompt('이름을 입력해주세요.').split(' '); let result = {}; let winner = ""; for (let index in array) { let val = array[index]; result[val] = result[val] === undefined ? 1 : result[val] = result[val] + 1; } winner = Object.keys(result).redu..

  Read More
• JavaScript 클로저

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 9. 13:01

  클로저 외부변수를 기억하고 이 외부 변수에 접근할 수 있는 함수 함수안에 변수는 함수가 실행될 때 값이 부여된다. 자바스크립트는 함수 단위로 스코프가 생성된다. inner 스코프 안에 변수가 없으면, 다음 outer 스코프에서 변수를 찾는다. 자바스크립트는 함수 내부에서 함수 외부에 있는 변수에 접근할 수는 있지만, 함수 외부에 있는 변수는 함수 내부에 접근할 수 없다. 함수와 함수가 접근할 수 있는 스코프가 클로저 관계를 맺는다. 관련문제 function one(n) { function two(val) { return Math.pow(val, n); } return two; } const a = one(2); const b = one(3); const c = one(4); console.log(a(10..

  Read More