본문 바로가기

전체 글

JavaScript 과제하면서 헷갈리는 것들 정리해놓기! 1. Arr.forEach - 자신의 내부에서 반복문 실행. - 내부에서 반복문을 통해 자신을 호출한 배열을 순회하면서 수행해야 할 처리를 콜백 함수로 전달받아 반복 호출. - forEach 매서드의 콜백함수는 이를 호출한 배열의 요소값을 인수로 전달받을 수 있음. 팩토리얼 계산하기 문제 나의 접근법: ☑️ 1~ n까지 들어가는 배열 만들기 ☑️ 배열 안에 있는 요소들 곱하기 이를 실행한 초기코드: function question(n) { let result; let arr = [] for(let i = 1; i 성공! ☑️ 배열 안에 있는 요소들 곱하기 ---> 실패 ㅠ 어떤 의도로 "배열 안에 있는 요소들 곱하기" 를 구상했냐면 배열의 인덱스를 활용해서 각각의 요.. 더보기
[JavaScript] 순수함수와 비순수함수(Side Effect) 계산기 만들기 과제를 하던 중, Functional Programing(함수형 프로그래밍) 에 대해 접하게 되었다. 아직 함수형 프로그램에 대해 완벽하게 숙지를 못해서 오늘은 우선 함수형 프로그래밍의 가장 중요한 포인트인 '순수함수'에 대해 다뤄보고자한다. 순수함수란, - Side Effect가 없는 함수로, 함수 내부만이 결과값에 영향을 미치는 함수이다. - 같은 입력 값이면 항상 같은 값을 반환한다. 비순수함수란, - Side Effect가 있는 함수로, 함수 내부 이외의 외부 상태도 결과값에 영향을 미치는 함수이다. - 같은 입력값이더라도, 외부에 의해 반환값이 달라질 수 있다. 💡 Side Efeect(부수 효과) 함수가 수행하는 일 외에 부가적으로 수행하는 일을 의미한다. 부수효과가 일어나면 함.. 더보기
카카오 클론코딩 _HTML / CSS 지난 주는 블로그가 뜸하네요~,,~지난 주에 htmsl과 css 학습을 마치고(?) 자바스크립트로 들어갔는데.. 아직 어려워서 적응 중이니 곧 다시 열심히 써보겠심다 .. 쉬어가는 의미에서 올리는 기록용 카카오 클론코딩 회고! 이거 작성하면서 마크다운 문법을 처음 접했는데, 은근 간단해서 금방 익힐 수 있었다. 아래 링크 참고! 😼코린이 2주차가 만든 카카오 웹페이지 클론!아래는 진행과정과,, 회고를 빙자한 일기가 있읍니다.   ^__^   나중에 더 성장해서 코드 수정하러 올게요 ㅎㅎㅎ👀 진행과정우선 클론 코딩을 진행하기 전, 만들어야 할 섹션을 나누어보았다.header - 머릿말/ 로고, nav, 아이콘 등등..  notice - 소개글.  article - 메인 정보들.  banner- 중간에 .. 더보기
동기 vs 비동기 동기( Synchronous ) : 동시에 일어나는 동기는 요청과 응답이 동시에 일어난다는 뜻이다. 하나의 요청이 들어가면, 해당 작업이 끝난 후 응답을 받을 때까지는 다른 작업을 수행하지 못하고 기다려야 한다. 다른 작업을 하기 위해서는 앞선 작업이 끝날때까지 기다려야 한다. 비동기(Asynchronous) :동시에 일어나지 않는 비동기는 동기와 달리 요청과 응답이 동시에 일어나지 않는다. 앞에서 진행하고 있는 작업에 대한 응답을 받지 못했더라도, 그동안에 새로운 작업을 시작할 수 있다. 아래 사진을 보면 이해가 편하다. 주문(=요청) 고객전달(=응답)로 생각해 보자. (a) 사진에서는 주문과 픽업을 모두 한 사람이 담당한다. 점원은 주문과 동시에 음료를 제조한 후 고객에게 전달한다. 주문을 한 손님은.. 더보기
Display 속성이란? Display 속성이란? 화면에서 html의 요소들을 어떻게 배치하고 보여줄지 정하는 속성으로 대표적으로 none, block, inline, inline-block 4가지 속성이 있다. 다음 예시와 함께 알아보도록 하자. 경제 정치 과학 생활 하하 호호 위 사진은 적용할 예시 코드와 그 실행화면이다. 보기 편하도록 블록레벨 요소인 태그에 너비와 높이를 준 후 테두리를 만들어주었다. ※ 실행화면에서 - 는 블록레벨이기에 줄 바꿈이 일어나고 너비와 높이가 적용이 되었으며, - 태그는 인라인요소이기에 줄 바꿈이 일어나지 않고 텍스트가 차지하는 만큼만 공간으로 차지하였다. 1. display:none; 화면에서 요소를 숨김처리하는 속성이다. (단, 개발자 도구에서는 코드가 보인다.) display:none; .. 더보기
시맨틱 마크업(Semantic Markup)에 대한 모든 것 1. 시맨틱마크업(Semantic Markup) 이란? Semantic: "의미론적" Markup: "HTML 태그로 문서 작성" 즉, "html태그로 의미가 잘 전달되는 문서를 작성하는 것"을 뜻한다. 2. '시맨틱마크업'을 사용해야하는 이유 및 장점 시맨틱 마크업은 컨테이너 태그와 같이 화면 상 드러나는 특징은 없지만, 잘 사용한다면 여러가지 이점이 있다. 1. 웹 접근성을 높여준다. - 시맨틱 마크업은 시각장애가 있는 사용자가 스크린 리더를 활용하여 페이지를 탐색할때 참조된다. 웹 접근성(시각장애인 스크린리더) : 「지능정보화기본법」에 따라 장애인이나 고령자분들이 웹 사이트에서 제공하는 정보를 비장애인과 동등하게 접근하고 이용할 수 있도록 보장하는 것으로 웹 접근성 준수는 법적의무사항 2, 검색 엔.. 더보기
블록구조와 인라인구조의 특징과 차이점 모든 태그는 인라인태그와 블록태그로 나눌 수 있다. 인라인태그와 블록태그가 각각 어떤 특징을 가지고 있는지 살펴보자. 인라인 구조의 특징 1. 너비 인라인(inline) 구조는 자기에게 필요한 만큼의 공간만 차지한다. 즉, 텍스트의 크기가 곧 너비이며 줄이 바뀌지 않고 가로로 길게 정렬된다는 특징이 있다. 2. 태그 인라인 구조의 대표적인 태그는 다음과 같다. ,,,,,,, ,, ... 블록구조의 특징 1. 너비 블록(block)구조는 자기가 속한 영역의 너비를 모두 차지한다. 즉 이름처럼 블록을 형성하는 것이다.이는 텍스트의 크기와 관계없이 줄 바꿈이 일어나기에 세로로 정렬된다는 특징이 있다. 2. 태그 블록 구조의 대표적인 태그는 다음과 같다. ,,,,, ... 각 태그가 블록 구조인지, 인라인 구조.. 더보기