Hello Jay's Programming World!

안녕하세요. Jay입니다. 오늘은 배열을 복사하는 매서드 slice에 대해서 알아보도록 하겠습니다. Array에서 기본적으로 제공하는 매서드입니다. 그래서 그냥 바로 쓰시면 됩니다. 문법은 아래와 같습니다. 복사하기 원하는 배열 시작 인덱스와 마지막 인덱스에 1을 더한 값을 넣으면 됩니다. Array.slice([begin[, end]) 예를 들어, 아래와 같은 매서드가 있다고 합시다. 이 매서드에서 3번째부터 배열을 얻고 싶으면 아래와 같이 slice 매서드를 사용하시면 됩니다. var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']; fruits.slice(2); // ['Lemon', 'Apple', 'Mango']; 혹은 처음부터 2번째 배열까..

안녕하세요. Jay 입니다. 오늘 알아볼 속성은 clear 입니다. clear 속성은 float의 동작 방식을 제어하는데 사용됩니다. div가 float 속성을 가지고있어 section이 바로 옆에 그려진 것을 확인할 수 있습니다. 이럴 때, section을 아래에 그리고 싶다면, section에 clear 속성을 주면 됩니다. 그러면 아래와 같이 됩니다. float와 같은 방향으로 선언해야 겹처지지 않습니다. 참조: http://ko.learnlayout.com/clear.html

안녕하세요. Jay입니다. 오늘은 Float에 대해서 알아보도록 하겠습니다. "CSS 속성(property) float 은 한 요소(element)가 보통 흐름(normal flow)으로부터 빠져 텍스트 및 인라인(inline) 요소가 그 주위를 감싸는 자기 컨테이너의 좌우측을 따라 배치되어야 함을 지정합니다." 라고 정의되어 있습니다. 말이 좀 어렵죠? 실제로 어떻게 보이는지 확인해보도록 하겠습니다. 먼저 float를 사용하지 않은 이미지와 텍스트의 배치를 보겠습니다. 이미지의 하단 부분부터 텍스트가 시작되는 것을 볼 수 있습니다. 이미지 옆 부분에는 빈 공간도 보이네요. 그럼 float css를 사용해보겠습니다. float: right 로 지정했습니다. 어떤가요? 이미지가 오른쪽에 배치되고 텍스트들이..

static 기본 값. 위치가 지정된 것이 아닌 상태. relative 별도의 프로퍼티를 지정하지 않은 이상 static과 동일하게 동작. 상대 위치가 지정된 엘리먼트에 top, right, bottom, left 등을 지정하면 기본 위치와 다르게 위치가 조정된다. 다른 콘텐츠는 해당 엘리먼트에서 남긴 공백에 맞춰 들어가게끔 조정되지 않는다. fixed 뷰포트(viewport)에 상대적으로 위치가 지정된다. 페이지가 스크롤되더라도 늘 같은 곳에 위치한다는 뜻이다. relative와 마찬가지로 top, right bottom, left 프로퍼티가 사용된다. 고정 엘리먼트는 평소대로라면 있었을 법한 공백을 페이지에 남기지 않는다. 모바일 브라우저의 경우, 고정 엘리먼트 지원이 굉장히 불안정하다. absolu..

block 한 줄을 모두 차지하며 엘리먼트가 배치된다.ex) div, p, form, header, footer, section 등 inline 줄 바꿈 없이 다른 엘리먼트들과 같은 줄에 엘리먼트가 배치됨. 요소를 구성하는 태그에 할당된 공간만 차지한다. 예를들어 width, height 속성을 주더라도 무시되고 자식 엘리먼트들의 공간만 차지한다.ex) span, a 등.. none 엘리먼트를 실제로 삭제하고 재생성하지 않고도 엘리먼트를 보이고 감추는데 사용한다.참고) Visibility: hidden은 자리는 차지하되 모습만 감추는 것으로 display: none과는 다르다. 참조: http://ko.learnlayout.com

!important는 css 적용 순서를 무시하고, !important를 선언한 속성을 가장 높은 우선순위를 부여합니다. placeholder 색상을 지정했는데, IE에서만 제대로 적용되지 않는 현상이 있었습니다. 아래와 같이 구현을 했는데, IE에서는 Input Dom에 적용한 color의 우선순위가 높아 해당 color의 색상이 적용되고 있었습니다. 이를 해결하기 위해 !important를 사용했습니다. 해당 css가 가장 우선순위가 높도록 수정했습니다. 이 방법을 사용하면 IE에서도 동일하게 placeholder의 색상을 표현할 수 있습니다.

앵귤러 아키텍처 사용자용 애플리케이션 개발을 위한 프레임워크. 사용자와 접촉하게 될 애플리케이션의 뷰와 핵심 비지니스 로직 작성 외에 모든 것을 관리해 주는 도구. 따라서 앵귤러 개발은 다음의 두 단계를 거친다. 1. 사용자와 상호작용할 뷰를 구성. 2. 뷰와 연결된 일련의 로직을 개발. 앵귤러를 학습한다는 것은 앵귤러의 구조와 실행 방식을 이해하고 이에 맞게 뷰와 비지니스 로직을 개발하는 방법을 이해하는 것. 뷰를 구성하는 요소 템플릿- 뷰를 구성할 마크업을 포함한 앵귤러에서 제공하는 문법으로 작성.- 화면을 구성하는 틀이라는 의미. 컴포넌트 (Component)- 앵귤러에서 가장 중요한 요소로서 뷰에서 일어나는 모든 일을 관리.- 보통은컴포넌트 하나가 화면 전체를 담당하도록 만들지 않고, 기능이나 공..

? span의 단어 뜻을 먼저 찾아보겠습니다. 1. (어떤 일이 지속되는) 기간[시간] 2. (포괄하는) 폭[범위]; 다양성 3. 경간(俓間: 다리・건물 따위의 기둥과 기둥 사이) 4. 폭, 너비 전체적으로, 폭의 의미를 가지고 있는 것 같습니다. 비슷한 역할을 하는 태그로는 DIV가 있습니다. 그렇다면 DIV와는 어떤 차이가 있을까요? 아래 jsFiddle의 Result 부분을 보면, div와 span의 차이점을 확인할 수 있습니다. div는 모든 가로폭을 다 차지하지만, span은 태그 안에 내용의 공간만 차지하고 있습니다. 그래서 div를 사용하면 줄바꿈이 되지만, span은 줄 그대로 내용에 삽입이 가능합니다. http://endic.naver.com/enkrEntry.nhn?sLn=kr&entr..

Boolean으로 강제 변환하면 false가 되는 값. 이외에 모든 값는 truthy한 값. undefinednullfalse+0, -0, NaN""

JSON 표현형(Representation)으로 확실히 나타낼 수 있는 값. JSON.stringify()로 문자열화할 수 있다. JSON 안전 값이 아닌 것들은 undefined, 함수(function), 심벌(ES6부터, symbol), 환형 참조(circular references)가 있다. 이들은 모두 다른 언어로 이식하여 JSON 값으로 쓸 수 없는 표준 JSON 규격을 벗어난 값이다. 이들 값을 JSON.stringify() 하면 자동으로 값을 누락시키고, 배열에 이들 값이 포함되어 있으면 인덱스 정보가 뒤바뀌지 않도록 null로 값을 바꾼다.