본문 바로가기

Programming language/JavaScript

JavaScript - 2 [변수선언, String, float, int, Array]

변수명 작성법

- 시작하기에 앞서 javaScript 의 변수명 작성은 CamelCase로 작성한다.

 

 

CamelCase

: daysOfWeek 와 같이 끊어서 표현할 변수이름을 대문자로 표기하는 방식이다.

 

snake_case

: days_of_week와 같이 밑줄을 섞어서 표현할 변수이름을 표기하는 방식이다.

 

Variable

- 자바 스크립트에서 변수는 파이썬과 상당히 비슷한 선언이다.

- 자료형 선언도 없고 접근제어자도 없는것 같다.

a = 17;
b = a - 12;

console.log(b);

 

 

- 자바스크립트는 실행할 수 있으면 다 실행한다. 별로 좋지 않은 코드라도 말이다.

위코드는 변수의 선언을 이야기하지 않았음에도 돌아갔다.

 

let 

- 변수의 선언은 let 키워드를 붙여 선언한다.

- 사실 var이란 키워드도 있는데 3년전에 썼던 변수 선언이다. 새로나온 키워드는 let인데 뭐가 다른지는 배워보자

let a = 17;
let b = a - 12;

console.log(b);

const

상수의 선언은 const 키워드를 붙여 선언한다.

- 이후에 해당 상수를 바꾸려는 시도가 있다면 에러가 난다.

const a = 17;
let b = a - 12;
a = 9;
console.log(b, a);

주석처리

- 파이썬, 자바, 자바스크립트 비슷하다. "//" 처리를 하면된다.

// 주석처리//
//const a = 17;
let b = a - 12;
a = 9;
console.log(b, a);

- 여러줄 주석처리를 할때는 /* */ 처리를 하면 된다.

// 주석처리//
/* 여러줄 주석
const a = 17;
let b = a - 12;
a = 9;*/
console.log(b, a);

 

String

- string 변수를 저장할 때도 자료형 선언없이 그냥 변수에 저장하면된다.\

- 참고로 이모지도 텍스트라서 console.log에 출력된다. 적용되지 않는 이모지도 물론 있다.

let name = "Doodream"
console.log(name);

 

Boolean

- boolean 변수를 저장할 떄는 true, false로 저장한다.

let a = true;
let b = false;
console.log(a, b);

Float

- 소수점도 그냥 변수를 선언하고 소수점을 넣으면 된다.

let a = 51.5;
console.log(a);

 

Arrays

- 배열을 표기할 때는 []을 표현한다.

- JS는 모든 것이 객체로 구성되어있어서 속성과 함수를 가져올때 다르다.

함수를 가져올때에는 마침표로 가지고 오지만, 속성을 가져올때는 []로 가져온다.

let arr = [1, 2, 3, 4, 5];
console.log(arr);

 

 

매우 충격적이게도 배열안에 어떤 변수이든 다 넣을 수 있으며 심지어 배열안에 다른 변수를 넣어도 된다....

what the fu...?

물론 인덱스 선언시 길이 선언이 먼저 가능하다.

 

let arr = [1, 2, 3, 4, 5, "String", 0.11111, 'a', [24]];
let arr2 = [arr, 2, 3];
console.log(arr);
console.log(arr[2]);
console.log(arr2);

더 대박인 것은 가변길이이다.

게다가 아직 정의 되지 않은 길이에 변수를 넣어도 자동으로 push되어서 그냥 돌아간다;

push가 된다면?

 

하.. 다된다. 

splice, pop, push, sort, toString... 너무 편하게 된다.

 

코드가 엄청나게 짧아지고 보기편하다. 행복하다..

let arr = [];
arr.push("a");
arr.push(2);
arr.push(55.555);
arr[3] = 2;
console.log(arr);

자료형이 섞일 때는 sorting 이 된다.

그리고 요소를 지울때 앞뒤로 전부 추가 하고 지우는게 가능하다.

 

let arr = [];
arr.push("a");
arr.push(2);
arr.push(55.555);
arr[3] = 2;
console.log(arr);
// 배열 소팅
arr.sort();

// 배열 맨 앞 값을 추가하기
arr.unshift("unshift")
// 배열 맨 앞에 값을 제거하기
arr.shift();

// 배열 맨뒤에 값을 추가하기
arr.push("push");

// 배열 맨뒤에 값을 제거하기
arr.pop();
console.log(arr);

인덱스 위치에서부터 여러개의 항목을 제거 할수도 있다.

와.. 이걸보고 나서 한달동안 우테코 공부할때 java말고 js 공부했으면 합격했겠다라는 생각을 했다.

 

let arr = [1, 2, 3, 4, 5];
// 인덱스 0부터 2개 원소를 제거한다. 1, 2가 제거되겠다.
arr.splice(0, 2);
console.log(arr);

미친, 너무 사기다. 배열에서 인덱스를 지정해놓고 거기서 몇개나 제거할래? 이지랄 떨고 있다. -1개도 가능?

응, 안돼;; 이건 좀 심했던 것 같다.

 

대신에 splice(2,4)를 넣으면 인덱스 2부터 4개까지면 총 6개의 배열길이가 필요하기에

배열에 인덱스 범위에러가 날줄 알았는데 안난다;

이거;; 에러 나야하는 거 아니냐고;;

 

let arr = [1, 2, 3, 4, 5];
// 인덱스 2부터 3개 원소를 제거한다. 3, 4, 5가 제거되겠다.
arr.splice(2, 3);
console.log(arr);

// 배열의 깊은 복사
let arr1= arr.slice();
console.log(arr1);

배열의 깊은 복사는 arr.slice() 함수로 구현이 가능하다.

다른 함수들은 차차 이 링크를 통해 알아보도록 하자

 

developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array

 

Array

JavaScript Array 전역 객체는 배열을 생성할 때 사용하는 리스트 형태의 고수준 객체입니다.

developer.mozilla.org

역시 자스.. mdn까지 있다니 공부하기 너무나 쉽고 편안하다.

 

TypeConversion (형변환)

- 굉장히 쉽다.

 

String(), Number(), Boolean()

- 각각 내부 함수로서 어떤 타입의 자료형을 각 형태로 바꿔주는 형 변환 함수이다.

const a = () => {
	conosole.log(wow);
}

console.log(typeof String(1));
// string
conosole.log(String(a));
/* () => {
	conosole.log(wow);
}*/

console.log(typeof Number("123"));
// number

console.log(typeof Number(a));
// number

console.log(Number(a));
// NaN (not a number)
// 숫자로 출력되지 않는 적합하지 못한 인풋을 넣었다는 뜻으로 NaN을 반환

console.log(Boolean(a));
// true  : Boolean() 함수 안에 비어있다면 false, 무엇이든 있다면 true;

console.log(Boolean());
// false