전체 글(312)
-
[WEB] 웹 표준(Web Standards)
웹 표준이란 웹에서 사용되는 기술들의 표준화를 의미한다. 즉 웹 사이트를 구성하는 HTML, CSS, Javascript 등의 언어들이 표준화된 방식으로 작성되어야 한다는 것. 쉽게 말하면 사용자가 어떤 브라우저나 기기를 사용하더라도 웹 페이지 화면을 동일하게 볼 수 있도록 하는 것이 바로 웹 표준인 것이다. 웹 표준의 장점웹 페이지를 작성할 때 웹 표준을 준수하면 아래와 같은 효과를 누릴 수 있게 된다. 1. 웹 페이지의 호환성웹 표준을 준수하면 웹 페이지가 모든 브라우저에서 일관되게 표시된다. 이를 통해 사용자들은 어떤 브라우저를 사용하더라도 동일한 사용자 경험을 얻을 수 있어 오래된 브라우저에서도 컨텐츠가 적절하게 표시되고 호환성과 운용성이 확보된다. 2. 검색 엔진 최적화(SEO)웹 표준을 ..
2024.10.04 -
[WEB] HTTP란? HTTP의 기본 개념 이해하기
HTTP(Hyper Text Transfer Protocol)란 클라이언트와 서버가 서로 데이터를 주고받기 위해 사용되는 통신 규약이다. 웹 문서 간에 링크를 통해 연결할 수 있는 프로토콜이며, 문서뿐 아니라 HTML이나 TEXT, 이미지, 음성, 영상, 파일, JSON, XML(API) 등 여러 종류의 데이터들을 폭 넓게 전송할 수 있다. 따라서 서버 간에 데이터를 주고받을 때 대부분 HTTP라는 프로토콜을 사용해 통신한다고 봐도 무방하다. 예를 들어 인터넷 주소를 지정할 때 http://www.naver.com와 같이 시작하는 것은 www.naver.com이라는 인터넷 주소가 가진 데이터 정보 등의 교환을 HTTP의 통신 규약대로 처리하라는 것을 의미한다고 볼 수 있다. cf) 인터넷 기반 서비스..
2024.10.02 -
[Javascript] for ... in
자바스크립트에서 객체는 데이터를 구조화하고 저장하는 데 사용되는 중요한 요소다. 객체는 여러 가지 프로퍼티를 포함하며 각 프로퍼티는 특정한 정보나 기능을 나타낸다. 그러므로 객체의 프로퍼티를 순회하고 데이터를 추출하거나 조작하는 것은 프로그래밍에서 꽤 자주 이루어지는 작업이라고 할 수 있는데 이러한 일을 수행하기 위해 for ... in은 유용한 도구로 활용된다. for ... in의 기본 문법은 아래와 같다. 아래의 예에서 variable은 각 프로퍼티의 이름을 저장할 변수를, object는 순회할 객체를 의미한다. for (variable in object) { // 실행할 코드} for ... in을 사용하여 객체의 프로퍼티를 순회할 때, 각 회차마다 변수에는 해당 프로퍼티의 이름이 할당..
2024.09.30 -
[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 = "..
2024.09.30 -
[Javascript] for ... of
for ... of문은 iterable 객체를 순회하는 반복문이다. ECMAScript 2015(ES6)부터 도입된 자바스크립트의 반복문 중 하나로, DOM 컬렉션 객체의 각 요소를 반복하여 작업하는 데 용이한 방법을 제공한다. cf) DOM 컬렉션 객체인 HTMLCollection과 NodeList 모두 유사 배열 객체이면서 이터러블 객체다. for ... of문은 iterable 객체의 순회를 위해 고안된 것으로 이를 사용하기 위해서는 iterable 객체에 대한 이해가 필요하다. 이터러블 프로토콜 ES6 이전에는 순회 가능한 객체에 대해 통일된 규약이 없었다. 예를 들면 배열, 문자열, 유사 배열, DOM 컬렉션 등은 통일된 규약이 아닌 나름대로의 데이터 구조를 가지고 for문과 for ... in..
2024.09.27 -
[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"} 속성이 추가됨 변수를 ..
2024.09.26