본문 바로가기

전체 글235

HTTP 메소드의 멱등성 이전 포스팅에서 안전한 HTTP 메소드에 관해 포스팅하며, "멱등성"에 대해 언급했다. 도대체 멱등성이란 무었일까? 사실 별로 알고 싶진 않다... 멱등성의 사전적 의미 연산을 여러 번 적용하더라도 결괏값이 달라지지 않는 성질 영어로는 Idempotent라고 한다. 필자는 사실 대학을 미국에서 나왔는데, 어떻게 읽는지도 몰라 네이버 사전 음성 버튼을 여러번 눌렀다. 아이뎀포턴트라고 한단다... 단어는 어려운데 막상 뜻을 알고나면 이해는 쉽다. 이전 포스팅에서 멱등성을 가지는 메서드로는 아래와 같다고 했다. PUT DELETE 안전한 메소드들 즉, 해당 메소드들은 아무리 반복해서 요청을 서버에 보내더라도 결과는 맨 처음 요청과 달라지지 않는다는 것이다. 멱등성이 필요한 이유 그렇다면 멱등성이 왜 필요한 것.. 2021. 11. 18.
HTTP 요청 메서드 어느날 유튭에서 누가 그랬던것 같다. 진짜 뛰어난 웹 개발자는 코딩이 뛰어나기보다 네트워크에 대한 이해도가 높은사람이라고. 오늘은 HTTP에 대한 공부를 해보았는데, 역시 만만치가 않다. 영어 원서가 주를 이루다 보니 시간이 꽤 걸린듯 하다. 학생 때 영어공부 많이 해두길 다행이다... HTTP 요청 메서드 HTTP 공식 자료에 따른 정의는 아래와 같다. The request method token is the primary source of request semantics; it indicates the purpose for which the client has made this request and what is expected by the client as a successful result. 요청.. 2021. 11. 18.
JS JSON 오늘 코딩을 하면서 자꾸 오류가 발생하고, 테스트 코드를 통과하지 못해 너무너무너무 화가 끝까지 차올랐다가 JSON값을 객체로 변환하지 않고 사용했음을 알고 조울증 환자처럼 갑자기 너무 기뻐서 치킨을 시켰다. 오늘은 JSON에 대해 알아보자. JSON 기본 개념 JSON의 기본적인 개념은 사실 인터넷에 잘 나와있다. JSON은 일종의 컴퓨터 세계관의 English와 같은 표기법이다. 컴퓨터와 컴퓨터끼리 사용하는 언어가 다르면 데이터를 주고받을 때 의사소통에 문제가 발생하게 되는데, 이를 공통적인 규칙을 만들어 공유함으로서 그 문제를 해결하고 있다. 이전에는 XML이라는 마크업 랭귀지를 사용했지만 요즘은 JSON이 일반적으로 사용되고 있다. JSON의 또 다른 특징은 자바스크립트의 Object와 생김새가 .. 2021. 11. 16.
JS 약식 분기문에 의한 값 할당 방법 let _start = start || 0 오늘 연습문제를 보다가 이런 요상한 선언 & 할당문을 보게 되었다. 도대체 요녀석은 어떻게 이해를 하면 좋을까? 위와 같은 방식의 할당문을 약식 분기문에 의한 값 할당법이라고 부른다. 위와 같은 방식에는 || 혹은 && 오퍼레이터를 이용하는데, 이는 값이 truthy 한지 falsy 한지를 판별해 변수에 의도하는 값을 할당하기 위함이다. 예제를 통해 알아보자. let _start = start || 0 만약 start의 값이 falsy한 값이라면 _start에는 start의 값이 들어가게 된다. 이때 falsy 한 값임에 유의해야 한다. 즉 start가 false / 0 / '' 등의 값을 가진다면, false로 인정하고 || 등호 뒷편의 0이 _start에 할.. 2021. 11. 16.
JS Operator "!!" & "^=" 오늘 코플릿 문제를 풀다가 요상한 연산자를 발견하였다. !! ^= 바로 알아보도록 하자. Not Not 연산자 (!!) Not연산자는 흔히 사용하는데 도대체 Not Not은 뭐지? 스택오버플로우에 따르면 Not Not 연산자는 아래와 같다. Converts Object to boolean. If it was falsey (e.g. 0, null, undefined, etc.), it will be false, otherwise, true. Not Not 연산자는 객체를 불리안 값으로 전환할 때 사용한다고 한다. 즉 Falsey한 null이나 0 등에 not not을 붙이면 False가 반환되는 것이다! !oObject // inverted boolean !!oObject // non inverted bo.. 2021. 11. 12.
JS Linked-list & Hash table 오늘은 자료형의 두 가지 유형 Linked-list와 Hash table에 대해 알아보자 Linked-list In computer science, a linked list is a linear collection of data elements whose order is not given by their physical placement in memory. Instead, each element points to the next. 위키피디아에서는 linked-list를 위와 같이 설명하고 있다. 해석하자면, 링크드 리스트는 데이터요소의 일련의 집합이며 메모리상 물리적 공간에서 물리적으로 순서가 정해져있지는 않다. 대신 각 요소들은 다음 데이터요소를 가르킨다. 무슨 말일까? 아래 그림을 보면 이해가 수월해.. 2021. 11. 11.
JS 매개변수 기본 값 설정하기 오늘 재귀함수 코드를 살펴보다가 이상한 표현을 발견했다. (가위바위보의 경우의 수를 계산하는 알고리즘이다.) const rockPaperScissors = (rounds) => { //if rounds is 0 we will return an empty array if(rounds === 0) return [] // define a throw options array for each play we could make // "R" represents "Rock", "P" represents "Paper", "S" represents "Scissors" const throwOptions = ["R", "P", "S"] // define a solutions array to hold all of our pos.. 2021. 11. 10.
JS Tail recursion 오늘은 재귀함수의 활용 방법중 하나인 Tail Recursion에 대해 알아보자 Tail Recursion Tail recursion is a type of recursive function when the last thing executed is a recursive call. Tail recursion은 사실 그렇게 큰 의미를 가지는 용어는 아니다. 단순히 꼬리부분에서 재귀함수가 호출되는 형태를 말한다. 연습문제를 풀 때 head tail로 나누어 푸는 방식이라고 보면 된다. 따라서 꼬리부분에서 재귀함수가 호출되어 계산값이 반복해서 중첩되는 경우라면 Tail Recursion을 사용한 케이스라고 볼 수 있다. 그렇다면 Tail Recursion의 장점은 무엇일까? This type requires f.. 2021. 11. 10.
JS Recursion memory leak 재귀함수를 연습하다 보면 가끔 이상한 코드를 작성해서 동작하면 스택을 초과했다는 경고메세지가 나오면서 작동이 중지되는 경험을 다들 한번씩은 해 보았을 것이다. 이것은 재귀함수를 실행하면서 재귀깊이(Recursion Depth)를 초과하는 상황이 발생했기 때문이다. 정확히는 Memory Leak가 발생하면서 execution context stack에 저장되는 중첩호출이 허용량을 넘겨버린 것이다. 오늘은 Memory Leak가 어떤것인지 한번 알아보자 Memory Leak A Memory leak can be defined as a piece of memory that is no longer being used or required by an application but for some reason is .. 2021. 11. 10.
JS this 바인딩 오늘은 Javascript의 객체 지향에 대해 공부 했다. 객체 지향을 공부하면서 본격적으로 'this'를 사용하기 시작했는데, 금일 설명중에 아래와 같은 설명이 있었다. 메소드 호출 방식을 이용할 때에는 화살표 함수를 쓰지 않습니다. 왜 메소드 호출 방식을 이용할 때에는 화살표 함수를 쓰지 않는 것일까? 이유는 바로 this의 바인딩 이슈 때문이다. This this에 대한 설명은 아래와 같다. Technically, JavaScript this refers to the object that the function belongs to. And the value of this depends on how the function is called, something known as runtime bindin.. 2021. 11. 8.
DOM EventTarget.addEventListener() React를 공부하다보니 점차 DOM 개념을 까먹게 되는 듯 하다. 오늘 DOM을 이용해 Click 이벤트 발생시 특정한 함수에 인자를 전달하도록 코드를 짜려 했는데, 굉장히 고생을 했다 ㅠㅠ 청년치매.. 오늘은 addEventListner를 다시한번 정리해보려 한다. Syntax target.addEventListener(type, listener); type은 "click"등과 같이 이벤트를 리슨할 이벤트 타입을 넣는 파라미터다. 아래 링크에 어떤 타입들이 있는지 잘 정리 되어 있다. https://developer.mozilla.org/en-US/docs/Web/Events listener는 type 파라미터가 발생했을 때 작동할 객체(함수)를 넣는 파라미터다. 아래 예시를 보면 이해에 도움이 된다.. 2021. 11. 5.
JS Array.prototype.sort() 오늘 문제를 푸는 와중에 객체로 이루어진 배열을 크기에 따라 배열로 나열해야하는 작업이 필요했다. if 문을 남발하면 뭔가 될 것 같기도 했지만... 이제는 코딩을 시작한지도 좀 되었으니 더 깔끔한 방법이 있을까 찾아보니 Array.prototype.sort()라는 메소드가 있었다. 오늘은 sort메소드에 대해 알아보자. 사실 이전에 몇번 sort 메소드를 사용해 본적은 있었다. const months = ['March', 'Jan', 'Feb', 'Dec']; months.sort(); 위와 같이 배열을 sort하면 알아서 크기에 맞춰서 배열의 순서가 바뀐다. 객체로 이루어진 배열의 크기를 비교할 때는 sort안에 argument값을 아래와 같이 넣어주면 된다. var items = [ { name: .. 2021. 11. 5.

티스토리툴바