분류 전체보기 (269) 썸네일형 리스트형 [WEB] HTTP란? HTTP의 기본 개념 이해하기 HTTP(Hyper Text Transfer Protocol)란 클라이언트와 서버가 서로 데이터를 주고받기 위해 사용되는 통신 규약이다. 웹 문서 간에 링크를 통해 연결할 수 있는 프로토콜이며, 문서뿐 아니라 HTML이나 TEXT, 이미지, 음성, 영상, 파일, JSON, XML(API) 등 여러 종류의 데이터들을 폭 넓게 전송할 수 있다. 따라서 서버 간에 데이터를 주고받을 때 대부분 HTTP라는 프로토콜을 사용해 통신한다고 봐도 무방하다. 예를 들어 인터넷 주소를 지정할 때 http://www.naver.com와 같이 시작하는 것은 www.naver.com이라는 인터넷 주소가 가진 데이터 정보 등의 교환을 HTTP의 통신 규약대로 처리하라는 것을 의미한다고 볼 수 있다. cf) 인터넷 기반 서비스.. [Javascript] for ... in 자바스크립트에서 객체는 데이터를 구조화하고 저장하는 데 사용되는 중요한 요소다. 객체는 여러 가지 프로퍼티를 포함하며 각 프로퍼티는 특정한 정보나 기능을 나타낸다. 그러므로 객체의 프로퍼티를 순회하고 데이터를 추출하거나 조작하는 것은 프로그래밍에서 꽤 자주 이루어지는 작업이라고 할 수 있는데 이러한 일을 수행하기 위해 for ... in은 유용한 도구로 활용된다. for ... in의 기본 문법은 아래와 같다. 아래의 예에서 variable은 각 프로퍼티의 이름을 저장할 변수를, object는 순회할 객체를 의미한다. for (variable in object) { // 실행할 코드} for ... in을 사용하여 객체의 프로퍼티를 순회할 때, 각 회차마다 변수에는 해당 프로퍼티의 이름이 할당.. [Javascript] length 속성의 이해 자바스크립트에서 length 속성은 다음의 세 가지 용도로 사용된다. 1. 배열의 길이 반환2. 문자열의 길이 반환3. 유사 배열 객체의 길이 반환 1. 배열의 길이 반환 배열에서 length 속성은 배열에 포함된 요소의 개수를 반환한다.const fruits = ["apple", "orange", "banana"];console.log(fruits.length); // 3const emptyArr = [];console.log(emptyArr.length); // 0 한 가지 특징적인 점은 배열에서의 length 속성은 아래 예시와 같이 수정이 가능하다는 것이다. 2. 문자열의 길이 반환 문자열에서의 length 속성은 문자열에 포함된 문자의 개수를 반환한다.const greeting = ".. [Javascript] for ... of for ... of문은 iterable 객체를 순회하는 반복문이다. ECMAScript 2015(ES6)부터 도입된 자바스크립트의 반복문 중 하나로, DOM 컬렉션 객체의 각 요소를 반복하여 작업하는 데 용이한 방법을 제공한다. cf) DOM 컬렉션 객체인 HTMLCollection과 NodeList 모두 유사 배열 객체이면서 이터러블 객체다. for ... of문은 iterable 객체의 순회를 위해 고안된 것으로 이를 사용하기 위해서는 iterable 객체에 대한 이해가 필요하다. 이터러블 프로토콜 ES6 이전에는 순회 가능한 객체에 대해 통일된 규약이 없었다. 예를 들면 배열, 문자열, 유사 배열, DOM 컬렉션 등은 통일된 규약이 아닌 나름대로의 데이터 구조를 가지고 for문과 for ... in.. [Javascript] computed property 문법(객체의 key를 변수로 접근하기) 과거, 자바스크립트에서는 객체를 만들 때 정해진 문자열 이름의 속성명을 사용해 왔다. 하지만 ES6 이후로는 computed property를 사용하여 객체를 선언하는 순간 변수 또는 함수를 활용하여 동적인 프로퍼티명을 할당할 수 있게 되었다. 즉, computed property 문법은 자바스크립트 객체의 key 속성명을 표현식(변수, 함수 등)을 통해 지정하는 문법인 것이다. let kk = "id";let obj = { name : "super", [kk] : 123 // computed property}let mm = "rank";obj[mm] = '#1'; console.log(obj) // {name: "super", id: 123, rank: "#1"} 속성이 추가됨 변수를 .. [Javascript] 호이스팅(Hoisting)의 발생 원리 자바스크립트에서 호이스팅(Hoisting)이란 변수 또는 함수의 선언이 맨 위로 끌어올려지는 현상을 말한다. 그래서 개발자가 어느 라인 어느 위치에 코드를 선언하더라도 실행되기 전 해당 코드가 최상단으로 끌어올려지고 실행된다. 이러한 호이스팅이 발생하는 원인은 자바스크립트의 변수 생성(instantiation)과 초기화(initialization)의 작업이 분리되어 진행되기 때문이다. console.log(a()); // 'a'console.log(b()); // Uncaught TypeError: b is not a functionconsole.log(c()); // Uncaught TypeError: b is not a function function a() { return 'a';} var b.. [Javascript] Cookie 다루기 Cookie란?Cookie는 데이터이면서 우리가 현재 사용하는 PC에 작은 텍스트 파일로 저장되어 있는 것이다. 어떤 사이트에 접속했을 때 '일주일 동안 이 창 보지 않기'나 로그인 페이지에서 '아이디 저장' 또는 '자동 로그인' 같은 기능을 사용해 본 적이 있지 않은가? 사실 브라우저는 내용을 기억할 공간이 없는데, 이를 도와주는 것이 바로 쿠키이다. 쿠키에 대해 알아보기 전에 쿠키가 저장되는 방식은 key : value라는 점을 기억해 두자. 브라우저가 웹 페이지를 서버로부터 요청하게 되면 이 페이지에 속한 쿠키들이 추가로 요청된다. 이러한 방법을 통해 유저에 대한 정보를 기억하는 필수 데이터를 서버가 가져올 수 있는 것이다. Cookie vs Session쿠키는 사용자가 브라우저의 쿠키 데이터를 비.. [Javascript] 객체의 value 값으로 key 값 찾기 Object 함수와 배열 내장 함수를 적절히 조합하여 사용하면 생각보다 간단히 구현이 가능하다. function getKeyByValue(object, value){ return Object.keys(object).find(key => object[key] === value);} 우선 key만 따로 배열로 배열로 전환한 뒤(Object.keys()), 배열 내장 함수 find()를 통해 배열을 순회하여 object[key]의 값과 비교하려는 value의 값이 같으면 그 값을 반환시킨다. 참고https://inpa.tistory.com/entry/JS-%F0%9F%9A%80-value%EA%B0%92%EC%9C%BC%EB%A1%9C-key%EA%B0%92-%EC%B0%BE%EA%B8%B0 이전 1 2 3 4 5 6 7 ··· 34 다음