JS의 문자열 , 숫자 , 형변환 , 연산자
문자열 (String 내장 객체)
javascript에는 문자열을 나타내는 객체 String이 존재하며
문자열과 관련된 기본적인 함수를 제공해준다.
숫자 (Math 내장 객체)
숫자(number) 타입 리터럴 표기법
:12(정수) , 3.14(실수) , Infinity(무한) , NaN(Not a Number)
Math : 숫자 관련 함수를 제공하는 JS 내장 객체.
ex) Math.random() ,
- 그냥 Java에서 쓰는것 처럼 쓰면 될 듯 import시키지 않아도 괜찮다.
형 변환
parseInt(문자열): 정수형태로만 변환 (3.14 -> 3)
parseFloot(문자열): 실수형태로 변환 ("정수"->정수 , "실수"->실수)
Number(문자열): floot랑 같은데 더 편하게 쓸수 있다.그냥 Number만 쓰면 될 것 같다.
동등 / 동일 비교 연산자.
동등 비교 연산자( == , != )
-> 같이 같으면 true
-> 자료형이 관계없다
ex1) "1"==1==true 3개 모두 같다.
동일 비교 연산자(=== , !===)
-> 값과 자료형 모두 같이야지 True반환
JS에서 중요하게 사용될것 같다
자료형을 내가 직접 제어하는게 아니라 정확한 비교를 위해
잘 기억해야 할것 같다
배열
JS는 배열을 반환 받는 경우가 많아 배열을 자주 사용해야 한다.
JS배열의 특정
- 자료형의 제한이 없다 (각 배열칸마다 다른 자료형이 들어간다.)
- 길이 제한이 없다
== 자바의 Collection List와 비슷하다.
JS 하다 가끔씩 드는 생각인대 적당히 자유로워야지 너무 자유로운 느낌이다...
이러다가 AI한태 지배받지 하나하나 컨트롤해야지 주권이 인간한태 있다.
document.getElementById("btn1").addEventListener("click",function(){
//배열 선언 방법.
const arr1=new Array(3); //3칸짜리 배열 생성
const arr2=new Array(); //0칸 짜리 배열(비어있는 배열) 생성
/* console.log(arr1);
console.log(arr2); */
arr1[0] = "깁밥";
arr1[1] = 123;
arr1[2] = true;
arr1[3] = true;
console.log(arr1);
//0칸 배열에 대입 -> 자동으로 길이가 증가함
arr2[0] = "깁밥";
arr2[1] = 123;
arr2[2] = true;
console.log(arr2);
// 배열 선언 방법
const arr3 = []; //비어있는 배열 [0칸]
const arr4 = ["사과","딸기","망고","용과"] //선언 +초기화
//for문 배열 요소 접근.
// 1. 일반 for문
// 2. 향상된 for문 (for .... of) : 배열용 향상된 for문
for(let item of arr4){
//arr4 배열에서 요소를 하나씩 얻어와 item에 대입
console.log(item);
}
})Stack 구조 관련 함수
push(): 배열 마지막 요소로 추가하기
pop() : 배열 마지막 요소를 꺼내옴
배열.indexOf("값") : 일치하는 값을 가진 요소의 index를 반환
: 없으면 -1 반환
정렬
배열.sort([정렬기준 함수]) : 배열 내 요소를 오름차순 정렬(문자열)
단,[배열기준 함수]에 따라서 결과가 달라진다.
배열.toString() : 배열 요소를 하나의 문자열로 출력
-> 요소 사이에 , 기호 포함 출력
배열.join("구분자") : 배열 요소를 하나의 문자열로 출력
-> 요소 사이에 "구분자"로 구별해 출력
window 내장 객체
브라우저 창 자체를 나타내는 객체
window 객체는 JS의 최상위 객체면서
DOM (Document Object Model) ,
BOM (Browser Object Model) 으로 구분된다
DOM(Document Object Model) : document
BOM(Browser Object Model) : location, history, screen, navigator
* window 객체는 창 자체를 나타내고 있으므로
어디서든 접근이 가능하다.
그래서 window라는 객체 호출부를 생략할 수 있다.
ex) window.alert() == alert()
window.setTimeout ( 함수, 지연시간(ms) )
지연 시간 후 함수가 '1회'실행하는 것
document.getElementById("btn1").addEventListener("click",function(){
setTimeout(function(){alert("3초과 경과된 것")},2000)
})window.setInterval(함수,지연시간)
지연 시간 마다 함수가 실행하는 것
//1초마다 갱신하는 함수
function clockFn(){
const clock = document.getElementById("clock");
clock.innerText = currentTime();
//지연시간 마다 반복(첫 반복도 지연시간 후에 시작)
// -> 페이지 로딩후 1초후 부터 반복된다. (지연->함수->지연->함수)
interval = setInterval(function(){
clock.innerText = currentTime();
},1000)
}
//현재 시간을 확인하는 함수.
function currentTime(){
const now = new Date();
return now.getHours()+":"+now.getMinutes()+":"+now.getSeconds();
}
//페이지가 로딩될 때 자동으로 호출
clockFn(); //로딩시 자동으로 함수 호출
//계속 읽어오고 있는 interval을 삭제 해 중지시킨다.
document.getElementById("stop").addEventListener("click",function(){
clearInterval(interval);
})