주석 : //
자바스크립트에서는 큰따옴표나 작은따옴표가 붙지 않은 숫자는 숫자로 인식
alert(1+2) //결과는 3 alert(”1+2”) //결과는 1+2
-콘솔에서 사용?
Math.pow(3,2); //3의 2승 , 9출력
Math.round(10.6); // 10.6을 반올림, 11출력
Math.ceil(10.2); // 10.2를 올림 , 11출력
Math.floor(10.6); // 10.6을 내림 , 10출력
Math.sqrt(9); // 3의 제곱근 , 3출력
Math.random(); // 0부터 1.0사이의 랜덤한숫자 >100*Math.random()하면 100이하의 랜덤 숫자 소수자리도
Math.round(100*Math.random()); // 100이하의 숫자를 반올림된 정수
문자는 큰따옴표나 작은따옴표로 감싸야 한다.
역슬래쉬(’\’) 바로뒤의 문자 하나는 그냥 정보로서 해석 > \’ 는 문자 시작하거나 끝내는 따옴표가 아닌 일반 문자로 취급
typeof()를 통해 해당 데이터의 타입을 알 수 있다.
줄바꿈 : \n
문자 결합 : + ex) alert(”coding” + “everyday”);
문자의 길이를 구할 때는 문자 뒤에 .length를 붙임 ex) “asdf”.length //4출력
변수 : var로 시작, 변수이름은 특수문자를 제외한 모든 문자로 시작가능 / var a=2;
대입연산자 : = / 좌항을 우항에 대입
동등 연산자 : == / 좌항과 우항을 비교해서 서로 값이 같으면 true 아니면 false / 숫자1과 문자 1을 같다고 인식
일치 연산자 : === / 좌항과 우항이 정확하게 같을 때 true 아니면 false / 숫자1과 문자1을 다르게 인식
일치 연산자(===)를 사용하자
undefined : 정의되지 않음(의도적 x) / null : 값이 없음-의도적으로 값이 없는 상태를 부여한것
alert(null == undefined); // true alert(null === undefined); // false
boolean(데이터타입) : true / false
undefined(데이터타입) : undefined
null(데이터타입) : null
true ==1 // true true===1 // false
부정 : ! / != , !==
조건문 : if / else if / else →조건에는 boolean
prompt : alert와 같은 창이 뜨지만 입력창을 통해 입력 가능 / prompt(”당신의 나이는?”);
논리연산자
&&: and연산
|| : or연산
! = not
반복문(loop / iterate)
while(조건){반복시행할 코드} : 조건에는 boolean값
for(초기화 ; 반복조건; 반복될때마다 실행되는코드){} → for( var i=0; i<10; i++)
break : 반복 중단 / continue : 계속
debugger : 해당 코드에서 멈춤 →watch expressionsdp에 i를 입력하면 i값변화를 알수있음 화살표클릭하면서 밑으로가는화살표는 디버거걸린문장 아래의 코드 흐름에 따라 실행
함수 : function 함수명 (매개변수(paramiter)..) {코드 return 반환값} / 호출 : 함수명();
return : 출력, 함수를 종료시킴, 리턴 뒤의 코드는 동작하지 않음
인자 : 입력값, argument
ex) function get_argument(arg){ return arg *1000;}
get_argument(1); //1000출력
배열(array): 연관된 데이터를 모아서 관리하기위한 데이터타입 / 변수: 하나의 데이터 저장
ex) var member = [’a’, ‘b’, ‘c’];
member[0] →a member[1] →b member[2] → c
배열로 리턴을 할 수 있음
function numbers(){ return [’1’,’2’,’3’];}
var num = numbers();
document.write(num[0]); →1출력
배열의 크기 = 배열명.length
배열에 값 추가 : 배열명.push(’’);
배열에 값 여러개추가 : 배열명=배열명.concat([’a’,’b’]);
배열의 시작점에 값추가 : 배열명.unshift(’z’);
배열의 특정구간을 추출하거나 특정구간에 특정배열을 추가 : 배열명.splice(index, howmany, ‘a’,’b’); //index:추가할 위치 , howmany : 제거할 원소의 수
배열의 첫번째 원소제거 : 배열명.shift();
배열의 끝 원소 제거 : 배열명.pop();
정렬 : sort(); →오름차순 정렬 / reverse(); →내림차순 정렬
객체 : 배열은 식별자(인덱스)로 숫자를 사용하지만 객체는 식별자(인덱스)로 문자를 사용가능
var grades = {’fff’ : 10, ‘eiei’ : 6, ‘asss’ : 80}; // ‘fff’는 key(인덱스), 10은 value(값)
grades[’fff’] → 10 grades.fff →10
var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};
for(key in grades) {
document.write("key : "+key+" value : "+grades[key]+"<br />");
} //key는 객체에 있는 key값을 받음
객체 안에 키값으로 list, list에 다시 객체가 들어갈수있다
→grades 객체 안에는 list라는 키가 있고 그 키안에 다른 객체가 담김
this : 함수가 속해있는 객체를 가르키는 변수
var grades = {
'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80},
'show' : function(){
for(var name in this.list){
document.write(name+':'+this.list[name]+"<br />"); //egoin : 10 ~ 출력, alert(grades['list']['egoing']) 10출력
}
}
};
grades.show();
모듈: 코드를 여러개의 파일로 분리하는 것 / 재활용성 높이고 유지보수 쉬움
greeting.js에 코드 작성 후
<script src=”greeting.js”></script>
를 통해 호출가능
UI : user interface
API : applicaion programming interface
정규표현식 : 문자열에서 특정한 문자를 찾아내는 도구 / 중요작업:추출, 테스트, 치환
var str= “a”; // 문자열 만드는것
정규표현식 문법
var pattern =/a/; →슬래시 사이의 문자열a가 찾고자하는 대상이다
var pattern = new RegExp(’a’); →a를 찾고자하는 정규표현식 객체생성, 위의 것과 같음, RegExp는 정규표현식 객체를 의미함
pattern.exec(’abcde’); →문자열안의 a를 출력
pattern.test(’abcde’); →문자열안에 패턴(a)가 있는지 true false로 출력
console.log(’abc’.match(pattern)); →[”a”]출력 , 없으면 null출력
console.log(’abc’.replace(pattern. ‘A’); → pattern의 문자열을 A로 치환
정규표현식의 옵션: 옵션에 따라 출력되는 결과가 다르다, 옵션동시사용가능
i : 대소문자를 구분하지 않는다.
var x=/a/;
console.log(”Abcde”.match(x)); //null
var o=/a/i; //대소문자 구분x
console.log(”Abcde”.match(o)); //[”A”] 출력
g : 검색된 모든 결과를 리턴
var x = /a/;
console.log(”abcdea”.match(x)); // [”a”] 하나만 출력
var o = /a/g;
console.log(”abcdea”.match(o)); //[”a”, ”a”] 2개출력
함수
지역변수 : 함수내부에서 선언된 변수 / 함수내부에서만 접근 가능한 변수, 선언한 함수 내부에서만 사용
전역변수 : 함수외부에서 선언된 변수
var vscope = 'global';
function fscope(){
var vscope = 'local';
alert('함수안 '+vscope);
}
fscope();
alert('함수밖 '+vscope);
var없이 선언하게 되면 함수내에서 선언해도 전역변수로 된다.
전역변수를 사용해야하는 이유가 분명하지않으면 대부분 지역변수를 사용해야함
전역변수를 사용하는 방법
var MYAPP = {}
MYAPP.calculator = {
'left' : null,
'right' : null
}
MYAPP.coordinate = {
'left' : null,
'right' : null
}
MYAPP.calculator.left = 10;
MYAPP.calculator.right = 20;
function sum(){
return MYAPP.calculator.left + MYAPP.calculator.right;
}
document.write(sum());
MYAPP는 전역변수 → 어느함수에 속해있지않음 , 객체
calculator , coordinate →속성(객체안에있는 변수)
⇒하나의 전역변수 객체에 여러가지 변수를 넣어서 사용가능