안녕하세요, 수염난아이티 입니다.

이번 페이지에서는 javascript의 push() 함수에 대해서 알아보겠습니다.

-. push() 함수란?
push() 함수는 javascript 안의 특정 배열 마지막에 값을 넣는 함수 입니다.

예를 들어 아래와 같이 color 라는 배열이 있다고 가정해봅니다.

let color = [ "red", "blue", "white" ]

이 color 배열 맨 뒤에 "black" 이란 값을 추가하고 싶을 때

아래와 같이 push()함수 명령어를 입력하면 됩니다.

let color = [ "red", "blue", "white" ]

color.push("white");

console.log(color) // 출력값 : "red", "blue", "white", "black"

push() 함수는 하나의 값 이상도 가능합니다.

let color = [ "red", "blue", "white" ]

color.push("white");

console.log(color) // 출력값 : "red", "blue", "white", "black"

color.push("gray", "gold")

console.log(color) // 출력값 : "red", "blue", "white", "black", "gray", "gold"

안녕하세요, 수염난아이티 입니다.

이번 페이지에서는 javascript 매개변수 명령어인 let과 var의 차이점에 대해서 알아보겠습니다.

우선 개발시점으로 보자면

var가 먼저 나오고

let이 나중에 나왔습니다. (2015년 쯤, javascript가 ES6로 업그레이드 될 때, 나왔을 겁니다.)

당시, var 보다는 let사용을 권장했었죠.

1. 중복선언 가능

-. var : 중복선언 가능

-. let : 중복선언 불가능

위의 내용을 아래의 코딩 예시로 들어보겠습니다.

// var 중복선언 가능 예시

var a = 1
console.log(a) // 결과값 : 1

var a = 10
console.log(a) // 결과값 : 10

var a = 20
console.log(a) // 결과값 : 20

var로 선언한 변수가 또 중복 선언되는 경우 최신 값이 저장되는 것을 볼 수 있습니다.

하지만 let의 경우는 다릅니다.

아래를 보시면 변수가 중복된 경우 맨 아래의 console.log(a) 가 에러가 발생합니다.

// let 중복선언 불가능 예시

let a = 1
console.log(a) // 결과값 : 1

let a = 10
console.log(a) // 결과값 : SyntaxError : 'a' has already been declared

2. 스코프 범위

-. var : 함수 단위 스코프

-. let : 블록 단위 스코프

var로 선언한 변수는 함수 내부에서 유효합니다. 하지만 블록(if, for 등) 내부에서는 무시됩니다.

아래의 예시를 보겠습니다.

function test() {
	if (true) {
    	var a = 10;
    		console.log(a); // 결과값 : 10
	}
	console.log(a); // 결과값 : 10  <-- 이 부분이 var와 let의 차이 입니다.
}

test() // 결과값 : 10
console.log(a) // 결과값 : 에러발생

let으로 선언한 변수는 함수 외부에서 유효하지 않습니다.

아래의 예시를 보겠습니다.

function.test() {
	if (true) {
    	var a = 10;
    		console.log(a) // 결과값 : 10
    }
    console.log(a); // 결과값 : 에러발생 <-- 이 부분이 var와 let의 차이 입니다.
}

console.log(a); // 결과값 : 에러발생

3. 호이스팅 (Hoisting)

추가로 호이스팅의 개념에 대해서 알면 좋습니다.

호이스팅이란 함수 내부에 있는 선언들을 모두 끌어올려 해당 함수 유효 범위의 최상단에 선언하는 하는 것을 뜻합니다.

-. var : 호이스팅 발생함

-. let : 호이스팅 발생하지만, 다른 방식으로 작동됨

// var 변수 호이스팅

console.log(a); // undefined

var a = 5;
console.log(a); // 5

/*
foo(); // foo

function foo() {
	console.log("foo");
}

// let 변수 호이스팅

console.log(a); // ReferenceError: a is not defined

let a = 5;
console.log(a); // 5

/* 함수 호이스팅 */
foo(); // error

var foo = function() {
	console.log("foo");
}

안녕하세요, 수염난아이티 입니다.

최근 javascript 를 배워보기 시작했습니다.

console.log 라는 명령어를 처음 접했는데 너무 생소했기에,

이번 페이지에서는 console.log 명령어에 대해서 알아보겠습니다.

1. console.log()란 무엇인가?

우선 저는 이해하기 쉽게 python의 print랑 비슷한 개념으로 저는 받아들였습니다만,

사전적? 정의는 아래와 같습니다.

•  console.log()는 괄호안의 메세지를 콘솔창에 출력하는 명령어다.
• 가장 대표적인 디버깅 방법으로 쉽게 말해, javascript가 출력을 하도록 도와주는 기능이다.
• 콘솔창 내에는 문자, 숫자, true 등 여러 값을 넣을 수 있다

2. console.log()의 예시

let 변수 선언 함수로 color 에 "black"을 선언해준 뒤, console 값을 확인해봤다.

참고로 위 프로그램은 웹기반 프로그램이며 replit 이란 싸이트 이다.

무료로 여러가지 코딩 실습이 가능하고 또한, 별도의 프로그램 설치 없이 바로 코딩을 해볼 수 있는 장점이 있다.

읽어주셔서 감사합니다.

안녕하세요, 수염난아이티 입니다.

이번 페이지에서는 JWT에 대해서 알아보겠습니다.

목차

1. JWT란 무엇인가?

2. JWT의 구조

3. JWT의 장점과 단점

4. 공개키와 개인키는 무엇인가?

1. JWT란 무엇인가?

 JWT는 JSON Web Token의 약자로 당사자 간에 정보를 JSON 개체로 안전하게 전송하기 위한 간결하고 독립적인 방법을 정의하는 개방향 표준(RFC7519)입니다. 이 정보는 디지털 서명이 되어 있으므로 확인하고 신뢰할 수 있습니다.

JWT는 비밀(HMAC알고리즘 사용) 또는 RSA 또는 ECDSA를 사용하는 공개/개인키 쌍을 이용하여 서명할 수 있습니다.

JWT를 암호화하여 무결성을 증명하고 정보 등을 암호화하여 다른 사용자들로부터 보호하는 역할을 합니다.

2. JWT의 구조

JWT의 구성요소는 아래와 같습니다.

• Header
• Payload
• Signature

각 구성요소는 (.)으로 구분되어 있는 형태를 아래와 같이 취하고 있습니다.

 Base64 인코딩의 경우 “+”, “/”, “=”이 포함되지만 JWT는 URI에서 파라미터로 사용할 수 있도록 URL-Safe 한  Base64url 인코딩을 사용합니다.

Header는 토큰의 타입과 해시 암호화 알고리즘으로 구성되어 있습니다. 첫째는 토큰의 유형 (JWT)을 나타내고, 두 번째는 HMAC, SHA256 또는 RSA와 같은 해시 알고리즘을 나타내는 부분입니다.

Payload는 토큰에 담을 클레임(claim) 정보를 포함하고 있습니다. Payload 에 담는 정보의 한 ‘조각’ 을 클레임이라고 부르고, 이는 name / value 의 한 쌍으로 이뤄져있습니다. 토큰에는 여러개의 클레임 들을 넣을 수 있습니다.

클레임의 정보는 등록된 (registered) 클레임, 공개 (public) 클레임, 비공개 (private) 클레임으로 세 종류가 있습니다.

마지막으로 Signature는 secret key를 포함하여 암호화되어 있습니다.

3. JWT의 장점과 단점

장점

• URL 파라미터와 헤더로 사용
• 수평 스케일이 용이
• 디버깅 및 관리가 용이
• 트래픽 대한 부담이 낮음
• REST 서비스로 제공 가능
• 내장된 마료
• 독립적인 JWT

단점

• 토큰은 클라이언트에 저장되어 데이터베이스에서 사용자 정보를 조작하더라도 토큰에 직접 적용할 수 없습니다.
• 더 많은 필드가 추가되면 토큰이 커질 수 있습니다.
• 비상태 애플리케이션에서 토큰은 거의 모든 요청에 대해 전송되므로 데이터 트래픽 크기에 영향을 미칠 수 있습니다.

4. 공개키와 개인키는 무엇인가

-. 공개키(Public Key) 란?

공개키는 암호화에 사용되며, 누구나 이를 이용하여 데이터를 암호화할 수 있습니다.

공개키는 외부에 공개되어 있으며 정보를 안전하게 전송하기 위해 사용됩니다.

-. 개인키(Private Key)란?

개인키는 복호화에 사용되며, 키 소유자만이 이를 알고 있습니다.

개인키는 안전하게 보관되어야 하며 이를 통해 암호화된 데이터를 복호하 할 수 있습니다.

위 그림에서 사용자 A와 B는 각각 개인키와 공개키를 갖고 있습니다.

사용자 A가 B에게 암호화 된 데이터를 보낸다고 가정하면 순서는 아래와 같습니다.

1) A가 B의 공개키로 암호화 합니다. (공개키는 공개되어 있으니 어떤 사용자도 암호화에 사용할 수 있습니다.)

2) A가 B의 공개키로 암호화 한 파일을 A의 개인키로 또 암호화 합니다.

3) 이렇게 암호화된 데이터를 B에게 전송합니다.

4) B가 수신한 데이터를 A의 공개키로 복호화 합니다.

5) B가 A의 공개키로 복호한 파일을 B의 개인키로 다시 복호화 합니다.