hwlink

Number.isInteger() Number.isInteger() 메서드는 주어진 값이 정수인지 판별합니다. 매개변수로 값을 받고 반환값으로는 Boolean을 반환합니다. const value = '1' Number.isInteger(value); // True const value2 = 1 Number.isInteger(value); // False 해당코드는 리액트에서 선택한 배열을 선택해주어 이벤트를 발생시키는 로직입니다. 기존코드 CompareBox 자식 컴포넌트로 내려주는 부모 컴포넌트 const [currTarget, setCurrTarget] = useState(null) . . . . 위 코드에서 refImage 안에 currTarget은 초기값이 null로 선언되어 있습니..

Coding/JS 2022. 5. 12. 19:23

자바스크립트에서 배열 요소의 index 값을 가져오는 방법으론 Array[index]이가 있습니다. 배열의 첫 번째 요소는 Array[0]으로 접근하고, 배열의 마지막 요소는 Array[Array.length-1]로 접근할 수 있습니다. 배열 요소에 접근하기 위해 사용할 수 있는 인덱스는 0 ~ Array.length-1 까지입니다. 이외의 배열 요소 접근 인덱스는 undefined를 반환합니다. 자바스크립트에선 Python 같이 Array[-1] 과 같은 접근 방식은 사용할 수 없습니다. Array.prototype.at() 해당 매서드를 사용하여 음수값으로 index 값을 가져올 수 있습니다. const arr = [1,2,3,4]; arr.at(-1) //4 array[-N] === array[ar..

Coding/JS 2022. 4. 27. 21:05

JSON, Javascript Object JS Object: JS Engine 메모리 안에 있는 데이터 구조 JSON(JavaScript Object Notation): 객체의 내용을 기술하기 위한 text파일(확장자명 .json) 클라이언트, 서버 HTTP 통신 시에는 JSON으로 송수신한다. 자바스크립트에 내장된 Convert 해주는 method. JSON to JS Object Method: JSON.parse() JS Object to JSON: JSON.stringify() const str=`{"data":[{"name":"joo","info":["man","322"]}]}`; const obj = {data:[{name:'joo',info:['man','..

Coding/JS 2022. 4. 24. 21:13

📌 호이스팅 JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다. 반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다. -MDN 호이스팅을 이해 하기 전에 먼저 변수의 유효범위(block scope) 에 대해서 알아야 합니다. 1. 변수 유효범위 프로그램에서 어떤 변수가 정의되어 있는 영역 자바스크립트 변수 유효범위는 변수를 어디에서 접근 할 수 있는지를 가리킵니다. 전역변수는 자바스크립트 코드 전체에 걸쳐 접근 가능하며, 어떤 함수 안에서 선언된 변수는 오직 해당 함수 몸체 안에서만 접근 가능합니다. 함..

Coding/JS 2022. 2. 20. 00:53

정의 구문 내에서 프로그래밍 언어를 읽거나 표현하는 일을 더 쉽게 할 수 있도록 설계되었다. Syntactic Sugar 인간이 사용하기에 언어를 더욱 간결하게 만듭니다. 중복되는 로직을 더 명확하고 간결하게 표현하거나 일부 사람들이 선호하는 대체 스타일로 표현할 수 있습니다. Ex. Suger가 적용되지 않은 방법과 적용된 방법을 나열하겠습니다. 1. 삼항연산자 - Sugar 없는 표현 var a; if(SomeFunction() == 2){ a = 4; } else{ a = 9 } - Suger 적용된 표현 var a; (SomeFunction() == 2) ? a = 4 : a = 9 2. for - Sugar 없는 표현 var i = 0; while (i < num_rows) { j = 0; wh..

Coding/JS 2022. 1. 9. 14:10

:: DOM? DOM(Document Object Model)은 웹 페이지에 대한 인터페이스이다. 기본적으로 여러 프로그램들이 페이지의 콘텐츠 및 구조, 그리고 스타일을 읽고 조작할 수 있도록 API를 제공합니다. 먼저 DOM을 이해하기 전에 웹 페이지가 어떻게 빌드 되는지 살펴보겠습니다. :: DOM 원리 역할 1. HTML 내용을 브라우저에 표시하게 해준다. 웹 브라우저가 원본 HTML 문서를 읽어들인 후, 스타일을 입히고 대화형 페이지로 만들어 뷰 포트에 표시하기까지의 과정을 “Critical Rendering Path”라고 합니다. 1단계 브라우저는 읽어들인 문서를 파싱하여 최종적으로 어떤 내용을 페이지에 렌더링할지 결정. 2단계 브라우저는 해당 렌더링을 수행. \1번째 과정을 거치면 “렌더 트리..

Coding/JS 2022. 1. 2. 16:09

Problem 자바 스크립트는 동기적 언어인데 아래의 코드를 실행하면 1번, 2번, 3번 순으로 실행되야하는게 맞지만 실제 콘솔에서는 1번,3번,2번 순으로 실행된다. JS를 처음 사용할 때에는 무지성으로 사용하여 궁금하지 않았었는데 이제는 스스로 코드를 칠 때 이해가 되지 않아 자바스크립트의 동작 원리를 간단히 정리하려고 한다. console.log('1번') setTimeout(function() { console.log('2번'); }, 0); console.log('3번') 1. JS ENGINE JavaScript 엔진은 Memory Heap, Call Stack으로 구성되어 있다. JavaScript 엔진 중 가장 인기 있는건 크롬의 V8 엔진입니다. V8 /엔진은 Node.js 내부에서도 사..

Coding/JS 2021. 12. 31. 21:44

Q.find_longest_word 함수를 만들어 주세요. 주어진 리스트 안에 있는 단어 중 가장 긴 단어를 찾을 수 있도록 함수를 완성해주세요. function find_longest_word(arr){ let max = arr[0]; for(let i=1; i max.length){ max = arr[i]; } } return max; } console.log(find_longest_word(["PHP", "Exercises", "Backend"])) 1차로 기준이 되는 max라는 변수를 지정해두고 배열값들은 순회하며 비교해주어 초기값보다 큰 값만 max에 담아 반환해주는 함수를 구성했다. 동기중 sort 매서드를 이용하여 훨씬 간..

Coding/JS 2021. 11. 13. 17:14