자바스크립트는 스크립트 형식이라 별도의 컴파일 없이 실행가능하다. 웹에서 사용자의 액션을 받아오기 위해 사용한다. 사용자와 웹 사이에 상호작용을 위한 기술이다
html 파일 안에서 스크립트를 작성할 때,
body 후반부에 스크립트를 작성하는 것이 좋다.
<body>
...
<script>
function regist() {
}
</script>
</body>이렇게 하게 되면 스크립트 보다 헤드와 바디에 있는 내용이 먼저 읽히기 때문에,
구성된 화면이 먼저 로드가 된다. 따라서 사용자 입장에서 로딩이 빠르다고 느낀다.
외부 라이브러리를 가져올때
내 로컬에 직접 다운받을 수도 있고
라이브러리를 URL을 넣어서 사용할 수도 있다.
만약에 실제 어플리케이션을 개발해서 서비스할때는
로컬에 가지고 있어야 네트워크가 느린 환경에서도 개발하기 유용하다.
라이브러리 기능을 단순 테스트 해보기 위해서는 URL을 이용하는 것이 좋다.
- 자바 스크립트의 라이브러리
- Element를 선택하는 강력한 방법과 효율적인 제어 기능을 제공
- 동일한 변수명도 허용
- 위에서 쓴 변수가 이제는 필요없고 같은 변수명으로 새로운 변수를 만드는 경우에 사용
- 동일한 변수명 허용 안됨
- 한번 값을 할당하면 변경이 안됨, 상수
let a = 1; // 숫자
a = 1.234; // 소수점 숫자
a = 'hi'; // 문자
a = true; // T/F- 자바 스크립트는 변수에 값을 지정할 때 별도의 타입 선언이 필요없다.
- key, value 로 이루어진 타입
- 파이썬 딕셔너리랑 비슷하게 키로 접근해야 함
- 선언하는 시점에 없는 키는 자동으로 생성됨
- 많은 변수를 매개변수로 입력할 때나 한번에 접근하고 싶을 때 사용하면 유용함
- 모든 타입의 변수를 담을 수 있고 서로 달라도 상관 없음
- 선언 하는 시점에 키밸류 쌍을 입력할 필요 없다. 이후에도 추가 할 수 있다.
let obj = {
name : "",
city : ""
}
obj.name = $(#name).val();
obj.city = $(#city).val();
obj.age = 23; // 키밸류 쌍으로 추가됨- 여러 데이터가 순서를 가지고 담겨있는 데이터 타입
- 인덱스를 통한 접근이 가능하다
let city = [
{
code:"02",
name:"서울"
},
{
code:"064",
name:"제주"
}
];이 외에도 날짜나 여러 데이터 타입이 있다.
- if 이후 괄호 안에 조건문이 실행될 조건을 입력
- if, else if, else 로 구성
if (i==0)
$('#city').append('<option value="' + city[i].code + '" selected>' + city[i].name + '</option>');- 자바 for문이랑 비슷한 구조다
for (let i = 0; i<city.length; i++){
if (i==0)
$('#city').append('<option value="' + city[i].code + '" selected>' + city[i].name + '</option>');
else
$('#city').append('<option value="' + city[i].code + '">' + city[i].name + '</option>');
}- 함수를 만들어 놓으면 동일한 기능을 재사용할 때 유용
- 같은 내용이 반복될 경우 사용하면 유리함