반응형 프론트엔드11 [javascript] find()와 findIndex()의 차이점 1. find() find()는 주어진 판별함수 (testing function)을 만족하는 요소 중 첫 번째 값을 반환한다. 이때, 만약 반환할 값을 찾지 못한 경우에는 undefined를 반환하게 된다. const arr =['먹고살기', '정말', '쉽지않다', '하하하'] const key = arr.find(value) => value.length number > 3); console.log(key); 위 코드 예제에서 findIndex()의 인자인 판별 함수는 배열의 숫자들이 3보다 큰 지 비교한다. 그리고 결과가 참인 첫번째 요소의 인덱스 값을 반환한다. 즉, 3보다 큰 수 중 첫 번째인 4가 위치한 인덱스 값 3이 출력된다. 2023. 7. 4. [html, CSS] CSS 작성하는 방법 (1분 소요) 1. CSS란? Cascading style sheet의 약자 웹 문서의 전반적인 스타일을 따로 저장해둔 시트 2. 작성 방법 인라인, 내부 스타일 시트, 외부 스타일 시트의 세 가지 방법 존재 인라인 태그 내에 스타일을 바로 지정하는 방식 제목입니다. 설명할 내용들입니다. 내부 스타일 시트 style태그를 사용하여 html문서의 head에서 스타일을 지정해주는 방식 style 태그 안의 내용이 css라고 할 수 있다. hello 외부 스타일 시트 내부 스타일 시트 방식에서 style 태그의 내용만 따로 css파일로 저장하는 방식이다. html 문서의 head에 css파일의 링크를 미디어 태그로 추가해준다. h1{color:red;} 2023. 6. 29. [html, CSS] table 잘 만드는 방법 1. table 태그의 구성요소 tr (table row) td (table data) 2. 사용 예시 1️⃣ 행 생성 테이블 태그 안에서 다음과 같이 사용가능 구분 이름 판매량 2️⃣ 행 추가 및 내용 입력 위 내용을 두번 복붙하면 행(row)이 늘어난다. 1 해리포터 100 2 헝거게임 200 3 반지의 제왕 300 3. 테이블을 위한 간단한 css 1️⃣ border 예시 1: px 간격 조절해서 테이블에 두줄 선 두르기 예시 2: 다시 한줄로 만들어 주기 {border-collapse: collapse;} 2️⃣ width & height 숫자로 지정하는 방법 body 태그 안에 다음과 같이 지정 가능 퍼센트로 지정 전체 브라우저 크기에 맞춰서 지정됨 3️⃣ 셀 병합 (컬럼 병합) colspan .. 2023. 6. 29. [html, CSS] html 태그로 만들 수 있는 인풋 종류 (1분 소요) 1. input * 입력 인풋을 받는 태그 * 타입을 지정하여 사용 가능 2. text 아래와 같은 입력창이 생성된다. (velog에서는 html, 마크다운 언어를 둘다 지원해서 생성된 인풋 박스를 띄워줌) 코드 스니펫은 다음과 같다. ```html ``` 3. password 3. password text 대신 password를 타입으로 지정하면, 비밀번호 입력창처럼 인풋내용이 가려짐 4. Date 날짜 입력 가능 5. time 시간 입력 가능 6. range 범위 지정 가능 7. color 컬러 지정 팔레트 띄워줌 8. radio 라디오 버튼 생성 9. checkbox 체크박스 생성 9. file 업로드할 파일 지정 가능 2023. 6. 29. 이전 1 2 3 다음 반응형
