본문 바로가기

728x90
반응형

분류 전체보기

(269)
[Javascript] Event의 종류 이벤트(Event)는 어떤 사건을 의미한다. 브라우저에서의 이벤트란 예를 들어 사용자가 버튼을 클릭했을 때 혹은 웹 페이지가 로드되었을 때와 같은 것인데 이는 DOM 요소와 관련이 있다. 이벤트가 발생하면 그에 맞는 반응을 해야 한다. 이를 위해 이벤트는 일반적으로 함수에 연결되는데, 해당 함수는 이벤트가 발생하기 전까지는 실행되지 않다가 이벤트 발생 시 비로소 실행된다. 이 함수를 이벤트 핸들러라 하며 이벤트에 대응하는 처리를 기술한다.     자바스크립트 이벤트의 종류  UI Event Event Descriptionload웹 페이지나 스크립트의 로드가 완료되엇을 때unload웹 페이지가 언로드될 때(주로 새로운 페이지를 요청한 경우)error브라우저가 자바스크립트 오류를 만났거나 요청한 자원이 존재..
[WEB] HTTP의 Connectionless 비연결성(Connectionless)HTTP는 기본적으로 연결을 유지하지 않는 모델이다. 즉 서버와 클라이언트의 connection을 지속하지 않는다.1시간 동안 수천 명 이상이 서비스를 사용해도 실제 서버에서 동시에 처리하는 요청은 수 십 개 이하로 적다.이러한 비연결성의 특징으로 인해 서버 자원을 효율적으로 사용할 수 있다.  Stateless와 Connectionless의 차이Stateless(무상태성): 필요한 상태에 대한 정보를 클라이언트가 가지고 오기 때문에 클라이언트의 요청에 어느 서버가 응답해도 상관 없음. 따라서 클라이언트의 요청이 대폭 증가하면 서버를 증설해 해결 가능.Connectionless(비연결성):  클라이언트가 서버에 요청을 하고 응답을 받으면 바로 TCP/IP 연결을 끊어 ..
[WEB] HTTP의 Stateful과 Stateless 클라이언트(client)와 서버(server) 간의 통신을 상태 유지하느냐(stateful), 상태 유지하지 않느냐(stateless) 같은 말을 한 번쯤은 들어봤을 것이다. 여기서 '상태'라는 건 어떤 정보를 말하는 거 같은데  stateful과 stateless에 대해 좀 더 파악해 보는 시간을 가져보려 한다.  Stateful(상태 유지)  상태 유지라는 건 클라이언트와 서버 사이의 관계에서 서버가 클라이언트의 상태를 보존하는 것을 의미한다. 클라이언트와 서버 간에 송수신을 하며 단계별 과정들을 진행하는 데 있어 서버에서 클라이언트가 이전 단계에서 제공한 값을 저장하고 다음 단계에서도 저장한 상태이다. 대표적인 예로 홈페이지에서 회원 로그인을 하면 페이지를 이동해도 서버는 클라이언트의 상태를 유지(..
[Javascript] Array 함수 배열 생성하기1. 배열 리터럴const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]  2. 배열 생성자const arr1 = new Array(1, 2, 3);console.log(arr1); // [1, 2, 3]const arr2 = new Array(10); // 인수를 하나만 넘겨줄 경우 그 인수가 배열의 길이arr2.length; // 20     Array 함수🔑로 표시한 함수는 원본 배열을 변경시킨다.🔒로 표시한 함수는 원본 배열을 변경시키지 않는다.    Array.isArray(arg) 주어진 인수가 배열이면 true, 배열이 아니면 false를 반환한다.   Array.from() ES6에서 새롭게 도입된 함수로 특정 객체를 변환하여 새로운 배열을 생성한다. 변..
[Chrome] 자주 사용하는 크롬 단축키 정리 탭 관련 단축키단축키설명Ctrl + 1 ~ 8첫 번째에서 여덟 번째 탭으로 이동(8번째까지만 가능).Ctrl + 9맨 오른쪽 탭으로 이동Ctrl + Tab오른쪽 탭으로 이동Ctrl +  Shift + Tab왼쪽 탭으로 이동Ctrl + T새 탭 열기Ctrl + W 또는 Ctrl + F4탭 닫기Ctrl + Shift + T마지막으로 닫았던 탭 복원(크롬은 최대 10개까지 기억한다고 함)Ctrl + Shift + W모든 크롬 창 닫기    창 관련 단축키단축키설명Ctrl + N새 창 열기Ctrl + Shift + N시크릿 모드 새 창 열기   스크롤 관련 단축키단축키설명Space bar위로 스크롤Shift + Space bar아래로 스크롤Shift + 마우스 휠페이지 가로 스크롤Alt + ← (방향키 왼쪽)페..
[Javascript] Object 객체 함수 자바스크립트에서 모든 객체들은 Object 객체와 Object.prototype 객체의 모든 프로퍼티와 함수를 상속 받는다. 본 포스트에서는 대표적이면서도 자주 사용되는 객체 함수들을 소개해 본다.  Object.create()Object.create(proto[, propertiesObject]) 주어진 프로토타입(prototype)의 객체와 속성들을 갖고 있는 새 객체를 생성한다.   Object.assign()하나 이상의 원본 객체들로부터 모든 열거 가능한 속성들을 대상 객체로 복사한다.let user = { name: 'Captain America', age: 100}// 객체주소 참조 값이 복사되므로 서로 공유됨. 진정한 복사 Xlet cloneUser = user; // 빈 객체는 ..
[WEB] 웹 접근성(Web Accessibility) 웹 접근성이란 장애를 가진 사람들도 신체적 또는 환경적 조건에 관계없이 인터넷을 통해 정보에 접근하고 이용할 수 있도록 하는 것을 말한다. 이는 인터넷을 더욱 공평하고 인종이나 성별, 연령, 장애 유무와 상관없이 모두가 이용할 수 있는 공간으로 만드는 것을 목표로 한다. 예를 들어 시각 장애인의 경우 화면을 눈으로 볼 수 없으므로 스크린 리더라는 별도의 소프트웨어를 PC에 설치하여 음성으로 웹 페이지에 담긴 정보를 이해한다. 하지만 스크린 리더가 스스로 웹 페이지의 내용을 분석하지는 못한다. 만약 로그인 페이의 경우 해당 페이지의 디자인을 '로그인'이라는 텍스트 대신 로그인 이미지를 사용할 경우 스크린 리더는 이를 인식하지 못해 시각 장애인이 홈페이지를 이용할 수 없게 되는 차별이 일어난다. 따라서 이미..
[WEB] 웹 표준(Web Standards) 웹 표준이란 웹에서 사용되는 기술들의 표준화를 의미한다. 즉 웹 사이트를 구성하는 HTML, CSS, Javascript 등의 언어들이 표준화된 방식으로 작성되어야 한다는 것. 쉽게 말하면 사용자가 어떤 브라우저나 기기를 사용하더라도 웹 페이지 화면을 동일하게 볼 수 있도록 하는 것이 바로 웹 표준인 것이다.   웹 표준의 장점웹 페이지를 작성할 때 웹 표준을 준수하면 아래와 같은 효과를 누릴 수 있게 된다.  1. 웹 페이지의 호환성웹 표준을 준수하면 웹 페이지가 모든 브라우저에서 일관되게 표시된다. 이를 통해 사용자들은 어떤 브라우저를 사용하더라도 동일한 사용자 경험을 얻을 수 있어 오래된 브라우저에서도 컨텐츠가 적절하게 표시되고 호환성과 운용성이 확보된다. 2. 검색 엔진 최적화(SEO)웹 표준을 ..

728x90
반응형