분류 전체보기
-
:first-child, :first-of-type 차이 :: 마이구미HTML, CSS 2019. 2. 23. 23:39
이 글은 CSS 의 :first-child 와 :first-of-type 차이를 다룬다.first 이외에도 last-*, nth-* 와 같은 셀렉터가 존재하기 때문에, 크게 *-child, *-type 으로 볼 수 있다.같은 결과를 내는 경우가 많지만, 분명 다른 차이를 가지고 있다.둘 사이의 차이를 인지하고 있지 않다면, 예기치 못한 이슈를 발생할 것이다. TITLE Child1 Child2 Child3 Child4 .parent > .child:first-child { color: red;} 위와 같은 코드의 결과가 어떻게 나올 것 같은가? (엘리멘트를 요소라고 말하겠다.)클래스명이 parent 요소의 다음 자식인 DIV 요소들 중의 첫번째 요소를 선택하는 CSS 셀렉터를 작성했다.본인은 처음에 아무..
-
aria-*, data-* 속성 비교 :: 마이구미HTML, CSS 2019. 1. 9. 00:09
이 글은 aria-* 속성과 data-* 속성을 비교한다.두 속성 모두 HTML5 스펙에 존재한다.data-* - MDN, aria-* - MDN 우선 aria-*, data-* 속성을 사용한 예제를 보자.다음은 css 가상 클래스(before, after)와 함께, 많이 사용하는 예제이다.두 속성은 같은 목적으로 사용할 경우, 동일한 결과를 낸다. // htmllabel : label : // scss .item1 { &:after { content: attr(aria-label); } } .item2 { &:after { content: attr(data-label); } } 두 방법 모두 동일한 결과를 낸다.위와 같은 동일한 목적으로 사용함에 있어, 문제 될 것이 전혀 없다. javascript 에..
-
[러닝 자바스크립트] 변수와 상수 :: 마이구미Javascript 2018. 12. 22. 20:51
자바스크립트의 대해 책 한 권을 통해 정리하면 좋겠다고 생각한 것을 다룬다.전체적으로 다루는 것이 아닌, 하나의 주제를 다룰 예정이다.이 글은 "변수와 상수 중 어떤 것을 써야 할까요?" 를 중점으로 한다. 이전에도 비슷한 걸 다룬 적이 있다. let, const 키워드를 모른다면, 읽으면 도움이 될 것이다.- let vs const 도서는 대부분 사람들이 추천하는 책으로써, 많이 알려져있다.- 러닝 자바스크립트(Learning JavaScript) 이 책의 3장 "리터럴과 변수, 상수, 데이터타입" 에서는 다음과 같은 질문이 있다. "변수와 상수 중 어떤 것을 써야 할까요?" 대답은 "변수보다 상수를 써야한다."본인은 이것을 이해하기 위해 우선 "변수와 상수가 무엇을 뜻하는가?" 과 "변수와 상수를 왜..
-
백준 16236번 아기 상어 :: 마이구미알고리즘 풀이/그래프 2018. 12. 7. 17:27
이 글은 백준 알고리즘 문제 16236번 "아기 상어" 를 풀이한다.삼성 SW 출제 문제로써, 탐색 문제이다.문제 링크 - https://www.acmicpc.net/problem/16236BFS, DFS - http://mygumi.tistory.com/102 N×N 크기의 공간에 물고기 M마리와 아기 상어 1마리가 있다. 공간은 1×1 크기의 정사각형 칸으로 나누어져 있다. 한 칸에는 물고기가 최대 1마리 존재한다.아기 상어와 물고기는 모두 크기를 가지고 있고, 이 크기는 자연수이다. 가장 처음에 아기 상어의 크기는 2이고, 아기 상어는 1초에 상하좌우로 인접한 한 칸씩 이동한다.아기 상어는 자신의 크기보다 큰 물고기가 있는 칸은 지나갈 수 없고, 나머지 칸은 모두 지나갈 수 있다. 아기 상어는 자신..
-
백준 16234번 인구 이동 :: 마이구미알고리즘 풀이/그래프 2018. 11. 25. 14:52
이 글은 백준 알고리즘 문제 16234번 "인구 이동" 을 풀이한다.문제는 BFS 를 통해 풀이한다.삼성 SW 역량 테스트에서 출제된 문제이다.문제 링크 - https://www.acmicpc.net/problem/16234BFS - http://mygumi.tistory.com/102 N×N크기의 땅이 있고, 땅은 1×1개의 칸으로 나누어져 있다. 각각의 땅에는 나라가 하나씩 존재하며, r행 c열에 있는 나라에는 A[r][c]명이 살고 있다. 인접한 나라 사이에는 국경선이 존재한다. 모든 나라는 1×1 크기이기 때문에, 모든 국경선은 정사각형 형태이다.오늘부터 인구 이동이 시작되는 날이다.인구 이동은 다음과 같이 진행되고, 더 이상 아래 방법에 의해 인구 이동이 없을 때까지 지속된다.국경선을 공유하는 ..
-
백준 1325번 효율적인 해킹 :: 마이구미알고리즘 풀이/그래프 2018. 11. 21. 00:44
이 글은 백준 알고리즘 문제 1325번 "효율적인 해킹" 을 풀이한다.문제는 DFS 를 통해 접근한다.DFS 가 익숙하지 않는다면, 아래 관련 링크를 읽어보면 좋다.문제 링크 - https://www.acmicpc.net/problem/1325DFS - http://mygumi.tistory.com/102- 현재 코드(Java)는 최근 재채점으로 인해 시간초과를 발생시킨다 해커 김지민은 잘 알려진 어느 회사를 해킹하려고 한다. 이 회사는 N개의 컴퓨터로 이루어져 있다. 김지민은 귀찮기 때문에, 한 번의 해킹으로 여러 개의 컴퓨터를 해킹 할 수 있는 컴퓨터를 해킹하려고 한다.이 회사의 컴퓨터는 신뢰하는 관계와, 신뢰하지 않는 관계로 이루어져 있는데, A가 B를 신뢰하는 경우에는 B를 해킹하면, A도 해킹할..
-
백준 15685번 드래곤 커브 :: 마이구미알고리즘 풀이/수학 2018. 11. 17. 12:53
이 글은 백준 알고리즘 15685번 "드래곤 커브" 문제를 풀이한다.삼성 SW 역량 테스트의 문제로 출제된 적이 있다.시뮬레이션 문제로써, 난이도 있는 알고리즘을 요구하는 문제는 아니다.15685번 드래곤 커브 - https://www.acmicpc.net/problem/15685 드래곤 커브는 다음과 같은 세 가지 속성으로 이루어져 있으며, 이차원 좌표 평면 위에서 정의된다. 좌표 평면의 x축은 → 방향, y축은 ↓ 방향이다.시작 점시작 방향세대0세대 드래곤 커브는 아래 그림과 같은 길이가 1인 선분이다. 아래 그림은 (0, 0)에서 시작하고, 시작 방향은 오른쪽인 0세대 드래곤 커브이다...................................................................
-
Javascript: isNaN() 동작원리 및 주의사항 :: 마이구미Javascript 2018. 11. 11. 22:42
이 글은 자바스크립트 네이티브 함수인 isNaN() 를 다룬다.isNaN() 사용에 있어, 동작 원리와 이에 따른 주의사항을 알아본다.공식 문서 - https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/isNaN#special-behavior참고 링크 - https://stackoverflow.com/questions/115548/why-is-isnannull-false-in-js isNaN() 함수는 대부분 많이 사용하거나, 익숙할 것이다.NaN 는 Not a Number 으로써, 숫자가 아닌 것으로 정의하고 있다.그로인해, 타입이 숫자인지 아닌지를 판별할 경우 많이 사용한다. isNaN(1) // falseisNaN..