alert
<script>
// 브라우저 화면상에 알림 창을 출력한다.
// alert('안녕하세요.');
// window.alert('안녕하세요');
</script>- alert 을 먼저 실행한다
console.log
<script>
// 브라우저 화면상에 알림 창을 출력한다.
// alert('안녕하세요.');
// window.alert('안녕하세요');
// 개발자 도구 콘솔 화면에 출력할 때 사용한다.
console.log('안녕하세요.');
</script>backgroundColor 변경
- 개발자 도구에서 적용
→ 이 코드를 js 에 적용 시키면 안됨
왜냐면 title 밑에 외부 자바스크립트 방식을 추가하였기 때문에 heading을 아직 그리지 않음(heading이 존재하지 않음)
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>기본 문법</title>
<!-- 외부 자바스크립트 방식 -->
<!-- <script src="./01_기본문법.js"></script> -->
</head>
<body>
<h2 id="heading">기본 문법</h2>
<h3>1. 변수</h3>
<h4>1) 변수 선언</h4>
<p>
변수를 선언할 때는 var, let, const 키워드를 사용한다.
</p>
<!-- 내부 자바스크립트 방식 -->
<script>
// 브라우저 화면상에 알림 창을 출력한다.
// alert('안녕하세요.');
// window.alert('안녕하세요');
// 개발자 도구 콘솔 화면에 출력할 때 사용한다.
// console.log('안녕하세요.');
// window.console.log('안녕하세요.');
</script>
<script src="./01_기본문법.js"></script>
</body>
</html>→ 이렇게 heading을 다 그리고 난 후에 적용시키면 오류없이 잘 됨 !
var, let, const
// 1. 변수
// 1) 변수 선언
// 전역 변수
str1 = '전역 변수';
var str2 = 'var 전역 변수';
let str3 = 'let 전역 변수';
// 자바스크립트에서 페이지가 모두 로드되면 실행될 함수를 구현할 때 사용한다.
window.onload = function() {
// document.getElementById('heading').style.backgroundColor = 'red';
// 지역 변수
var str4 = 'var 지역 변수';
let str5 = 'let 지역 변수';
str6 = '전역 변수';
var str7;
// 전역 변수와 동일한 이름의 지역 변수를 선언
// 전역 변수와 지역 변수가 동일한 이름인 경우, 함수 내부에서 지역 변수가 우선권을 가진다.
console.log(str1);
console.log(str2);
console.log(str3);
console.log(str4);
console.log(str5);
console.log(str6);
console.log(str7);
console.log('-----------------------------');
// var, let, const의 차이점
// 1) 중복 선언
// - var 키워드로 선언된 변수는 중복 선언이 가능하다.
var num = 0;
console.log(num);
var num = 10;
console.log(num);
// - let, const 키워드로 선언된 변수는 중복 선언이 불가능하다.
let num2 = 10;
console.log(num2);
// let num2 = 20;
// console.log(num2);
const num3 = 20; // 선언과 동시에 초기화 해야 한다.
console.log(num3);
// const num3 = 30;
// console.log(num3);
}
⛧1일 1알고리즘⛧