NewBean의 웹과 콩나무
close
프로필 배경
프로필 로고

NewBean의 웹과 콩나무

  • 분류 전체보기 (500)
    • Programming Language (87)
      • Java (65)
      • C (4)
      • Python (16)
      • R (2)
    • UI & UX (4)
      • Figma (4)
    • Front-End Study (193)
      • HTML+CSS (34)
      • HTML 사전 (6)
      • CSS 사전 (14)
      • Sass (6)
      • 반응형 웹 (8)
      • JavaScript (52)
      • TypeScript (8)
      • React (29)
      • Next.js (9)
      • Angular (1)
      • Vue.js (23)
      • Vite (2)
      • Node.js (1)
    • Back-End Study (101)
      • DBMS (28)
      • Linux (43)
      • Git & GitHub (15)
      • Express (7)
      • Postman (4)
      • REST API (2)
      • PHP (0)
      • Grafana (2)
    • Computer Science (15)
    • 정보처리기사 (76)
      • 1. 요구사항 확인 (1)
      • 2. 화면 설계 (1)
      • 3. 데이터 입출력 구현 (1)
      • 4. 통합 구현 (1)
      • 5. 인터페이스 구현 (1)
      • 6. 프로그래밍 언어 활용 (1)
      • 7. SQL 응용 (1)
      • 8. 서버 프로그램 관리 (1)
      • 9. 소프트웨어 개발 보안 구축 (1)
      • 10. 애플리케이션 테스트 관리 (1)
      • 11. 응용 SW 기초 기술 활용 (1)
      • DB (65)
    • 잡다한 말 (6)
    • 기타 (5)
    • 내가 읽은 책 (5)
    • 없어진 글모음 (7)
  • 홈
  • 방명록
  • 깃허브
  • 포트폴리오
forEach 메서드

forEach 메서드

forEach 메서드 1. forEach 메서드 forEach 메서드란? 배열의 각 요소에 대해 주어진 함수를 실행하는 메서드입니다. 반복문을 대신하여 코드를 간결하게 해주고, 배열의 각 요소에 대한 작업을 수행할 때, 편리하게 사용됩니다. 2. forEach 메서드 구조 array.forEach(function(currentValue, index, array) { // currentValue: 현재 반복 중인 요소의 값 // index: 현재 반복 중인 요소의 인덱스 // array: 원본 배열 // 수행 코드 }); 3. 예시 // 배열 생성 var numbers = [1, 2, 3, 4, 5]; // 배열의 각 요소와 인덱스를 출력 numbers.forEach(function (number, ind..

  • format_list_bulleted JavaScript
  • · 2024. 1. 26.
  • textsms
동기와 비동기

동기와 비동기

동기와 비동기 1. 동기와 비동기 - 동기와 비동기 실행 방식은 코드의 동작 및 효율성을 제어하는 데 중요한 역할을 합니다. 2. 동기 (Synchronous) - 동기 코드 실행은 순차적으로 진행되는 것을 의미합니다. 한 작업을 완료한 후, 다음 작업이 실행됩니다. - 동기 코드 실행 방식은 코드 블록이 위에서 아래로 순차적으로 실행되는 것이 특징입니다. - 동기 코드 실행은 주로 함수 호출, 루프, 파일 처리 등에서 사용됩니다. - 하나의 작업이 지연되면, 모든 작업이 지연되는 단점이 있습니다. console.log("첫 번째 실행"); console.log("두 번째 실행"); console.log("세 번째 실행"); 3. 비동기 (Asynchronous) - 비동기 코드 실행은 순차적으로 진행되..

  • format_list_bulleted JavaScript
  • · 2023. 11. 10.
  • textsms
fetch 함수

fetch 함수

fetch 함수 1. fetch( ) 함수 - 네트워크 요청을 보내고, 응답을 처리하기 위한 기본적인 웹 API - 웹 페이지 or 웹 패을리케이션에서 서버로 HTTP 요청을 보내고, 서버로부터 데이터를 받아올 수 있음 - 비동기적으로 작동하며, Promise를 반환함 2. 구문 - 각 매개변수와 메소드는 다음과 같음 - url : 요청을 보낼 URL 주소 - options : 요청에 대한 추가 설정을 정의하는 객체. HTTP 메서드, 헤더, 요청 본문 등 다양한 옵션 지정 가능 (선택) - .then( ) : fecth( )가 성공적으로 요청을 보내고, 응답을 받으면 실행되는 Promise의 첫 번째 핸들러. 여기서 응답을 처리 - .catch( ) : 네트워크 오류 or 요청 처리 중 발생한 다른 오..

  • format_list_bulleted JavaScript
  • · 2023. 10. 26.
  • textsms
Callback 함수

Callback 함수

Callback 함수 1. Callback 함수 - 다른 함수 내에서 실행되는 함수를 뜻함 - 주로 비동기 코드에서 사용되며, 비동기 작업이 완료되면 실행되어야 하는 작업을 정의함 2. Callback 함수의 특징 - 함수 내에서 다른 함수의 인자로 전달될 수 있음 - 함수 내에서 다른 함수의 결과로 반환될 수 있음 - 함수를 비동기 작업의 완료 후, 실행되도록 스케줄링할 수 있음 3. 예시 - a 함수는 3초 후, 비동기 작업이 완료되고 그 작업이 완료된 후, b 콜백 함수가 실행됨 console.clear(); function a(callback) { setTimeout(function () { console.log("비동기 작업 완료"); callback(10); // callback 함수를 호출 ..

  • format_list_bulleted JavaScript
  • · 2023. 10. 24.
  • textsms
localStorage

localStorage

localStorage 1. localStorage - JavaScript에서 localStorage는 웹 브라우저에서 데이터를 로컬로 저장하고, 유지할 수 있는 웹 스토리지 메커니즘 - 클라이언트 측에서 데이터를 영구적으로 저장하기 위한 간단하고 편리한 방법을 제공 - 사용자의 브라우저 세션 간에 데이터를 유지하며, 브라우저를 닫았다 열어도 데이터가 유지됨 2. 사용방법 - 데이터 저장 // localStorage.setItem('키', '값'); // 예시 localStorage.setItem('a', 10); localStorage.setItem('b', 20); console.log(localStorage); - 브라우저 안에 키와 값이 저장됨 - 데이터 가져오기 // const a = local..

  • format_list_bulleted JavaScript
  • · 2023. 9. 4.
  • textsms
findIndex 함수

findIndex 함수

findIndex 함수 1. findIndex( ) 함수 - 배열 내에서 주어진 조건을 만족하는 첫 번째 요소의 인덱스를 찾는 데 사용되는 배열 메서드 - 콜백 함수를 이용하여 요소를 검색하며, 조건을 만족하는 요소를 찾으면, 해당 요소의 인덱스를 반환 ※ 조건을 만족하는 요소가 없을 시, -1을 반환 2. 예시 const todos = [ { id:10, content:"운동", }, { id:5, content:"목욕", }, { id:2, content:"공부", }, ]; function removeTodo(deleteIndex) { // index가 deleteIndex와 다른 것 들만 반환 return todos.filter((_, index) => index != deleteIndex); }..

  • format_list_bulleted JavaScript
  • · 2023. 8. 25.
  • textsms
  • navigate_before
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • navigate_next
공지사항
  • 문의 (juv6262@naver.com)
전체 카테고리
  • 분류 전체보기 (500)
    • Programming Language (87)
      • Java (65)
      • C (4)
      • Python (16)
      • R (2)
    • UI & UX (4)
      • Figma (4)
    • Front-End Study (193)
      • HTML+CSS (34)
      • HTML 사전 (6)
      • CSS 사전 (14)
      • Sass (6)
      • 반응형 웹 (8)
      • JavaScript (52)
      • TypeScript (8)
      • React (29)
      • Next.js (9)
      • Angular (1)
      • Vue.js (23)
      • Vite (2)
      • Node.js (1)
    • Back-End Study (101)
      • DBMS (28)
      • Linux (43)
      • Git & GitHub (15)
      • Express (7)
      • Postman (4)
      • REST API (2)
      • PHP (0)
      • Grafana (2)
    • Computer Science (15)
    • 정보처리기사 (76)
      • 1. 요구사항 확인 (1)
      • 2. 화면 설계 (1)
      • 3. 데이터 입출력 구현 (1)
      • 4. 통합 구현 (1)
      • 5. 인터페이스 구현 (1)
      • 6. 프로그래밍 언어 활용 (1)
      • 7. SQL 응용 (1)
      • 8. 서버 프로그램 관리 (1)
      • 9. 소프트웨어 개발 보안 구축 (1)
      • 10. 애플리케이션 테스트 관리 (1)
      • 11. 응용 SW 기초 기술 활용 (1)
      • DB (65)
    • 잡다한 말 (6)
    • 기타 (5)
    • 내가 읽은 책 (5)
    • 없어진 글모음 (7)
최근 글
인기 글
최근 댓글
태그
  • #Java
  • #react
  • #Vue.js
  • #html+css
  • #DBMS
  • #정보처리기사
  • #Git & GitHub
  • #JavaScript
  • #Computer Science
  • #리눅스
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.