본문 바로가기

분류 전체보기85

JavaScript(2) 지난번에는 자바 스크립트의 특성 몇 가지와 변수들에 대해 알아보았다. 계속해서 자바스크립트의 기본 문법에 대해 알아보자. 지난 글에서 호이스팅 특성에 대해 설명하면서 undefined를 언급했는데 undefined는 말 그대로 변수에 값이 대입되지 않은 상태를 말한다. 특정 변수가 정의될 때, 호이스팅 특성에 의해 위로 끌어올려지는데, 할당은 해당 위치에서 이뤄지기 때문에 할당이 이뤄지기 전까지 해당 변수는 undefined 상태이다. 이와 같이 작성했을 경우, name 변수는 호이스팅 특성에 의해 선언은 위로 올려지고, 할당은 그대로 위치한다. 따라서 처음 콘솔 로그는 undefined로, 두 번째 콘솔 로그는 kim이 출력된다. 자바 스크립트의 데이터 타입에는 기본 데이터 타입과 객체 타입, ES6에.. 2023. 5. 3.
JavaScript(1) 자바 스크립트는 프로토 타입을 기반으로 객체 생성을 지원하는 동적 스크립트 언어이다. 웹 브라우저에서 주로 사용하고, Node.js를 이용해 콘솔 환경에서 사용한다. C언어의 기본 구문을 바탕으로 했기 때문에 자바와 기본 구문이 비슷하며, 웹 브라우저 UI를 제어하기 위해 만들어진 프로그래밍 언어라고 생각하면 된다. ECMA International이라는 정보 통신에 대한 표준을 제정하는 비영리 표준화 기구에서 몇 차례에 걸쳐 자바스크립트에 대해 표준을 제시했고 현재는 ES6라는 ECMA에서 제안하는 6번째 표준 명세를 기준으로 사용하고 있다. 자바 스크립트의 기본 문법으로는 HTML 문서 내에서 사용할 때는 코드를 작성하면 된다. 자바 스크립트의 변수 타입은 가리키는 값에 대한 타입을 말한다. var,.. 2023. 5. 2.
CSS Selector(2) 지난번에는 CSS 선택자들 중 기본 선택자들과 그룹 선택자를 알아봤다. 다음으로는 결합자가 있다. 결합자에는 자손 결합자, 자식 결합자, 일반 형제 결합자, 인접 형제 결합자 등이 있다. 우선 Descendant combinator(자손 결합자)의 경우 첫 번째 요소의 자손인 노드를 선택하여 적용하는 것이다. 사용법은 selector1 selector2 {style properties} 와 같은 방법으로 작성한다. 위와 같이 작성할 경우, 첫 번째 요소인 ul의 자손 중 span에 해당하는 자손에 스타일이 적용되는 것이다. 결과는 위와 같다. Child combinator(자식 결합자)는 자손 결합자와 비슷하지만 첫 번째 요소의 바로 아래 자식인 노드를 선택해 스타일을 적용한다는 것에서 차이가 있다. 사.. 2023. 5. 2.
CSS Selector(1) CSS Selector (CSS 선택자)는 HTML 문서 내에서 CSS 규칙을 적용할 요소를 정의하는 역할을 한다. 선택자로는 기본 선택자, 그룹 선택자, 결합자, 의사 클래스, 의사 요소 등이 있다. 기본 선택자에도 여러 가지 선택자들이 있는데 전체 선택자의 경우 HTML 문서 내의 모든 요소를 선택하여 적용한다. 위와 같이 * {style properties} 와 같이 작성하며 이는 html 문서 내 모든 요소에 적용된다. 유형 선택자는 태그명을 이용해서 스타일을 적용한다. HTML 문서 내에서 주어진 해당 유형의 모든 요소를 선택하여 적용하는 것이다. 다음과 같이 html 문서를 작성할 경우 아래와 같은 결과를 얻을 수 있다. h3이라는 유형만 선택하여 스타일을 적용하는 것이다. 클래스 선택자는 해.. 2023. 5. 2.