[JS] 3. 자바스크립트를 크롬브라우저 콘솔에서 작성하고 실행해보기

자바스크립트 강의 목차

0. 자바스크립트란 무엇인가?

1. Script 태그 (document.write)

2. 자바스크립트 이벤트란 무엇인가?

3. 자바스크립트를 크롬브라우저 콘솔에서 작성하고 실행해보기

4. 데이터 타입 문자열과 숫자

5. 변수와 대입연산자

6. 자바스크립트로 웹브라우저 제어하기

7. 비교연산자, Boolean 데이터타입

8. 자바스크립트 조건문 및 활용법

9. 리팩토링(refactoring)

10. 배열에 대한 이해

11. 반복문에 대하여

12. 배열과 반복문

13. 배열과 반복문의 활용

14. 함수란 무엇이고 왜 필요한가?

15. 함수의 기본사용법, 매개변수, 인자, 리턴

16. 함수의 활용

17. 객체는 왜 필요한가?

18. 객체란 무엇인가?(객체 생성, 추가, 추출방법)

19. 객체의 활용

20. 파일로 쪼개어 관리하기

21. 라이브러리와 프레임워크

22. API & UI 그리고 프로젝트 활용도구

---

 

이번시간에는 자바스크립트를 필요에 따라 바로 작성하고 적용해 볼 수 있는 방법을 배우도록하겠습니다.

먼저 작성된 자바스크립트 파일을 웹브라우저(크롬)에서 오픈한 후 오른쪽 마우스 버튼을 클릭해서 개발자도구로 들어갑니다.

 

 

1. 크롬 브라우저에서 개발자도구를 연후, Console 클릭

Elements 오른쪽에 Console라고 있습니다. 그걸 클릭해주세요!!

모든 웹페이지에서 우리는 이 콘솔기능을 사용할 수 있습니다. 왼쪽에 있는 Web의 문서의 내용중 글자수가 몇개인지를 알아보는 걸 한번 작성하고 결과를 보도록 하겠습니다.

 

먼저 왼쪽에 있는 문장을 복사해서 오른쪽 콘솔창에 붙여넣습니다. 아래와 같이요~

 

그리고 자바스크립트를 활용해서 글자수를 확인해볼께요!

문장을 ' ' 로 묶은 뒤에 마지막에 .length 를 해줍니다. 아래와 같이요!

결과값이 582라는걸 확인할 수 있죠?

alert() 함수를 사용해서 아래와 같이 새창으로 결과값을 확인할 수도 있습니다.

 

 

생활코딩 강의안을 바탕으로 재작성된 강의안입니다.

opentutorials.org/course/3085/18869