자바스크립트 기초 (4)

코딩애플(https://codingapple.com/course/javascript-jquery-ui/)에서 강의를 듣고 공부 목적으로 적은 정리글입니다.

타이머 함수 setTimeout()

타이머 시간을 지정해서 그 시간이 되었을때 코드를 실행할 수 있다.
setTimeout(function{}, 시간)

  setTimeout(function(){
    $('.alert').hide();
  }, 5000);

☞ 1000이 현실시간으로 1초를 의미함

타이머함수 setInterval()

지정한 시간마다 코드를 반복적으로 실행하고 싶을때 사용 가능

setInterval(function(){ 
  console.log('안녕')
}, 1000);

콜백함수는 함수안에 넣을 수 있음

setTimeout(함수, 1000);

function 함수(){ 
  console.log('안녕')
}

5,4,3,2,1초로 바뀐후에 사라지게 하기

 <div class="alert alert-danger">
    <span id="second">5</span>초 이내 구매시 사은품 증정
  </div>

  <script>
  setTimeout(function(){
    document.querySelector('#second').innerHTML = '4'
  }, 1000);
  setTimeout(function(){
    document.querySelector('#second').innerHTML = '3'
  }, 2000);
  setTimeout(function(){
    document.querySelector('#second').innerHTML = '2'
  }, 3000);
  setTimeout(function(){
    document.querySelector('#second').innerHTML = '1'
  }, 4000);
  setTimeout(function(){
    $('.alert').hide();
  }, 5000);

문자 검증

일반적으로 공백이 아닌 올바르게 입력했는지, 예를 들면 이메일주소폼에는 이메일주소가 알맞게 들어갔는지 검증할 수 있음

간단한 문자 검증 방법

'Apple'.includes('A') // A가 들어가있어서 true로 출력
'Apple'.includes('B') // B가 들어있지 않아서 false로 출력

☞ 한글이나 A로 끝나냐 등의 복잡한 검사는 어려움

정규식

정규식 : 문자를 검사할수 있는 식

/찾을단어/.test('검사할 단어')
/apple/.test('applebanana')

범위 검사도 가능

/[a-z]/.test('abcd')

☞ a부터 z까지의 범위중 아무 글자 하나가 들어가있으면 true
☞ [a-z] : 소문자 , [A-Z] : 대문자, [a-zA-z] : 모든 알파벳, [ㄱ-ㅎ가-힣ㅏ-ㅣ] : 모든 한글, [0-9] : 숫자

축약 검사도 가능

/\S/.test('abcd') //아무 문자하나(특수문자 포함)
/^a/.test('abcd')   //a로 시작하는지 검사
/d$/.test('abcd') //d로 끝나는지 검사

/a|B/.test('aaaa') // or 검사

이메일 검증

/\S+@\S+.\S+/.test('aaa@bbb.ccc')

☞ 뒤에 +는 반복해서 찾는다는 뜻

오늘의 한줄평 : 건강 컨디션이 너무 안좋다. 아프지만 코딩을 놓을 수는 없어. 조금이라도 더 열심히 해야지

출처 : 코딩애플 https://codingapple.com/course/javascript-jquery-ui