Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- TS
- react
- 배열중복요소제거
- 글또10기
- Spring
- 슬라이딩윈도우
- 리액트네이티브아이콘
- map
- mainapplication.kt
- supabase 페이지네이션
- 상속
- generic
- array
- async
- set
- javascript
- 이진탐색
- app.post
- reactnative
- app:compiledebugkotlin
- 페이지네이션
- 안드로이드빌드에러
- extends
- Filter
- materialicons
- meatadata
- 타입스크립트
- interface
- Next.js
- 스크롤이벤트
Archives
- Today
- Total
rhanziy
javascript. Array배열2(filter, map, reduce, ...) 본문
'use strict';
{
// 배열 값을 join하여 출력, join(seperator)는 optional
// 배열의 모든 요소를 연결해 하나의 문자열로 만든다.
const fruits = ['apple','banana','orange'];
const result = fruits.join(' and ');
console.log(result);
}
{
// make an array out of a string 문자열을 배열로 변환
// seperator 필수! 어떤걸 기준으로 쪼갤지
// limit은 optional > 출력 개수
const fruits = '🍕,🍔,🍟,🌭';
const result = fruits.split(',');
console.log(result);
}
{
// make this array reverse
const array = [1, 2, 3, 4, 5];
console.log(array.reverse());
console.log(array); // -> 결과값도 역순으로 나온다.
}
{
// make new array without the first two elements
const array = [1, 2, 3, 4, 5];
const result = array.slice(2,5);
// This is exclusive of the element at the index 'end'.
// endnum 은 optional, 마지막 번호는 배제됨!
console.log(result);
console.log(array);
// *splice는 배열 자체를 수정, slice는 배열에서 원하는 부분만 받아올수있다.
}
class Student {
constructor(name, age, enrolled, score){
this.name = name;
this.age = age;
this.enrolled = enrolled;
this.score = score;
}
}
const students = [
new Student('A', 29, true, 45),
new Student('B', 28, false, 80),
new Student('C', 30, true, 90),
new Student('D', 40, false, 66),
new Student('E', 18, true, 88),
];
{
// find a student with the core 90
// Returns the value of the first element in the array where predicate is true
const result = students.find((student) => student.score == 90);
console.log(result);
}
{
// make an array of enrolled students
const result = students.filter((student) => student.enrolled);
console.log(result);
}
{
// make an array containing only the students' scores
// 지정된 콜뱀함수를 호출하면서 새로운 값으로 mapping
// 콜백함수로 전달되는 인자는 맘대로 적어도 되지만... 이해하기 쉽게 적기!
const result = students.map((student) => student.score);
console.log(result);
}
{
//check if there is a student with the score lower than 50
// 하나라도 조건에 만족되는 사람이 있으면 some, 결과 값은 boolean
const result = students.some((student) => student.score < 50);
console.log(result);
// 모든 학생들의 점수가 50점보다 낮으면 true
const result2 = students.every((student) => student.score < 50);
console.log(result2);
}
{
//compute students' average score
// 배열을 돌며 배열의 값을 누적할 때 사용, prev는 return이 필요
// , 0 은 0부터 시작한다는 뜻!
// reduceRight은 배열의 뒤에서부터 시작
const result = students.reduce((prev, curr) => prev + curr.score
, 0);
console.log(result / 5);
}
{
// make a string containing all the scores
const result = students
.map(student => student.score) // 학생들을 점수로 mapping
.filter(score => score >= 50) // 50점 이상인 score filtering
.join();
console.log(result);
}
{
// sorted in ascending order result should be:'45, 66, 80, 88, 90'
// sort 콜백함수엔 a(이전값), b(현재값)가 전달 -값을 리턴하게되면
// a가 b값보다 작다는걸로 간주되어 정렬됨.
const result = students
.map((student)=> student.score)
.sort((a, b)=> a - b)
.join();
console.log(result);
}
'Html_css_js' 카테고리의 다른 글
javascript. Promise API (0) | 2022.01.29 |
---|---|
javascript. Promise (0) | 2022.01.28 |
javascript. Array배열1 (0) | 2022.01.21 |
javascript. Object객체 (0) | 2022.01.21 |
css. 미디어쿼리 분기점 (0) | 2022.01.20 |
Comments