괴발개발/Javascript+JQuery 75

JS_정규표현식

- 정규 표현식 : 문자열의 패턴을 확인할 때 사용하는 식 - 아이디, 비밀번호 등 - abc(기준이될 만한 아무 문자열) : 문자열 abc와 일치하는 부분이 있는지 확인 - [abc] : a또는 b또는 c가 있는지 홛인 - [a-c] : [abc]와 같음 - [a] : 괄호 안의 알파벳 소문자가 있는지 확인 - [A-Z] : 알파벳 대문자가 있는지 확인 - [a-zA-Z] : 알파벳이 있는지 확인 - [0-9] : 숫자가 있는지 확인 - [ㄱ-힣] : 한글이 있는지 확인 - [^abc] : abc가 없는지 확인 - ^ : 시작 - $ : 끝 - {} : 횟수 - {3} : 3번반복(한줄에 3개만) - {3,4} : 3~4반복 - {3,} : 3개 이상 - \d : 숫자를 확인 - \D : 숫자를 제외하..

JS_반복문(for in, for of, forEach)

더보기 - for in : 인덱스를 가져와서 활용하는 방법 - 인덱스 : 배열인 경우 번지, 객체인 경우 속성명 var arr = [1,2,3]; console.log('배열'); for(var index in arr){ console.log('arr['+index+'] = ' + arr[index]); } var obj = {grade : 1, name: '설리반'}; console.log('객체'); for(var index in obj){ console.log(index+' = ' + obj[index]); } 더보기 - for of: 값을 가져와서 활용하는 방법(자바의 향상된 for문) - 배열사용가능, 객체사용 불가 * for of로 객체사용이 안되는 이유로 오류나서 객체는 주석처리 consol..

JS_객체

더보기 var 객체명 = { 변수명 : 값, 변수명 : 값, 메서드명 : function(){ 구현; } } var student = { name : '내이름은푸우', grade : 1, class : 1, num : 1, print : function(){ document.write(`${this.grade}학년 ${this.class}반 ${this.num}번 ${this.name} `); } } //확인하기위해 메소드 호출 student.print(); //자바랑 다르게 새로운 속성을 추가 가능 student.age=17; //메소드를 수정 가능 student.print=function(){ document.write(`${this.grade}학년 ${this.class}반 ${this.num}번 ..

JS_클래스

더보기 class 클래스명{ constructor(매개변수){ 초기화; } 메소드명(){ 구현; } get 메소드명(){ 구현; } set 메소드명(){ 구현; } } class Student{ constructor(grade, classNum, num, name){ this.grade=grade; this.classNum=classNum; this.num=num; this.name=name; } print(){ console.log(this.grade + '학년' + this.classNum+'반' + this.num+'번 ' + this.name); } get grade2(){ return this.grade; } set grade2(grade){ this.grade=grade; } } var std..

JS_배열

더보기 - 자바에서는 한 배열에 같은 타입의 값만 저장할 수 있다 - JS에서는 한 배열에 여러 타입의 값을 저장할 수 있다 - 자바에서는 배열은 기능이 없지만, JS에서 배열은 여러가지 메소드들을 제공해준다 //중괄호를 이용해서 만드는게 객체 var tmp = {grade:1}; // 객체 var arr1 = ['html', 1, true]; // 배열 var arr2 = new Array('html', 1, true); //배열 document.write(arr1[0]+' '); 더보기 - slice() : 전체를 복사 => 복사본을 가져오는 것 - ?는 0개또는 하나 ex: slice(?,3) 시작이 있을수도있고 없을수도있고 - slice(index) : index번지 이후(slice(1)=>2번지..

JS_재귀함수

더보기 재귀함수 : 함수를 선언하는데 자기 자신이 구현부에서 호출되는 함수 생김새 : - function a(){ a(); } 5! = 5*4*3*2*1 // 팩토리얼 함수 function factorial1(num){ var res =1; for(i=num; i>=2; i--){ res*=i;} return res; } document.write(`5! = ${factorial1(5)} `); /* 팩토리얼 설명 5! =5*4! 4! =5*4*3! 재귀함수를 이용한다면? f(5) = 5*f(4!) */ //재귀함수를 이용한 팩토리얼 함수 function factorial2(num){ if(num

JS_내장함수

더보기 편의상 변수라고 표현, 값이라고 해도 무방 - isNaN(변수) : 변수의 값이 숫자인지 아닌지 판별(is not a Number의 약자), 숫자가 아니면 true, 숫자이면 false. - isFinite(변수) : 유한한값인지 무한한값인지 판별, 유한하면 true, 무한하면 false. - Number(변수) : 숫자로 변환하는 함수 - parseInt(변수) : 정수로 변환하는 함수, 정수부분까지만 변환 - parseFloat(변수) : 실수로 변환하는 함수, 소수부분까지만 변환 - String(변수) : 문자열로 바꾸는 함수 var num='123'; document.write(`문자열123은 숫자가 아닙니까? ${isNaN(num)} `); num='abc'; document.write(..

JS_함수의 개념과 예제

더보기 - JS에서 함수는 리턴타입을 쓰지 않음, 매개변수 부분에 타입을 안씀(var제거) - 선언적 함수 : 함수 선언위치와 호출 위치가 중요하지 않음 - 선언적 함수 생김새 - function 함수명(매개변수1, ...){ 실행문; } - 익명 함수 : 함수 선언위치와 호출 위치가 중요함 => 선언하는 코드가 호출하는 코드보다 위에 있어야 함 - 익명 함수 생김새 var 변수 = function(매개변수1, ...){ 실행문; } //Hello를 출력하는 printHello 함수를 선언적함수function 방법으로 선언 function printHello(){ document.write('Hello '); } //printHello 함수를 호출 (함수보다 위에있어도 상관은 없음) printHello(..

JS_prompt(팝업 입력창) 입력예제

/* prompt('안내문구') : 입력 팝업창을 생성하며, 입력된 값을 가져오는 함수*/ var num1 = prompt('정수1을 입력하세요'); var num2 = prompt('정수2를 입력하세요'); document.write(`${isNaN(num1)}`); /*두 정수와 산술 연산자를 입력받아 산술연산 결과를 출력하는 코드를 작성하세요.*/ var num1 = prompt('정수1을 입력하세요'); var op = prompt('산술 연산자를 입력하세요'); var num2 = prompt('정수2를 입력하세요'); var res = calcNum(num1, op, num2); if(res=='NaN'){ document.write('숫자가 아닌 값을 산술연산 할 수 없음') }else if..