내가 해냄/패스트캠퍼스

패스트캠퍼스) K-Digital Credit 프로그래밍 첫걸음 시작하기 4주 차 수강후기 | 프로그래밍 기초 인강

hello-yeond 2022. 3. 7. 23:30

 

 이번 주에는 3주 차 스터디를 진행하였다. 스터디가 한 주 늦게 시작해서 한 주 밀리지만 강의는 4주 차를 맞춰서 잘 들었다. 이번 강의는 자바스크립트에 관한 부분이였고 내가 처음 배웠던 언어이니만큼 애정도가 있는 언어이다. 

 

 

JavaScript

 

 복잡한 무언가를 웹페이지에 적용할 수 있게 하는 스크립트 혹은 프로그래밍 언어이다. 주로 웹페이지의 동적 기능들을 담당한다. 

 

HTML, CSS, JavaScript

 

HTML CSS JavaScript
갖다놓고 꾸미고 시킨다

 

JavsScript를 사용하는 방법

 

1. script 태그 안에 작성하기 : html 문서 내 head 태그 내, 필요시 body태그 내 특정 위치에 사용

 

<script>
  function showMyAlert () {
    alert("짠! 알림창이 나타났습니다.");
  }
</script>

 

2. .js 파일을 따로 두기 : js파일을 따로 만들어 js파일 연결 코드를 작성 

 

<script src="script.js"></script>

 

3. console.log 사용하기

 

showMyAlert();

 

JavsScript의 자료형

 

0. 자료형(type) : 데이터의 자료형을 확인할 수 있다.

 

typeof "choonsik"  
// "string"
typeof 1
// "number"

 

1. 문자열(string)

 

console.log("안녕하세요.");
console.log(typeof "안녕하세요");
//안녕하세요.

console.log("춘식이" + "귀엽다.");
//춘식이귀엽다

 

2. 숫자(number)

 

typeof 1
// "number"

 

3. 변수(variable) : 데이터를 담는 일종의 주머니, 모든 종류의 데이터 할당이 가능하다.

 

//var를 사용하여 변수 선언이 가능하다.
var salutation = "춘식이 왕 귀엽다!";
var typesTestDiv = document.querySelector("#typesTest");

typesTestDiv.innerHTML = salutation;
// document.querySelector("#typesTest").innerHTML
//   = "춘식이 왕 귀엽다!";

 

4. 참/거짓(boolean)

 

var choonsikIsCute = true;
var choonsikIsntCute = false;

console.log(choonsikIsCute);
console.log(choonsikIsntCute);

 

5. 연산자

 

   - 1) 부정 연산자 :  !

 

var myBool_1 = !choonsikIsCute;
var myBool_2 = !choonsikIsntCute;

console.log(myBool_3); 
console.log(myBool_4);

 

   - 2) 비교 연산자 : ==. ===, !=, !==

 

         == : 같은 타입으로 바꾸어 비교

         === : 타입이 같은지의 여부도 비교 

         != : ==와 반대로 작동

         !== : ===와 반대로 작동

 

   - 3) AND 연산자 : &&, OR 연산자 : ||

 

         && : 양쪽 모두 true일 경우 true를 반환

         || : 양쪽 중 하나 이상이 true이면 true를 반환