오늘이라도

6. 배열, 정규 표현식, 문자열 객체, 유효성 검사 본문

취업성공패키지 SW 개발자 교육/View

6. 배열, 정규 표현식, 문자열 객체, 유효성 검사

upcake_ 2020. 4. 6. 21:46
반응형

https://github.com/upcake/Class_Examples

교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. 

gif 파일은 클릭해서 보는 것이 정확합니다.


▲miniproject06 답안
▲miniproject06 작동 화면

 

 

▲예제 1. 배열 ①

 - forin 반복문 : for ( var index in 배열명) {}

 

 

▲예제 2. 배열 ②

 - typeof() : 리터럴의 타입을 출력

 - write(배열명) : 배열을 일렬로 출력하고 쉼표로 구분

 - 배열명.join("-") : 배열을 일렬로 출력하고 - 로 구분

 - 배열명.reverse() : 배열을 역순으로 출력

 - 배열명.sort() : 배열을 오름차순으로 출력

 

 

▲예제 3. 배열 ③

 - 배열 1.concat(배열 2) : 배열 1과 배열 2를 연결

 - 배열 1.pop() : 배열 1의 마지막 값을 삭제

 - 배열 1.push() : 배열 1의 마지막 값에 새 데이터 삽입

 - 배열 1.shift() : 배열 1의 첫 번째 값을 삭제하고 앞으로 한 칸씩 이동

 - 배열 2.unshift() : 배열 1의 첫 번째 값에 데이터 삽입하고 뒤로 한 칸씩 이동

 

 

▲예제 4. charAt()

 - 문자열.charAt(x) : 문자열의 x번 인덱스에 있는 문자 출력, 없으면 빈칸 출력

 - 문자열.charCodeAt(x) : 문자열의 x번 인덱스에 있는 문자 아스키코드 출력, 없으면 NaN 출력

 

 

▲예제 5. 정규 표현식 ①, match()

 - getElementById("ab") : HTML 태그 중 ab란 id를 가진 태그를 지정

 - innerHTML : HTML 태그 내부의 내용물을 지정

 - 문자열.match(/ab/) : 문자열 내부에 ab란 문자가 있는지 검사 후 있으면 가져옴

 - 정규 표현식은 /로 시작해서 /로 끝난다.

 - 문자열.match(/ab\w+/) : 문자열 내부에 ab란 문자가 있는 검사 하는데 알파벳, 숫자, _중에서 1회 이상 사용된 것을 검사하고 있으면 가져옴

 

 

▲예제 6. 문자열 객체

 - 문자열.charAt(x) : 문자열의 x번지 문자를 출력

 - 문자열.charCodeAt(x) : 문자열의 x번지 문자의 아스키코드 값을 출력

 - 문자열.indexOf("x") : 문자열의 x란 문자의 번지 값을 반환

 - 문자열.indexOf("x", n) : 문자열의 n번지 이후의 x란 문자의 번지 값을 반환

 - 문자열.match("x") : 문자열에 x란 문자가 있는지 확인 후 있다면 반환

 - 문자열.search("x") : 문자열에 x란 문자가 있는지 확인 후 있다면 번지 값을 반환
 ※ indexOf()와 search()의 차이 : 정규식을 사용한다면 search()가 빠르고 그 외에는 indexOf()가 빠르다.

 - 문자열.substr(x, n) : 문자열의 x번지부터 n글자까지 반환

 - 문자열.substring(x, y) : 문자열의 x번지부터 y번지 미만까지 반환

 - 문자열.replace("x", "y") : 문자열의 첫 번째 x를 y로 바꾸고 바뀐 문자열 전체를 반환

 - 문자열.toLowerCase() : 문자열을 전부 소문자로 바꾸고 반환

 - 문자열.toUpperCase() : 문자열을 전부 대문자로 바꾸고 반환

 - 문자열.length : 문자열의 길이를 반환

 - 문자열.split("x") : 문자열을 x를 기준으로 쪼개서 배열로 반환

 

 

 

▲문제 1. 문자열 객체 활용
▲문제 1. 문자열 객체 활용 작동 화면

 

▲문제 1 답안

 

▲문제 1 답안 작동 화면

 

 

 

▲예제 7 - 1. 유효성 검사

 - 필수로 들어가야 하는 문자의 번지 값을 indexOf()로 찾고 이 값이 0보다 클 때 true가 되도록 해서 통과시키는 방식의 유효성 검사이다.

 

▲예제 7 - 2. 유효성 검사 작동 화면

 

 

▲예제 8. 정규 표현식 ①
▲예제 9. 정규 표현식 ②

 - 정규 표현식은 어떻게 구성되어 있는지 정도만 알고, 작성법은 검색해서 보는 것이 좋다.

반응형