본문 바로가기

개발/개발괴발

벼락치기 자바스크립트 공부하기

<script> 사이에 자바스크립트 위치 </script>

 

#숫자

alert(1 + 1) -  2

alert(1.2 + 1.3) - 2.5

alert(2 * 5) - 10

alert(6 / 2) - 3

Math.pow(3, 2) - 3의 2승

Math.round(10.6) - 반올림

Math.celi(10.2) - 올림

Math.floor(10.6) - 내림

Math.sqrt(9) - 제곱근

Math.random() - 0 ~ 1.0사이의 랜덤한 숫자

 

#문자

alert("coding") - "" 나 '' 상관없음. 통일만 할것

alert(type of "1") - string, "" 사이에 있기 때문에 string

alert(type of 1) - number, ""사이에 없으니까 숫자임

'coding \' sting' <- 문장안에 ' 쓰고 싶으면 앞에 \ 붙일 것

 

alert ("coding" + "everybody") - 두개 붙어서 나온다. 사이에 스페이스바만 들어감.

alert("coding everybody".length) - 16 길이 출력됨

 

#변수

var a = 1

var first = "coding"

alert(first + "everybody") 이런식으로 사용가능

var a = "coding", b = "everybody"

var member = ['a', 'b', 'c'];

member[0];

member[1];

 

#비교

a === b 이렇게 === 3개 짜리는 변수 타입 까지 비교함.

 

#조건문

if(true){

    alert('result : true');

} else if(true) {

    alert(2);

} else{

    alert(3);

}

 

0 = false

1 = true

 

#반복문

while(조건){

    실행코드

}

 

for(var i=0; i<10; i++){

    document.write('coding every body' + i + 'day<br/>');

}

 

#함수호출

function number_count(){

    i=0;

    return i;

}

 

number_count();

 

var number_count = function(){

    i=0;

    return i;

} 이런식으로 정의 가능

 

number_count(); 하고 여기서 호출

 

function get_members(){

    return [ 'a', 'b', 'c'];

}

var members = get_members();

배열을 리턴받을수도 있음.

 

#배열

var li = ['a', 'b', 'c'];

li.push('d'); 뒤에 추가

li = li.concat (['f', 'e']); 여러개 추가할때

li.unshift('z'); 제일 앞에 추가할때

li.splice(2,0,'B'); 2번째 인덱스 뒤에 B넣고 싶을때

li.shift(); 첫번째 원소 제거

li.pop(); 제일 마지막 제거

li.sort(); 정렬

li.reverse(); 역순정렬

 

#객체

- 방법 1

var grades = { 'a' : 10, 'b' : 3, 'c' : 9};  a,b,c,는 key 10,3,9는 value.

- 방법 2

var grades = {};

grades['a'] = 10;

grades['b'] = 3;

- 방법 3

var grades = new Object();

grades['a'] = 10;

 

객체 접근 방법

grades['a']

grades.a

 

for(key in grades){

    document.write("key : " + key + "value : " + grades[key]);

}

 

-객체에 함수담기 가능

var grades = {

    'list' : {'a' : 10, 'b' : 5},

    'show' : function(){

        for(var name in this.list){

            document.write(name + this.list[name]);

        }

    }

};

grades.show();

 

#정규 표현식

var pattern = /a/

var pattern = new RegExp('a');  두개가 같은 기능. a라는 텍스트를 찾는 정규표현식

 

console.log(pattern.exec('abcdef')); -> a

console.log(patter.exec('bcde')); -> null (a가 없으니까)

 

console.log(pattern.test('abcdef')); -> true //a를 찾았으므로 test 쓰면 T, F로 반환.

 

* 비슷한 문자열의 method

- string.match()

 console.log('abcdef'.match(pattern));

- string.replace()

console.log('abcdef'.replace(pattern, 'A')); //a를 찾아서 A로 replace.

 

- 정규 표현식에 옵션 추가하기

var pattern = /a/i;  i가 붙으면 대소문자 구분 안함

var pattern = /a/g; g가 붙으면 검색된 모든 결과 리턴

 

- 괄호안의 패턴은 변수처럼 재사용 가능

var pattern = /a a/;

$1, $2이렇게 사용한다.

 

- 이해 안되는 예제

var arr = []

for(var i = 0; i < 5; i++){

arr[i] = function(id) {

return function(){

return id;

}

}(i);

}

for(var index in arr) {

console.log(arr[index]());

}

 

 

 

 

 

 

#기타

var id;

id = promt('입력해주세요.') - 입력값으로 받아온 값이 id 값으로 들어감.

document.write('coding everyday <br />');