자바스크립트 JS 기초 기능 살펴보기

• alert
• console
• document

// 브라우저 알림참으로 표시
alert('hello js');

//개발환경 콘솔 창에 표시
console.log('hello');

// 웹 페이지에 출력 표시 docyment 방법은 잘 사용안함
document.write('JS');

---

- 변수 상수

• let 변수명;    mathScore
• const 상수;    PL

let message;
message = 'hello';  //작은 따옴표 또는 큰 따옴표 중에 원하는 스타일로 하면 된다.

console.log(message);

let message;
message = 'hello';

console.log(message);

message = 12345;

console.log(message);

let a = 'hello';
let b = 25
let c = 'aaaa';

let d = 'hello', e = 25, f = 'aaa';

let g = 'hello',
    h = 25,
    i = 'aaa';

---

const COLOR_RED = '#f00';

const COLOR_RED = '#f00';
const COLOR_BLUE = '#f1';

let color = COLOR_RED;

/** 첫 번째 방법 보다는 두 번째 방법이 유지보수가 좋다. */


// 네비 바 색
console.log(COLOR_BLUE);

// 컨테이너 색
console.log(COLOR_BLUE);

// 푸터 색
console.log(COLOR_BLUE);

//-------------------------------------

// 네비 바 색
console.log(color);

// 컨테이너 색
console.log(color);

// 푸터 색
console.log(color);

---

- 자료형

• 숫자

let m = 'hello'
m = 1234;

console.log(m);

let n = 12345;
n = 12.34;

console.log(n);

console.log(3 / 0);

• 문자

let str1 = 'hello';
let str2 = "js";
let str3 = `aaa ${str2}`;

console.log(str1);
console.log(str2);
console.log(str3);

console.log(str1 + 'hs');
console.log(`${str1} js`);

---

let str = 'hello';

console.log("계산식 : 1 + 1");
console.log("계산식 : " + 1 + 1);
console.log("계산식 : " + (1 + 1));
console.log(`계산식 : ${1+1}`);

• boolean

let a = true;

let b = 5 > 1;

let a = null;
let b;

console.log(a);
console.log(b);

• null <- 비어있음
• undefined <- 할당안함

let a = null;
console.log(typeof a);

let b = 3.14;
console.log(typeof (b));

let c = '3.14';
console.log(typeof (c));

---

let n = 'js';

alert(`hello ${1+1}`);
alert(`hello ${'n'}`);
alert(`hello ${n}`);

---

// alert('hello');

prompt('hello');

let a = prompt('hello');

console.log(a);

prompt로 클라이언트가 입력한 입력 데이터 값을 받아와 저장하기 위해서는 저장변수도 같이 입력

 

// '메세지 내용', [기본값] <-- 기본값은 필요없을시 사용안해도 됨
let a = prompt('나이 입력', 20);

console.log(a);

 

let a = prompt('나이 입력', 20);

alert(`반갑습니다 ${a}살`);

 

• prompt는 기본 문자타입

//prompt로 입력받은 값은 문자로 인식됨
let a = prompt('나이 입력', 20);
alert(typeof(a));
alert(`반갑습니다 ${a + 1}살`);

 

• 숫자로 형변환

// Number () 형변환을 시켜준다
let a = Number (prompt('나이 입력', 20));
alert(typeof(a));
alert(`반갑습니다 ${a + 1}살`);

---

• confirm

confirm('안녕하세요');

 

 

let a = confirm('1 + 1 = 2가 맞나요?');

alert(a);

---

- 모달 -  출력 창이 떠 있는 동안 다음 작업은 중

• alert : 단순 메세지 출력용
• prompt : 사용자가 뭔가 입력을 할 수 있는 창 (문자)
• confirm : 확인 / 취소 (true / false)

---

• 형변환 - String(데이터) : 문자형으로 변환

let a =true;
alert(typeof a);

a = String(a);
alert(typeof a);

 

let a = '1234'
alert(typeof a);
a = Number(a);
alert(typeof a);

let b = 'aaaa1234'
alert(b);
b = Number(b);
alert(b);

 

 

let b = null
alert(b);
b = Number(b);
alert(b);

 

 

let b = true
alert(b);
b = Number(b);
alert(b);

 

let a = 1;
alert(Boolean(a));