seasons = ["봄", "여름", "가을", "겨울"]
seasons.length
{
for (let i = 0; i < seasons.length; ++i)
console.log(i)
}
{ // ES6+
for (let i in seasons)
console.log(i)
}
{
for (let i = 0; i < seasons.length; ++i)
console.log(seasons[i])
}
{ // ES6+
for (let v of seasons)
console.log(v)
}
mixedArr = [1,"a","b",2,3,"c"]
typeof mixedArr[0]
typeof mixedArr[1]
{ // 배열의 인덱스도 for (... in ..) 으로 얻어오면 string 으로 취급된다
for (let i in mixedArr)
console.log(typeof i)
}
{
for (let v of mixedArr)
console.log(typeof v)
}
nums = [1,2,3]
chars = ["a","b","c"]
// nums.concat(chars) // 새로운 배열 객체 생성됨
// chars.concat(nums) // 새로운 배열 객체 생성됨
// nums.join()
// nums.join('-')
// nums.join(' - ')
cs1 = ["a","b","c"]
// cs1.push("d") // 기존의 chars 변화
cs1
chars
ns1 = [1,2,3]
// ns1.push(4,5) // 기존의 nums 변화
ns1
{ // Array의 push, pop 메소드로 (배열 맨 끝에)
let arr = [1,2,3,4]
console.log(arr)
arr.push(5,6,7)
console.log(arr)
arr.pop()
console.log(arr)
arr.pop()
console.log(arr)
arr.pop()
console.log(arr)
}
{ // Array의 unshift, shift 메소드 (배열 맨 앞에)
let arr = ["a","b","c"]
console.log(arr)
arr.shift() // 맨 앞에서 하나를 빼온다
console.log(arr)
arr.unshift("z") // 맨 앞에 집어넣는다
console.log(arr)
arr.unshift("x","y") // 맨 앞에 집어넣는다
console.log(arr)
}
{ // Array의 splice 메소드 (원하는 위치에 삭제/추가) - 인자 1개일 때
let numbers = [0,1,2,3,4,5]
console.log( numbers )
let ns = numbers.splice(2) // 인덱스 2 (세번째 요소) 이후 끝까지 빼내옴
console.log( ns )
console.log( numbers )
}
{ // Array의 splice 메소드 (원하는 위치에 삭제/추가) - 인자 2개일 때
let chars = ["a","b","c","d","e","f"]
console.log( chars )
let cs = chars.splice(2,3) // 인덱스 2부터 (세번째 요소부터) 3개를 빼내옴
console.log( cs )
console.log( chars )
}
{ // Array의 splice 메소드 (원하는 위치에 삭제/추가) - 인자 3개일 이상일 때
let chars = ["a","b","c","d","e","f"]
console.log( chars )
// 인덱스 2부터 (세번째 요소부터) 3개를 빼내오고, 그 자리에 "x","y"를 추가해줌
let cs = chars.splice(2,3,"x","y")
console.log( cs )
console.log( chars )
}
{ // Array의 slice 메소드 - 원하는 위치에서 가져오지만 원래 배열을 변화 없음
let chars = ["a","b","c","d","e","f"]
console.log( chars )
let cs = chars.slice(2) // 인덱스 2부터 (세번째 요소부터) 끝까지 복사해옴
console.log( cs )
console.log( chars )
}
{ // Array의 slice 메소드 - 원하는 위치에서 가져오지만 원래 배열을 변화 없음
let chars = ["a","b","c","d","e","f"]
console.log( chars )
let cs = chars.slice(2,5) // 인덱스 2부터 5직전까지 (세번째에서 다섯번째 요소까지) 복사해옴
console.log( cs )
console.log( chars )
}
{ // Array의 sort 메소드
let ns = [2,5,1,3,4]
ns.sort()
console.log( ns )
}
{ // Array의 sort 메소드 - compareFunction 활용 (기본동작 오름차순)
let ns = [2,5,1,3,4]
ns.sort( (a,b) => (a===b)? 0: (a<b)? -1: 1 )
console.log( ns )
}
{ // Array의 sort 메소드 - compareFunction 활용 (내림차순)
let ns = [2,5,1,3,4]
ns.sort( (a,b) => (a===b)? 0: (a>b)? -1: 1 )
console.log( ns )
}
{ // Array의 every 메소드 - 어떤 성질을 검사하는 함수를 받아서 배열의 모든 요소가 그 성질을 만족하는지
let ns = [2,4,6,8,10]
let even = x => x % 2 === 0
return ns.every( even )
}
{ // Array의 filter 메소드 - 어떤 성질을 검사하는 함수를 받아서 만족하는 요소만 골라서 새로운 배열을 만든다
let ns = [1,2,3,4,5,6,7,8,9,10]
let even = x => x%2 === 0
return ns.filter( even )
}
{ // Array의 forEach 메소드 - 함수를 받아서 각각의 모든 요소를 인자로 넘겨서 호출
let cs = ["a","b","c","d","e"]
cs.forEach( x => console.log(x) )
}
{ // Array의 map 메소드 - 함수를 받아서 모든 요소를 인자로 호출한 결과값을 모은 새로운 배열을 만든다
let ns = [1,2,3,4,5]
return ns.map( x => x*x )
}
{ // Array의 reverse 메소드 - 배열의 순서를 반대로
let cs = ["a","b","c","d","e"]
cs.reverse()
return cs
}
{ // 강의 영상 관련 과제 첫번째 문제 - 이름(name)을 기준으로 가나다순으로 정렬 (3점)
let persons = [ {name:"홍길동", age:45}, {name:"김연아", age:30}, {name:"이순신", age:54} ]
return persons.sort( /* 여기에 적절한 함수 작성 */ )
}
{ // 강의 영상 관련 과제 두번째 문제 - 나이(age)를 기준으로 오름차순으로 정렬 (3점)
let persons = [ {name:"홍길동", age:45}, {name:"김연아", age:30}, {name:"이순신", age:54} ]
return persons.sort( /* 여기에 적절한 함수 작성 */ )
}
[1,2,3,4].reduce( (x,y) => x+y ) // 연산하는 함수만 넘길 때
[].reduce( (x,y) => x+y ) // 연산하는 함수만 넘겼을 때는 초기값이 없기 때문에 원소가 없는 빈 배열에 대해서는 에러
[].reduce( (x,y) => x+y, 0 ) // 빈 배열에 대해서도 동작하게 하려면 시작값을 지정
[1,2,3,4].reduce( (x,y) => x+y, 10000 ) // 연산자 함수와 초기값을 넘길 때
[1,2,3,4].reduce( (x,y) => x*y ) // 곱셈을 예로 연습해 봅시다
[].reduce( (x,y) => x*y )
[].reduce( (x,y) => x*y, 1 )
[1,2,3,4].reduce( (x,y) => x*y, 1 )
[1,2,3,4].reduce( (x,y) => x*y, 100 )
["a","b","c"].join()
["a","b","c"].reduce( (x,y) => x+","+y )
// join과 같은 일을 하는 함수를 내가 직접 reduce를 이용해서 짠다
myjoin = (arr) => (arr.length===0)? "": arr.reduce( (x,y)=>x+","+y )
myjoin( [1,2,3,4] )
myjoin( [] )
myarr = ["x1","x2","x3","x4"]
op = (x,y) => "("+x+"⚝"+y+")" // 가운데에 별표모양을 써주고 괄호안에 넣어주는 연산자
op("z1","z2")
flip = (op) => (x,y) => op(y,x) // 고차함수(higher-order function) 정의
op2 = flip(op)
op2("z1","z2")
myarr
// Array의 reduce 메소드 (foldl에 해당)
myarr.reduce(op,"v0")
[1,2,3,4].reduce( (x,y) => x-y, 100 ) // ((((100-1)-2)-3)-4)
// Array의 reduceRight 메소드 (foldr에 정확히 해당하지는 않음)
myarr.reduceRight(op,"v0")
// reduceRight은 뒤집어준 다음에 reduce를 하는 것과 같다
myarr.map( x => x ).reverse().reduce(op,"v0") // reduceRight 과 같다
// Array의 reduceRight 메소드를 foldr에 해당하게 하려면
myarr.reduceRight(flip(op),"v0")
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
