본문 바로가기

자바스크립트 기초

(7)
[Web] 웹 기초 (18) - JavaScript #11 배열 (Array), 정렬 (sort) Array 객체 자바스크립트 배열선언 배열의 길이는 가변적이다. 생성 방법 1: let a = new Array() 생성 방법 2 : let a = new Array(1,2,3); 생성 방법 3 : let a = [] 생성 방법 4 : let a = [1,2,3]; 다차원 배열은 1차원 배열의 요소를 다시 1차원 배열로 선언 let a = new Array(); a[0] = new Array(); (a의 첫번째 요소를 다시 배열로 만들기) // 기본형------------------------ let a = [1,2,3,4,5]; console.log(a[0]); // 1 console.log(a); // 배열 정보, 값 출력 //map형 --------------------------- let b = ..
[Web] 웹 기초 (16) - JavaScript #9 객체 (생성자함수) 객체를 생성하는 방법 객체 리터럴을 사용하여 객체를 생성 : let obj={ ... } function을 사용하여 객체를 생성 : function ABC { ... } (자바의 static과 같은 개념) prototype을 사용하여 객체를 생성 (메소드를 생성) ⇒ 객체 생성할때마다 메소드도 새로 생성되는 것이 아니라 prototype으로 공유하는 것 class를 사용하여 객체를 생성 (자바의 class와 유사함. ECMAScript 6 이상) 리터럴 사용하여 객체 생성하기 기본형 리터럴 객체 리터럴로 만든 obj1은 재사용할 수 없다. 일회성이 아니면 잘 사용하지 않는다. 기본형 + 메소드가 있는 리터럴 객체 리터럴 객체를 map으로 생성 (리터럴 안에 key와 value값이 있다) function을..
[Web] 웹 기초 (15) - JavaScript #8 JSON JSON (형태, 사용법) 1) [ ] : 일반적인 배열 2) { key : value, key : value, ... } : map 구조 (key, value 한쌍으로 / key, value는 모두 큰 따옴표 "" 로 감싸주어야함 = > script에서는 문제없지만 자바에서 오류) 3) 2차원 배열 [ {... }, { ... } ] ⇒ 대괄호 안에 대괄호 4) { key : [ ], key : value } value값이 배열 (혼합해서 사용 가능) id, irum : 속성 (attribute) getter, setter : 함수 or 메소드
[Web] 웹 기초 (14) - JavaScript #7 함수 (function) 함수 자바스크립트에서 함수는 클래스역할과 메소드 역할을 둘 다 함. 익명함수 function에 이름이 없음 frm.btn.onclick = function() { ... } callback함수 frm.btn.onclick = abc; // function abc( ) { ... } 를 의미함. // "btn을 클릭하면 abc라는 함수를 실행하라." // 여기서는 abc() 로 쓸 수 없다. 이름만 써야함 h4.onmouseover = abc; ⇒ h4에 마우스를 올리면 abc 함수가 실행됨 선언적 함수 (+ 함수적 선언) function abc ( 매개변수 ) { ... } ※ 국비지원으로 학원에서 배울 때 강사님이 hoisting -> hoising으로 가르쳐주셔서 계속 "hoising" 으로 나오지만..
[Web] 웹 기초 (11) - JavaScript #4 alert, comfirm, prompt 입력상자, backtic alert, comfirm, prompt 입력상자 alert : 윈도우 경고창. 말 그대로 경고창만 띄워주고 '확인' 버튼만 누르면 이벤트 종료. confirm : '확인' '취소' 버튼에 따라 true, false 리턴. prompt : 값을 입력받아서 리턴한다. "확인" 누르면 return값 true backtick 입력한 그대로 출력하고 싶을 때 사용! 작은 따옴표(')가 아니라, 키보드 숫자 1 왼쪽에 있는 backtick 기호(`) backtick 문장 안에 ${ } 를 쓰면 변수를 삽입할 수 있다. 문자열 + 변수 + 문자열 이 번거로울 때 유용함 백틱 변수 사용 예시 let animal = 'monkey'; let food = 'banana'; console.log(`${animal} lov..
[Web] 웹 기초 (9) - JavaScript #2 if문, for문 If 예제 1 정수 하나를 폼으로부터 전달받아 60 이상이면 '합격'을, 60 미만이면 '불합격'을 textarea에 출력하라. IF 정수 하나를 폼으로부터 전달받아 60 이상이면 '합격'을, 60 미만이면 '불합격'을 textarea에 출력하라. 정수 Number( frm.su.value ) : 텍스트 필드에서 가져온 텍스트형 숫자를 실제 숫자값으로 형태변환 If 예제 2 정수 하나를 입력받아 90 이상이면 '전액 장학생' 70 이상이면 '반액 장학생' 70 미만이면 '전액 납부'가 있는 라디오 버튼의 상태값을 변경하시오. if(II) 정수 하나를 입력받아 90 이상이면 '전액 장학생' 70 이상이면 '반액 장학생' 70 미만이면 '전액 납부'가 있는 라디오 버튼의 상태값을 변경하시오. 정수 전액장학생..
[Web] 웹 기초 (8) - JavaScript #1 개요, 사용방법 javascript 개요 인터프리터 언어 (컴파일러가 없음) ⇒ 한줄번역, 한줄실행 실행환경 : 웹 브라우저 (웹 브라우저가 인터프리터를 내장하고 있다) 변수형이 없다. (지역, 전역형 변수는 존재) 지역형 변수 : var 또는 let으로 선언 var : hoisting이 됨. let : hoisting이 되지 않음. hoisting : 사용되기 전에 메모리에 탑재되는 현상 (불필요한 메모리가 들어갈 수 있음) 배열의 크기는 가변적이고, 1차원 배열만 존재한다. (1차원 쪼개서 2차원을 만들 수는 있음) 문장의 끝을 나타내는 ' ; ' (세미콜론) 은 생략 가능하다. 사용방법 안에서 작성 태그 안에서 작성 (비추천) 외부에 스크립트만 작성하여 현재 파일에서 사용하는 방법 (많이 사용) 데이터의 구조는 J..