목록2024/02 (7)
Minwoo Dev.
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bwnU2V/btsFcPYbfEP/tkr0CKO9Tlt1kKnZAeUoF0/img.png)
.every() every 메서드는 배열과 함께 사용되며, true 혹은 false를 반환한다. arr.every(실행할 함수) 기본적인 형태는 위와 같으며, 실행할 함수를 먼저 선언하여 콜백형식으로 사용하거나, every() 메서드의 인자로 직접 함수를 정의해주는 방법이 있다. every() 메서드는 배열의 각 값을 불러와 함수로 검사하여 모든 결과가 참일 경우에 참을 반환한다. 1. 함수를 따로 선언하여 콜백형태로 every() 매서드에 사용 let arr = [3, 4, 5, 6, 7, 8, 9, 10]; function biggerThanFive(num) { if (num > 5) { return num; } } const result = arr.every(biggerThanFive); conso..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bUXlSq/btsE9C63i0e/7ER5MqYaXq0KdjSr3ayu80/img.png)
.some() some 메소드는 JavaScript의 내장 함수로, 배열과 함께 사용된다. arr.some(실행할 함수) some() 메서드는 함수를 통해 배열을 순차적으로 검사한다. for~in 문처럼 자동적으로 배열의 각 값이 하나하나 검사되는 형식인 셈이다. some() 메서드의 특징은 배열의 값들 중 하나만 함수의 조건을 만족한다면, (배열값으로 함수를 실행했을 때 하나라도 참인 게 있다면) 결과는 true 가 나온다. 그리고 some() 메서드는 기본적으로 위의 형식을 가지고 있으며, 함수의 표현방식에 따라서 형태가 조금씩 달라진다. 1. 함수를 따로 정의하고 콜백함수 형식으로 some을 실행하는 경우 function isEven(num) { // 함수 선언 if (num % 2 === 0) {..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cf2hZj/btsE7n88o5X/JDJzLZkPo7J7dzSTegTCOk/img.png)
익명함수(Anonymous Function) 함수를 정의할 때, 이름을 붙이지 않고 사용하는 때가 있다. 그럴 때 사용하는 이름없는 함수가 바로 익명함수(Anonymous Function)이다. 주로 재사용하지 않고, 한번만 사용할 목적으로 생성한다. function () { console.log("HI!") } 기본적으로 위와 같이 사용한다. 함수 이름이 function 과 () 사이에 있어야 하지만, 익명함수는 이름이 없는 함수이므로 없다. 위 코드를 실행하면, 함수의 이름이 필요하다는 오류가 발생한다. 따라서, 익명함수를 사용하려면 아래 두 가지 방법을 사용해야한다. 1. 소괄호(()) 로 감싸기. 소괄호로 익명함수 전체를 감싸는 방법이다. (function () { console.log("HI!"..
Arrow Function(화살표 함수) 화살표 함수(Arrow Function) 형태는 JavaScript에서 흔히 보이는 함수의 선언 형태이다. 기본 함수 선언식 우선, 기본적으로 함수를 선언할 때 우리는 아래와 같은 형식을 사용한다. function add(a,b){ return a+b; } 위 함수는 a와 b를 더하는 함수이다. const add = function (a, b) { return a + b; } 그리고 함수는 객체임을 생각한다면 add라는 변수에 a와 b를 더하는 익명함수를 저장해주는 방식으로도 선언할 수 있다. 위의 함수 선언과 동일한 결과를 나타낸다. 여기서 익명함수는 아래 게시글을 참고하면 좋을 거 같다. [JavaScript] 익명함수(Anonymous Function) 익명..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/ciJ9xT/btsEZSCUqxf/830Q04trhxVy3MAjXI8pA1/img.png)
Array.prototype.map(실행할 함수) map() 메서드는 배열에 붙여 사용하며, 배열의 각 요소를 불러와 괄호 안의 내용을 수행하고 반환하여 새로운 배열을 만든다. 즉, return 값이 있다. 예시를 보자. 배열과 map() const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; const map = numbers.map(function (number) { return number * 3; // 3을 곱한 값을 반환 }) console.log(map); 위 코드는 1부터 10까지의 숫자가 배열로 담긴 numbers를 map을 사용하여 각 값에 3을 곱한 값을 반환하도록 하는 함수이다. 결과를 보면 map이라는 변수에 3이 곱해진 값들이 정상적으로 들어가있는 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/dLs38o/btsEHq6nauY/PyM5aSMkyZKeO0qkCCShz1/img.png)
Props 란 ? 컴포넌트(사용자 정의 태그를 만들기 위한 함수)에 속성값을 받는 매개변수 함수에서의 매개변수(Parameter)와 인수(Argument) 대부분의 프로그래밍 언어에서는 위 그림처럼 매개변수(Parameter)와 인자(Argument)가 존재한다. React에서의 Props 함수에서와 마찬가지로, React의 컴포넌트(Components)가 함수와 비슷한 목적을 지니고 있다고 했으므로 React props는 컴포넌트(Components)의 매개변수(Parameter)인 셈이다. function Header(props) { return ( {props.title} ); } function App() { return ( ); } 컴포넌트 이름 뒤에 괄호로 props라는 값이 들어간 것을 확인..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cI7RJ4/btsENTNmGWY/o4b42nuyOwkuNHigKwE1s1/img.jpg)
컴포넌트란 ? 사용자 정의 태그를 의미한다. 컴포넌트 사용의 장점 코드 양의 간소화 같은 기능의 재사용으로 인한 효율성 증가 web 위와 같은 html 태그에서, header 부분을 우리가 임의로 함수처럼 정의하여 사용하고 싶을 때, 우리는 컴포넌트를 생성한다. function Header(props) { return ( {props.title} ); } 위와 같이 Header라는 컴포넌트를 만들었고, return 값으로 우리가 묶고 싶은 태그들을 넣었다. 이로써 우리는 Header라는 태그만 작성하면 3줄의 태그들이 담긴 코드를 사용할 수 있는 것이다. 위와 같이 사용자가 정의하여 코드들을 기능별로 묶어둔 것을 컴포넌트(Components)라고 한다. 강의들에서 다들 복잡하게 설명하여 어렵게 느껴졌는데..