본문 바로가기
반응형

전체 글

 (73)
[Javascript] 특정 문자 위치 찾기 indexOf 함수 Javascript에서 특정 문자 위치를 찾는 법이 여러개 있지만 그 중에서 indexOf 함수에 대해 포스팅하겠다. indexOf() Javascript의 문자열에서 특정 문자의 위치를 찾기 위해서 indexOf 함수를 사용한다. 구문 arr.indexOf(searchElement[, fromIndex]) 매개변수 searchElement : 배열에서 찾을 요소 fromIndex Optional : 검색을 시작할 색인 (기본값: 0, 인덱스가 배열의 길이보다 크거나 같은 경우 -1이 반환) 반환값 배열 내의 요소의 최초의 인덱스. 발견되지 않으면 -1. var array = [2, 9, 9]; array.indexOf(2); // 0 array.indexOf(7); // -1 array.indexOf(..
[Javascript] find, findIndex 함수 find, findIndex 함수는 조건을 만족하는 배열 요소의 값 또는 인덱스를 찾기 위해서 사용되는 함수이다. find() 배열의 요소를 순차적으로 순회하면서 조건에 일치하는 요소의 값을 즉시 반환함 만약 일치하는 경우가 없다면, underfined를 반환함 구문 arr.find(callback[, thisArg]) arr.find( 현재값 => 조건 ) 매개변수 callback : 함수 element : 현재값 index : 인덱스 findIndex() 배열의 요소를 순차적으로 순회하면서 조건에 일치하는 요소의 인덱스를 즉시 반환함 만약 일치하는 경우가 없다면, -1를 반환함 const arr1 = [ 10,20,30,40,50] const data = [ {id:1, name:'홍길동'}, {id..
[Javascirpt] filter 함수 filter 메서드는 해당 조건이 참인 요소들을 모아서 새로운 배열로 반환하는 메서드이다. 배열에서 원하는 데이터만 추출하고 싶을 때 사용하는 메서드인데, 여기서 중요한 부분은 새로운 배열을 반환해준다는 것이다. 또한 filter은 중복값을 제거해주지 않는다. filter() filter 도 map 함수와 마찬가지로 콜백함수를 인자로 받는데 모든 원소를 한번씩 돌리면서 콜백함수의 몸체부분에서 true 를 반환하는 원소들만 걸러준다. (filter결과값은 배열) 구문 arr.filter(callback(element[, index[, array]])[, thisArg]) 매개변수 callback : 함수 element : 현재값 index : 인덱스 1. arr.filter(function(현재값) => ..
[Javascript] Array map 사용법 react에서 값을 여러개 가지고 있는 배열의 모든 값을 꺼낼 때 map을 많이 사용한다. 이번 포스팅에서는 이러한 배열에서 값 꺼내는 방법 중 map( )을 다뤄보겠다. map() 배열 내의 모든 요소에 대해 실행한 callback의 결과를 모은 새로운 배열 구문 arr.map(callback(currentValue[, index[, array]])[, thisArg]) 매개변수 callback : function currentValue : 현재값 index Optional : 인덱스 1. arr.map (함수 (현재값, 인덱스) { }) 2. arr.map (function (변수, 변수) { return 값 }) 3. arr.map ( (변수, 변수) => { return 값 }) => { }을 사..
[Javascript] Array push() vs concat()비교 배열에 새로운 원소를 추가하는데 사용되는 push함수와 concat 함수에 대해 알아보았다. push() 기존 배열에 원소를 추가하여 배열의 총 길이를 리턴함 -> 원본데이터 변경됨 concat() 기존 배열을 복사한 후 원소를 추가하며, 새 배열을 리턴함 const result1 = ["apple", "orange", "banana"] const result2 = result1 result2.push("cat", "dog") console.log(Object.is(result1,result2)) //true const result3 = result1.concat("cat","dog") console.log(Object.is(result1,result3)) //false push mdn Array.pro..
[Javascript] 화살표 함수 함수 표현식보다 단순하고 간결한 문법으로 함수를 만드는 방법이 바로 화살표 함수이다. 중괄호 없이 작성: (...args) => expression : 함수는 이 표현식을 평가하고, 평가 결과를 반환함 중괄호와 함께 작성: (...args) => { body } : 본문이 여러 줄로 구성되었다면 중괄호를 사용해야함. 다만, 이 경우는 반드시 return 지시자를 사용해 반환 값을 명기해 주어야 한다. function ask(question, yes, no) { if (confirm(question)) yes() else no(); } ask( "동의하십니까?", function() { alert("동의하셨습니다."); }, function() { alert("취소 버튼을 누르셨습니다."); } ); co..
[Javascript] 삼항 연산자와 논리 연산자 삼항연산자와 &&연산자 , || 연산자 1. 삼항연산자 조건 ? true : false 2. 논리연산자 일치 === (react에서 엄격한 비교를 수행할 때) 불일치 !== (react에서 엄격한 비교를 수행할 때) true && 결과 -> 참인 결과 ( false , null , undefined ) || 결과 -> 거짓 결과 const done1 = true const done2 = false const done3 = undefined const re1 = done1 === true ? '참':'거짓' console.log( re1 ) // 참 const re2 = done1 === true && '참의결과값' console.log( re2 ) // 참의결과값 const re3 = done1 && '..
[Javascript] 템플릿 리터널(Template Literal) 템플릿 리터럴은 일반 문자열과 비슷해보이지만 백틱(backtick) 문자 `를 사용한다. 템플릿 리터럴은 + 연산자를 사용하지 않아도 간단한 방법으로 새로운 문자열을 삽입할 수 있다. let a = 20 let b = 30 const result = `a : ${a} b: ${b} 의 합 : ${a+b}` console.log(result) //a: 20 b: 30의 합 : 50 let name = '배수지' let age = 30 let addr = '서울' const result = `${name}의 나이는 ${age}이고, 주소는 ${addr} 입니다.` console.log(result) //배수지의 나이는 30이고, 주소는 서울 입니다.
반응형

티스토리툴바