JavaScript 기초 - 1(변수, 타입)

seo-B·2021년 7월 20일
0

TIL

목록 보기
1/4

변수(variable)


변수는 각 데이터 보관함의 이름을 일컫는다. 이 변수를 통해 보관함에 있는 데이터를 사용할 수 있다.

Achievement Goals

  • 프로그래밍은 데이터 처리를 하는 것임을 이해한다.
  • 변수 사용은 데이터를 편리하게 저장하고 꺼내 쓰는 것임을 이해한다.
  • 변수의 선언과 값의 할당에 대해서 설명하고 코드로 작성할 수 있다.
  • 값으로 변환된 표현문이 변수에 할당되어 담기는 과정을 설명할 수 있어야 한다.
  • 자바스크립트에서 변수의 선언과 값의 할당에 대해서 설명할 수 있다.
  • 변수 선언과 값 할당에 사용되는 용어에 대해서 정확하게 알 수 있다.
  • =가 "같다"라는 의미가 아니라 할당연산자임을 이해할 수 있다.
  • num = num + 1이 "같다"라는 의미가 아니라 값을 할당하는 것임을 설명할 수 있다.

선언(declaration)

선언이란 보관함을 확보 즉 저장공간을 확보하는 것을 의미한다.

  • let, const, var 3가지의 방법이 있다.
1. let userName; // let은 재선언 x 재할당 o 

2. const myBirthday; // const는 재선언 x 재할당 x  

3. var message; / var는 재선언 o 재할당 o 
  • 반드시 영문자, 숫자, 그리고 _만 사용하여야 한다.
    • let Anything1234; (O) / let 조영현; (X)
  • 첫글자는 숫자로 시작할 수 없다.
    • let 1234Anything; (X)
  • 여러 단어를 연결할 변수 이름은 중간에 대문자를 섞어서 명명한다.**
    • let getAnything; (O)
  • 미리 예약된 키워드를 사용할 수 없다.
    • let const; (X) : const는 상수를 선언하는 키워드이므로 사용할 수 없다.
  • 대소문자를 구분하여 작성하여야 한다.
    • let Anything ≠ let anything
  • 변수의 이름은 변수의 용도와 의미에 부합해야 한다.
    • let age; : 나이를 담는 변수임을 암시
  • 한번에 여러 변수를 선언하는 것도 가능하다
let userName = 'Tom', age = 20, message = 'Hello'; // A타입 한줄에 여러 변수를 작성.
let userName = 'Tom', 
    age = 20, 
    message = 'Hello'; // B타입 한줄에 하나의 변수를 작성.

A타입과 B타입은 서로 기술적인 차이가 있지 않으며, A타입이 다소 짧지만 가독성을 위해 B타입을 권장한다.

할당(assignment)

등호기호 " = " 는 할당연산자로 "같다" 라는 뜻이 아닌 데이터를 저장한다는 의미로 사용된다.

userName = 'Tom';

선언과 할당을 같이 사용하면 아래와 같이 작성할 수 있다.

let userName = 'Tom';

변수는 상황에 따라 변할 수 있는 값으로 동일한 변수를 이용해 대입도 가능하며 결과를 다시 변수로 둘 수 있다. 할당이 없다면 undefinded(정의되지 않은) 값이 된다.
let sum = 1;
sum = sum + 2;
sum = sum + 3; // 동일한 변수를 이용해 대입할 수 있다.
let sadius = 5;
pi * radius * radius; // 반지름이 5인 원의 넓이

let areaOfCircle = pi * radius * radius; // 결과물을 다시 변수로 담을 수 있다.

- 문제 -

임의의 값을 입력받아 수(number)의 형태로 리턴해야 합니다.

입출력 예시

let output = convertToNumber('123');
console.log(output); // --> 123

let output2 = convertToNumber('hello');
console.log(output2); // --> NaN

let output3 = convertToNumber('3.141952');
console.log(output3); // --> 3.141952

코드 작성

function convertToNumber(anything) {
  let anything = Number(anything);
    return anything;
}

매개변수(parameter) anything을 Number() 함수를 이용해 숫자로 결과 값을 받는 코드를 작성했다.

하지만 문법 오류 즉 매개변수 anything이 중복 선언이 되었다고 나왔다.

function convertToNumber(anything) {
 let result = Number(anything);
    return result;
} // 이처럼 result를 새로 선언을 하여 값으로 할당을 해주어도 되지만
function convertToNumber(anything) {
  return Number(anything);
} //매개변수가 하나이기에 새로 선언을 해주지 않고 바로 'Number()' 함수 값을 받는 코드로 작성을 해주니 훨씬 간편하고 직관적인 코드라 더 낫다고 생각한다.

타입


Achievement Goals

  • 자바스크립트에서 원시 자료형과 참조 자료형이 무엇인지 알 수 있다.
  • 원시 자료형 string, number, boolean, undefined의 의미를 이해할 수 있다.
  • 타입마다 다른 속성과 메소드가 있다는 것을 이해할 수 있다.
  • typeof 를 활용하여 특정 값의 타입을 확인할 수 있다.
  • 비교 시 엄밀한 비교( === 과 !== )의 필요성을 이해할 수 있다.

숫자형(number type)

let n = 123;

문자형(string)

  1. let str = "Hello"; // 큰따옴표, Hello
  2. let str2 = 'Hello'; // 작은따옴표, Hello
  3. let name = "Tom";
    console.log(`${str}, ${name}!`); // 역 따옴표(백틱) Hello, Tom!
  • 큰따옴표와 작은따옴표는 ‘기본적인’ 따옴표로, 자바스크립트에서는 이 둘에 차이를 두지 않는다.
  • 역 따옴표로 변수나 표현식을 감싼 후 ${ } 안에 넣어주면 원하는 변수나 표현식을 문자열 중간에 넣을 수 있다.

불리언(Boolean)

불리언은 논리타입으로 긍정을 의미하는 true와 부정을 의미하는 false 두가지 값 밖에 없다.

undefined

undefined는 '값이 할당되지 않은 상태’를 나타낼 때 사용하며,

변수는 선언했지만 값을 할당하지 않았다면 해당 변수에 undefined가 자동으로 할당된다.

undefined 또한 데이터형인 동시에 값인 것으로 볼 수 있다.

null

JavaScript에선 null을 변수에 할당이 이루어졌지만 ‘존재하지 않는 (nothing) ’ 값 , ‘비어 있는(empty)’ 값 , ‘알 수 없는(unknown)’ 값 을 나타내는 데 사용한다.

let age = null; // 값이 없음을 명하시하는 경우 null 또한 데이터형인 동시에 값이라고 할 수 있다.

typeof

typeof 연산자는 두가지 형태의 문법을 지원하며 변수를 호출하면 인수의 자료형을 반환한다.

typeof undefined // "undefined"

typeof 0 // "number"

typeof true // "boolean"

typeof "foo" // "string"

typeof Math // "object"  

typeof null // "object"  
profile
como una abeja! 오늘보다 one more thing!

0개의 댓글