입문자를 위한 js 변수와 자료형(1)

11113 단어 jsJavaScriptJavaScript

1. 변수 선언 방법

자바스크립트 에는 변수 선언 방법에는 3가지 방법이 있습니다.

전역변수

var

읽기 쓰기 수정 삭제가 가능한 전역변수

var a;

변수 avar 로 선언을 했습니다 하지만 뒤에 붙는 ; 이건 뭘까요?
그것을 세미콜론이라고 부르고 끝에 세미콜론을 붙여주는 이유는 글을 쓸때 마침표와 비슷합니다.

저희는 컴퓨터를 다루기에 컴퓨터는 어디서 끝맺음을 해야 하는지 모릅니다.

그러기 때문에 세미콜론으로 끝날곳을 구분을 해주기에 끝에 세미콜론으로 마무리 합니다.

하지만 자바스크립트세미콜론을 붙이지 않아도 자동으로 붙여주니, 세미콜론을 붙이지 않으셔도,

정상적으로 작동하지만 붙여주려면 완전히 붙여주시고 붙여주기 싫으시다면 다 통일해서 붙여주지 않으시면

됩니다.

참고: 한줄에 여러가지 작업을 할때는 세미콜론을 반드시 붙여주어야 합니다.

var a let b const c = 3 // 이렇게 적으시면 안됩니다

var a
let b
const c = 3 //이렇게 하셔야 합니다 상당히 중요하고 위와 아래는 다른거에요!!!

지역변수

let

읽기 쓰기 수정 삭제가 가능한 지역변수

let b;

b = 123456

b = 'hello'

코드가 앞서 배우셨던 var와는 매우 다르게 되어 있죠?

컴퓨터는 위에서 아래쪽으로 읽어 처리하게 되어 있습니다.

제일 먼저 변수 b를 선언해주었습니다.

다음에는 123456을 변수 b의 값으로 초기화 해주었습니다.

다음으로는 hello를 변수 b의 값으로 초기화 해주었으니,

최종적으로 변수 b의 값은 hello 가 됩니다.

const

읽기만 가능한 지역변수

const c = 3;

const 는 다른 변수 선언 방법과는 다르게 선언과 동시에 값을 초기화 해주어야 합니다.

그렇지 않으면 오류가 나옵니다.

또한 한번 선언한 const 변수는 값을 다시 초기화 할수가 없습니다.

선언과 동시에 값을 초기화 하지 않고 선언하는 경우.

한번 선언한 const 변수의 값을 다시 초기화 하려고 하는 경우.


요점 정리

변수 선언에 대해서 정리해 보자면

var전역적으로 선언하기 위해서 사용을 하고

letconst는 지역적으로 선언하기 위해서 사용을 한다.

varlet은 읽기 쓰기 수정 삭제가 가능하며

const는 읽기만 가능하다.

라고 볼수가 있습니다.

2. 자료형

1. 데이터 타입

데이터 타입은 총 7가지의 데이터 타입이 존재 합니다.

6가지 원시 데이터형

  • boolean
  • null
  • undefined
  • number
  • string
  • symbol
  • object

각각의 데이터 타입이 의미 하는 것을 알려드리도록 하겠습니다.


1. boolean

boolean은 참(true)과 거짓(false)로 나뉘는 논리적인 데이터 유형입니다.

상당히 많은곳에서 사용하고 있고 잘 알고 있어야 되는 부분입니다.

아직 여러분들은 접하지 않으신 개념이지만 자주 사용하는 if문을 예로 들겠습니다.

let hello = "hello"

if (hello === "hello"){
	console.log("hello")
}
if (조건식){
	명령문

if문은 위와같이 조건식명령문으로 나뉘게 되는데 조건식이 참(true)일 경우 명령문이 작동이 됩니다.

즉 위와 같이 조건식일 경우

콘솔창에 hello 라고 나오게 됩니다.

반대로 거짓일 경우에는 if문은 동작을 하지 않겠죠?

2. null

null은 일반적으로는 존재 하지 않거나 유효하지 않는 객체 또는 주소를 의도적으로 가리키는 참조를 나타냅니다.

console.log(typeof null === 'object')

3. undefined

undefined는 값이 정해 지지 않는 속성이라고 보시면 됩니다.

처음에 제가 선언한 변수 a 입니다.

a는 값으로 아무것도 없으므로 해당변수는 undefined라고 보시면 되겠습니다

var a

console.log(a)

4. number

number는 숫자를 의미하는 원시 데이터 타입 입니다.

예를 들면 12345, 3.14 , NaN 이 number라고 볼수있습니다

여기서 12345와 3.14는 이해가 가는데 NaN이 왜 number인지 모르실수있습니다

NaN은 줄임말로 "Not a Number"(숫자가 아님)을 나타내는 특별한 값. 을 의미 합니다.

5. string

string은 문자를 의미하는 원시 데이터 타입 입니다.

예를 들자면 “hello” , “안녕" 등이 있습니다.

6. symbol

symboles6에 들어와서 생긴 원시 데이터 타입으로 다른값과 중복되지 않는
고유한 값이라는 특징을 가집니다.

7. object

object는 원시 데이터 타입의 한 종류로써 자바스크립트의 거의 모든 객체는
object인스턴스로 되어 있다고 보시면 될것 같습니다

요점 정리

6가지 원시 데이터형

  • boolean (true, false)
  • null(유효하지않음)
  • undefined (정의되지않음)
  • number (12345, 3.14, NaN)
  • string(”hello”, “안녕하세요")
  • symbol(다른값과 중복되지 않는 고유한값)
  • object ( { name: “홍길동" } )

3. 주석

주석을 사용하게 되면 해당 부분은 공백으로 처리가 됩니다.

주석을 사용하는 이유는 작성한 해당 코드의 주의사항이나 필기 기타등의 이유로 사용합니다.

사용 방법

// 이 줄은 주석처리가 됩니다 let a = 123
const num1 = 456

/* 슬래쉬 부분만 주석 처리가 됩니다.*/ const num2 = 789

/* 
여러줄은 이런식으로 주석처리 하셔도 됩니다.
주석처리가 된 부분은 공백으로 처리가 됩니다.
*/

console.log("Hello " /* insert the value of x */ + " !")// Hello !
//이런식으로 쓰면 Hello !로 콘솔창에 뜨게 됩니다.

4. console.log( )

console.log( )는 주로 웹 콘솔창에서 메세지를 띄우기 위해서 사용합니다.

문자형숫자형은 나중에 배울테지만 이렇게 작동을 한다는것을 알고만 있으시면 됩니다.

const SayHello = "안녕하세요"
const num1 = 10
const num2 = 20

console.log("안녕하세요")//안녕하세요
console.log(SayHello)//안녕하세요
//이런식으로 변수를 넣어서 출력도 가능합니다

console.log(10 + 10) // 20
console.log(num1 + num2)//30
//숫자 연산도 가능합니다

console.log(SayHello + " %s" ,"홍길동")// 안녕하세요 홍길동.
//이런식으로 %s를 사용하여 문자열 뒤의 문자열을 가져올수있습니다.

console.log(SayHello + " %s. 당신의 나이는 %d 입니까?" , "홍길동" , 27)
/*
Hello 홍길동. 당신의 나이는 27 입니까?
%d 를 사용하게 되면 문자열 뒤의 숫자형을 가져올수있습니다.
*/

console.log( ) 는 생각보다 많이 유용 합니다.

테스트를 하거나 간단하게 콘솔로 띄워볼때 상당히 자주 사용하니 알아두면 좋습니다.

예전에 만들어둔건데 사진이 안보이네요 보고 싶으면 pdf 첨부 합니다.

좋은 웹페이지 즐겨찾기