trim 함수

trim 함수 1. trim( ) 함수 - 문자열의 앞과 뒤에 있는 공백(space, tab, 줄바꿈 등)을 제거하는 메서드 - 문자열을 가공할 때, 유용하게 사용 가능 2. 예시 const str = " Hello, World! "; const trimmedStr = str.trim(); console.log(trimmedStr); // "Hello, World!"

• format_list_bulleted Front-End Study/JavaScript
• · 2023. 8. 8.
• textsms

preventDefault 함수

preventDefault 함수 1. preventDefault( )함수 - JavaScript에서 이벤트 처리를 제어하는 데 사용되는 메서드 - 주로 웹 페이지에서 발생하는 기본 동작(URL 이동, 페이지 세로고침 등)을 막고자 할 때, 사용 - 이는 이벤트 객체에 속한 메서드이며, 이벤트 처리 함수내에서 호출됨 - 호출 시, 해당 이벤트의 기본 동작이 막히게 되며, 이후 원하는 동작 수행 가능

• format_list_bulleted Front-End Study/JavaScript
• · 2023. 8. 7.
• textsms

map 함수

map 함수 1. map( ) 함수 - 배열(Array)의 각 요소에 대해 주어진 함수를 호출하여, 새로운 배열을 생성하는 함수 2. map( ) 함수 구문 - function : 배열의 각 요소에 대해 실행될 함수 (3개의 매개변수를 가짐) - currentValue : 현재 처리 중인 요소의 값 - index : 현재 요소의 인덱스 - array : map( ) 함수가 호출된 배열 자체 - thisArg : function 내부에서 사용할 this의 값 (선택사항) array.map(function(currentValue, index, array) { // 변환 또는 가공 작업을 수행하는 코드 }, thisArg); 3. 예시 const numbers = [1,2,3,4,5]; const twiceN..

• format_list_bulleted Front-End Study/JavaScript
• · 2023. 8. 7.
• textsms

props

props 1. props - React 라이브러리를 사용하는 컴포넌트 기반의 웹 애플리케이션에서 사용되는 용어 - React 컴포넌트는 함수 or 클래스 형태로 정의될 수 있으며, 이들은 속성을 받아들일 수 있음 - 이러한 속성들은 컴포넌트 내부에서 사용되어, 컴포넌트의 동작 or 표시 내용을 결정하는데 활용 2. 사용방법 - ProductListItem.js import React, { useState } from "react"; function ProductListItem(props) { // props를 사용하여, 데이터 전달 const imgNo = props.imgNo; const productName = props.name; const productPriceFormatted = props.p..

• format_list_bulleted Front-End Study/React
• · 2023. 8. 2.
• textsms

JSX

JSX 1. JSX (JavaScript XML) - React와 같은 JavaScript 라이브러리를 위해 만들어진 확장 문법 - JavaScript 코드 안에서 XML과 비슷한 형태의 마크업을 작성할 수 있음 2. JSX의 특징 - JavaScript의 확장 문법이기 때문에, JavaScript 코드와 매우 유사 - XML과 비슷한 구조를 가지고 있어, 태그들을 사용하여 컴포넌트를 정의 및 중첩 가능 - JSX 조각을 별도의 변수로 분리 가능 3. 예시 - NumberCounter.js import React, { useState } from "react"; const NumberCounter = () => { const [no, setNo] = useState(0); // 별도의 변수로 분리 con..

• format_list_bulleted Front-End Study/React
• · 2023. 7. 28.
• textsms

setTimeout 함수

setTimeout 함수 1. setTimeout 함수 - 비동기적인 실행을 할 때, 사용되는 타이머 함수 - 특정 코드 블록을 지정된 시간 후에 실행할 수 있음 2. setTimeout 함수의 구문 - callback : 지연 후 실행될 함수 - delay : 실행을 지연시킬 시간을 밀리초 단위로 정수값으로 지정 - arg1, arg2, ... : 콜백 함수에 전달할 인수들 setTimeout(callback, delay, arg1, arg2, ...); 3. 예시 function hello() { console.log("실행3"); } // 실행3은 바로 실행되지 않고, 3초 뒤에 실행됨 setTimeout(hello, 3000); console.log("실행1"); console.log("실행2")

• format_list_bulleted Front-End Study/JavaScript
• · 2023. 7. 27.
• textsms