본문 바로가기
웹 프로그래밍(풀스택-->python)

12. Javascript 기초 문법 배우기(1)

by 백엔드개발자0107 2021. 4. 2.

내 생각:

처음에 배워볼거는 값을 담는 변수 let에 대해 배워볼것이다.


let

let구문은 블록 유효 범위를 갖는 지역 변수를 선언하며, 선언과 동시에 임의의 값으로 초기화할 수도 있다.

Syntax

let var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]];

Parameters

var1,var2, …,varN변수명. 유효한 식별자이면 가능하다.value1,value2, …,valueN변수의 초기값. 유효한 표현식이면 가능하다.

Description

let은 변수가 선언된 블록, 구문 또는 표현식 내에서만 유효한 변수를 선언한다. 이는 var 키워드가 블록 범위를 무시하고 전역 변수나 함수 지역 변수로 선언되는 것과 다른 점이다.

"let"을 사용해야 하는 이유에 대해서는 이어지는링크를 참조하시오.

유효 범위 규칙

let으로 선언된 변수는 변수가 선언된 블록 내에서만 유효하며, 당연하지만 하위 블록에서도 유효하다. 이러한 점에서는letvar는 유사하지만,var는 함수 블록 이외의 블록은 무시하고 선언된다는 점이 다르다.

function varTest() { var x = 1; if (true) { var x = 2; // 상위 블록과 같은 변수! console.log(x); // 2 } console.log(x); // 2 } function letTest() { let x = 1; if (true) { let x = 2; // 상위 블록과 다른 변수 console.log(x); // 2 } console.log(x); // 1 }

프로그램이나 함수의 최상위에서는letvar은 서로 다르게 행동한다.let은 전역 객체의 속성 값을 생성하지 않는다.

var x = 'global'; let y = 'global'; console.log(this.x); // "global" 전역 객체의 속성 x를 생성 console.log(this.y); // undefined 전역 객체의 속성 y를 생성하지 않음

 

출처: developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/let

 

let - JavaScript | MDN

let let 구문은 블록 유효 범위를 갖는 지역 변수를 선언하며, 선언과 동시에 임의의 값으로 초기화할 수도 있다. The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the

developer.mozilla.org


위 글에서처럼, let 은 변수를 담는 하나의 그릇이다. 하지만 이 그릇은 var라는 비슷한 기능을 가진 식별자와 다르다.

 

어떤 부분이 다르냐 하면 바로 유효범위가 다르다.

 

let은 변수가 선언된 블록, 구문 또는 표현식 내에서만 유효한 변수를 선언한다. 이는 var 키워드가 블록 범위를 무시하고 전역 변수나 함수 지역 변수로 선언되는 것과 다른 점이다.

 

이 문장을 주의깊게 봐보자, 앞서 보듯이, var은 블록범위를 무시하고 전역변수 혹은 함수 지역변수등 어디서든 쓰일수 있지만, let변수는 특정 범위 에서만 사용된다고 생각하면 될꺼 같다.

 

팁: 변수이름을 지을떄는 당연한거지만 남이 알아보기 쉬운 변수이름을 짓는게 편하다.

 

 

이번에는 자료형에 대해 공부해 볼것이다.

 

그중 리스트자료형은 순서가 중요한 담기라고 생각하면 쉽다. 

 

let a_list = ["수박","참외","배"]

이런식으로 작성하면 된다. 이때 리스트자료형은 꺽쇠를 이용한다. 

a_list.push("감")

이러면 a_list[3]에 "감" 리스트가 추가된다.

let a_dict = {"name":"bob","age":27}

이거는 딕셔너리라는 문법이고 key:value라고 이야기한다.

 

여기서 순서는 중요하지 않다.!

 

그렇다면 딕셔너리에 값을 추가하기 위해서는 어떻게 할까?

a_dict["height"] = 180
180
a_dict
{name: "bob", age: 27, height: 180}

이런식으로 작성하면 문법이 초기화가 되면서 추가된다.

 

하나 더 추가로 공부해보자>!

 

a_dict["fruits"] = a_list
(4) ["수박", "참외", "배", "감"]
0: "수박"
1: "참외"
2: "배"
3: "감"
length: 4
__proto__: Array(0)
a_dict
{name: "bob", age: 27, height: 180, fruits: Array(4)}
age: 27
fruits: (4) ["수박", "참외", "배", "감"]
height: 180
name: "bob"
__proto__: Object

자 이것을 보면 딕셔너리 안에 리스트를 추가 시킬수 있다라는 것을 알수 있다.

 

a_dict["fruits"][2]
"배"

딕셔너리 안의 리스트형식의 코드에 접근할떄는 이런식으로 접근한다.

 

자, 인제 기본함수들에 대해서 공부해보자!

 

나머지 값 구하는 방법은

 

let a = 100
undefined
a % 8
4
a % 3
1

 

이런식으로 하면 된다. 

 

이 나머지는 언제 구할까?

 

아마 짝수, 홀수값 구하고자 할때 구하면 될 것이다.!

 

재밋는거 또 하나만 해보자

 

바로 split() 함수이다.

 

myemail.split("@")
(2) ["sparta", "gmail.com"]
myemail.split("@")[1]
"gmail.com"
myemail.split("@")[1].split(".")
(2) ["gmail", "com"]
myemail.split("@")[1].split(".")[0]
"gmail"

split() 함수는 괄호안의 문자를 기준으로 두개로 쪼개어주는 역할을 한다.!