반응형
JavaScript란?
- 웹 페이지에서 복잡한 기능을 구현할 수 있는 스크립팅 또는 프로그래밍 언어
- HTML, CSS와 함께 웹을 구성하는 요소
- 클라이언트 단에서 웹 페이지가 동작하게 하는 것을 담당
JavaScript의 사용
1. HTML 내부
<script>
console.log("Hello World!");
</script>
2. HTML 외부
<body>
<script src = "test.js"></script>
</body>
// test.js
console.log("Hello World!");
JavaScript 문법
자바스크립트 실행문은 세미콜론(;)으로 구분한다.
let str1 = "Hello";
let str2 = "World!";
console.log('${str1} ${str2}');
1. 주석
주석 또는 코멘트(comment)는 프로그래밍에 있어 내용을 메모하는 목적으로 쓰인다.
소스 코드를 더 쉽게 이해할 수 있게 만드는 것이 주 목적이며, 협업할 때 유용히 쓰인다. 컴파일러와 인터프리터에 의해 일반적으로 무시되어 프로그램에 영향을 주지 않는다.
let a; // 주석은 실행할 때 무시
let /* 여러줄
주석 */ b;
2. 변수 선언
var문에서 변수에 초기 값을 지정하지 않는다면, 변수는 값이 설정될 때까지 undefined 값을 갖게 된다.
let은 변수가 선언된 블록, 구문 또는 표현식 내에서만 유효한 변수를 선언한다. 이는 var 키워드가 블록 범위를 무시하고 전역 변수나 함수 지역 변수로 선언되는 것과 다른 점이다.
const는 블록 범위의 상수를 선언한다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없다. 그래서 처음 선언할 때, 반드시 초기화를 해야한다.
var 변수1 = "var 사용은 권장되지 않음";
let 변수2 = "변수 선언시 let 사용 권장";
const 상수 = "상수 선언시 const 사용";
3. 연산자
let a;
a = 2; // 대입 연산자
let a = 2;
console.log(a + 1); // 산술 연산자 더하기
console.log(a - 1); // 산술 연산자 빼기
console.log(a * 1); // 산술 연산자 곱하기
console.log(a / 1); // 산술 연산자 나누기
console.log(a % 1); // 산술 연산자 나머지
console.log(a == 1); // 같으면 true
console.log(a != 1); // 다르면 true
console.log(a < 1); // a가 1 미만이면 true
console.log(a <= 1); // a가 1 이하면 true
console.log(a > 1); // a가 1 초과면 true
console.log(a >= 1); // a가 1 이상이면 true
4. 조건문
if : 조건문 A가 참이면 실행else : 조건문이 모두 거짓이면 실행else if : 조건문 A가 거짓이고 조건문 B가 참이면 실행
let score = 50;
if (score >= 90) {
console.log("A");
} else if (score >= 80) {
console.log("B");
} else if (score >= 70) {
console.log("C");
} else if (score >= 60) {
console.log("D");
} else {
console.log("F");
}
5. 반복문
while : 조건문이 참일 때 계속 반복 실행for : 조건식이 참일 때 계속 반복 실행
for (let i = 1; i <= 5; i = i + 1) {
console.log(i);
}
반응형
'WINK-(Web & App) > HTML & CSS & JS 스터디' 카테고리의 다른 글
| [2024 신입부원 기초 스터디] 김태일 #4주차 (0) | 2024.05.15 |
|---|---|
| [2024 신입부원 기초 스터디] 정채은 #3주차 (JS) (0) | 2024.05.13 |
| [2024 신입부원 기초 스터디] 황수민 #3주차 (0) | 2024.05.13 |
| [2024 신입부원 기초 스터디] 백채린 #3주차 (JS) (0) | 2024.05.13 |
| [2024 신입부원 기초 스터디] 박건민 #3주차 (0) | 2024.05.12 |