현우의 개발상자

JS Window 객체 Window 객체는 웹 브라우저의 창을 나타내는 객체이다. 브라우저 창 안에 존재하는 모든 요소의 최상위 객체로서, 자바스크립트의 모든 객체, 전역 함수, 전역 변수들은 자동으로 Window 객체의 프로퍼티가 된다. Window 객체의 메서드는 전역 함수이며, Window 객체의 프로퍼티는 전역 변수가 됩니다. Window 객체는 브라우저 창이 열릴 때마다 하나씩 생성된다. Window 객체의 메소드 alert(message) 확인 버튼을 가지며 메시지를 지정할 수 있는 경고 대화 상자를 띄운다. alert(안녕하세요 최현우입니다.) prompt([message, default) 사용자가 텍스트를 입력할 수 있도록 안내하는 선택적 메시지를 갖고 있는 대화 상자를 띄운다. defau..

JS for of for of 는 배열의 요소를 하나씩 꺼내어 사용하는 방법을 말한다. 좀 더 어려운 말로 '배열의 각 요소를 순회하며 처리한다'로 표현할 수 있다. (iterable 객체의 요소에 대해 반복하는 데 사용되는 반복문, 이번 글에서는 배열에 관해서만 설명하겠다.) for of 의 기본 구문 for (let element of array) { // element(요소)에 대한 작업 수행 } for of 의 사용 예시 const fruits = [apple, banana, orange, kiwi, strawberry]; for (const fruit of fruits) { console.log(fruit); } // 출력 // apple // banana // orange // kiwi // ..

함수의 개념 함수(function)란 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록을 의미한다. 이러한 함수는 필요할 때마다 호출하여 해당 작업을 반복해서 수행할 수 있다. 함수선언 function 함수명(매개변수) { 함수본문 } funcition이라는 선언자를 작성 함수 이름 작성 소괄호를 열어 매개변수를 작성(매개변수는 생략가능, 소괄호는 반드시 열고 닫아야 한다.) 중괄호를 열어서 함수 본문 작성 함수 호출 이렇게 선언한 함수는 함수 이름 뒤에 소괄호를 붙여 호출할 수 있다. // 함수 선언 function attack(){ console.log("damage") } // 함수 호출 attack(); // damage 매개 변수 (parameter) 함수를 선언할 때 매개 변수를 작..

오늘 html&css 실습을 진행하다, class 선택자를 지정했는데 스타일이 적용이 안 되는 현상을 발견했다. // html // Original Cola 1000원 ================================================================== .box1_top div { border: 1px solid #b5b5b6; border-radius: 10px; box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.5); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; } // css가 적용됨 // .box1_top .it..

용어해설은 밑에 있습니다(본문 글에서 파란색으로 표시한 용어들). 참고하면서 읽어주세요! 1. 요약 정리 GET(기본값) url에 포함되어 전달 문자열만 전달가능 길이제한 O 멱등성이 있다. GET 메소드는 주로 데이터를 읽거나(Read) 검색(Retrieve)할 때에 사용됨 (GET요청으로 목록을 불러옵니다. 이 행위를 여러 번 수행한다고, 서버의 상태가 변하지도 않고 //단순히 조회만 하므로//, 같은 효과를 기대할 수 있습니다. //요청한 데이터 목록을 조회하는 효과//) POST body에 숨겨져서 전달 문자열 + 바이너리 길이제한 X 멱등성이 없다. POST 메소드는 주로 새로운 리소스를 생성(create) 할 때 사용됨 (데이터를 가져오기보다, 서버의 데이터를 수정하는 목적) 2. 추가 조사 ..

웹접근성? 웹사이트에서 제공하는 정보를 차별 및 제한 없이 동등하게 이용할 수 있도록 보장하는 것 여기서 정보를 차별 및 제한없이 동등하게 제공한다는 것은 신체적 조건이나 환경적 조건에 관계 없이 제공해 달라는 것을 의미한다. 신체적 조건 - 장애인 및 고령자를 포함한 모든 사람 환경적 조건 - 다양한 platform 및 Device와 웹 브라우저 등 모든 환경 웹접근성 향상을 위한 방법 1. W3C 산하 기구인 WAI에서 권고하고 있는 웹 콘텐츠 접근성 지침인 WCAG를 준수 하는 것 2. 웹 서비스를 제작할 때 웹표준 기술을 활용하는 것 웹접근성 지침 웹사이트 / 애플리케이션에서 충족해야 되는 기준을 정의, 즉 웹 서비스를 제작하는 사람들이 개발과정에서 고려해야 될 요구사항이 바로 접근성 지침이다. ..

브라우저 렌더링 렌더링? 렌더링이란? HTML, CSS, 자바스크립트 등 개발자가 작성한 문서가 브라우저에서 출력되는 과정을 말한다. 렌더링 과정 1단계) DOM, CSSOM 트리 생성 사용자가 브라우저를 통해 웹사이트에 접속하면, 서버로부터 HTML, CSS 등 웹 사이트에 필요한 리소스를 다운로드한다. 브라우저가 페이지를 렌더링 하려면, 먼저 HTML 코드는 DOM, CSS는 CSSOM 트리를 생성해야 한다. DOM? 텍스트 파일로 만들어져 있는 웹 문서를 브라우저에 렌더링 하려면 웹 문서를 브라우저가 이해할 수 있는 구조로 메모리에 올려야 한다. 브라우저의 렌더링 엔진은 웹 문서를 로드한 후, 파싱 하여 웹 문서를 브라우저가 이해할 수 있는 구조로 구성하여 메모리에 적재하는데 이를 DOM이라 한다...