|
import { random } from './getRandom'
import _ from 'lodash'
import getType from './getType'
import * as R from './export_practice'
import myData from './myData.json'
import axios from 'axios'
// ์ฐ์ ์ฐ์ฐ์(arithmetic operator) + - * / %
// ํ ๋น ์ฐ์ฐ์(assignment operator) =
// ๋
ผ๋ฆฌ ์ฐ์ฐ์(logical operator)
// ์ผํญ ์ฐ์ฐ์(ternary operator) ?
// var ๋ณ์๋ let, const ๋ณ์์ ๋ค๋ฅด๊ฒ ๋ธ๋ก ๋ ๋ฒ์ ๋ฒ์๊ฐ ์๋ ํจ์ ๋ ๋ฒจ ๋ฒ์ ๋ด์์ ์ ํจํ๋ค.
function sum() {
let a = 0
for(let i = 0; i < arguments.length; i++)
a += arguments[i]
return a
}
// ํจ์์ ๊ฒฐ๊ณผ๊ฐ ๋ฐ๋ณต์ ์ผ๋ก ์ฌ์ฉ๋ ๋๋ ๊ฒฐ๊ณผ๋ฅผ ๋ณ์์ ๋ด์์ ์ฌ์ฉํ๋ ๊ฒ์ด ํจ์จ์ ์ด๋ค.
// ํธ์ด์คํ
(Hoisting)
// ํจ์ ์ ์ธ๋ถ๊ฐ ์ ํจ๋ฒ์ ์ต์๋จ์ผ๋ก ๋์ด์ฌ๋ ค์ง๋ ํ์
// ํจ์ ํธ์ถ์ ๋จผ์ ํ ํ ๋ค์ชฝ์์ ํจ์ ์ ์ธ์ ํด๋ ์ ์์ ์ผ๋ก ์๋ํ๋ค
// ํ์ด๋จธ ํจ์ (์ ์ญ ํจ์)
// setTimeout(ํจ์, ์๊ฐ): ์ผ์ ์๊ฐ ํ ํจ์ ์คํ
// setInterval(ํจ์, ์๊ฐ): ์๊ฐ ๊ฐ๊ฒฉ๋ง๋ค ํจ์ ์คํ(๋ฐ๋ณต์ ์ผ๋ก)
// clearTimeout(): ์ค์ ๋ Timeout ํจ์๋ฅผ ์ข
๋ฃ
// clearInterval(): ์ค์ ๋ Interval ํจ์๋ฅผ ์ข
๋ฃ
const timeoutTimer = setTimeout(() => {
console.log('Success!')
}, 3000)
const intervalTimer = setInterval(() => {
console.log('Repeat!')
}, 3000)
// setTimeout, setInterval ํจ์๋ ํ์ด๋จธ๋ฅผ ๋ฆฌํดํ๋๋ฐ,
// ์ด ํ์ด๋จธ๋ฅผ ๋ฆฌํด๋ฐ์์ clearTimeout์ด๋ clearInterval ํจ์์ ์ธ์๋ก ๋ฃ์ด์ฃผ๋ฉด ๋๋ค clearTimeout(timeoutTimer)
clearInterval(intervalTimer)
const h1El = document.querySelector('body h1')
h1El.addEventListener('click', () => {
clearTimeout(timeoutTimer)
//๋ง์ฝ h1 ์์๋ฅผ ํด๋ฆญํ๋ฉด timer๊ฐ ์ ์ง๋๋๋ก EventListener ์ถ๊ฐ
})
// const stopBtn = document.querySelector('.stopRepeat')
// stopBtn.addEventListener('click', () => {
// clearInterval(intervalTimer)
// // stop ๋ฒํผ์ ๋๋ฅด๋ฉด ๋ฐ๋ณต์ด ์ข
๋ฃ๋๋๋ก
// })
// ์ฝ๋ฐฑ(Callback)
// ํจ์์ ์ธ์๋ก ์ฌ์ฉ๋๋ ํจ์
// this
// ์ผ๋ฐ(Normal) ํจ์๋ ํธ์ถ ์์น์ ๋ฐ๋ผ this ์ ์!
// ํ์ดํ(Arrow) ํจ์๋ ์์ ์ด ์ ์ธ๋ ํจ์ ๋ฒ์์์ this ์ ์!
const heropy = {
name: 'Heropy',
normal: function () {
console.log(this.name)
},
wrapper: function() {
(() => {
console.log(this.name)
})()
}
}
heropy.normal()
heropy.wrapper()
//String method
//indexOf() => ์ผ์นํ๋ ๊ฐ์ด ์์ผ๋ฉด -1 ๋ฐํ
//number.toFixed()๋ String ํ์
์ผ๋ก ๋ฐํ
//Math.ceil(), Math.floor(), Math.round()
//Math.random()
const numbers = [1, 2, 3, 4]
const fruits = ['Apple', 'Banana', 'Cherry', 'Blueberry']
//Array.map์ ๊ธฐ์กด์ ๋ฐฐ์ด๊ณผ ๊ฐ์ ์์ ์์๋ฅผ ๊ฐ์ง๋ ๋ฐฐ์ด์ด ๋ง๋ค์ด์ง๋ค.
//Array.filter๋ ๊ธฐ์กด์ ๋ฐฐ์ด๋ณด๋ค ์๊ฑฐ๋ ๊ฐ์ ์์ ์์๋ฅผ ๊ฐ์ง๋ ๋ฐฐ์ด์ด ๋ง๋ค์ด์ง๋ค.
const a = numbers.map(number => number < 3) //[true, true, false, false]
const b = numbers.filter(number => number < 3) //[1, 2]
//find, findIndex
const c = fruits.find(fruit => /^C/.test(fruit)) // 'Cherry'
// fruits.find(fruit => {
// return /^C/.test(fruit)
// })
// ์ด๊ฑฐ๋ ๊ฐ์
const d = fruits.findIndex(fruit => /^C/.test(fruit)) // 2
//includes
const e = numbers.includes(3) // true
const f = fruits.includes('Heropy') // false
//push(), unshift()
//์๋ค๋ ์๋ณธ์ด ์์ ๋จ ์ฃผ์!
numbers.push(5) // [1, 2, 3, 4, 5]
//numbers ๋ฐฐ์ด ๋งจ ๋ค์ 5๋ฅผ ์ถ๊ฐํจ
numbers.unshift(0) // [0, 1, 2, 3, 4, 5]
//numbers ๋ฐฐ์ด ๋งจ ์์ 0์ ์ถ๊ฐํจ
//reverse()
//์๋ ์๋ณธ ์์ ๋จ ์ฃผ์!
numbers.reverse() // [5, 4, 3, 2, 1, 0]
numbers.reverse() // [0, 1, 2, 3 ,4, 5]
fruits.reverse() // ['Blueberry', 'Cherry', 'Banana', 'Apple']
fruits.reverse()
//.splice() ์ญ์ + ๋ผ์๋ฃ๊ธฐ
// ์๋ณธ ์์ ๋จ ์ฃผ์!
//splice(์ง์ฐ๊ธฐ ์์ํ ์ธ๋ฑ์ค ๋ฒํธ, ์ง์ธ ์์์ ๊ฐ์, ๊ทธ ์๋ฆฌ์ ์ฝ์
ํ ๋ฐ์ดํฐ ...)
numbers.splice(2, 1)
// 2๋ฒ์งธ ์์ดํ
๋ถํฐ ์์ํด์ 1๊ฐ์ ์์ดํ
์ ์ง์๋ผ
//Before : [0, 1, 2, 3, 4, 5]
//After : [0, 1, 3, 4, 5]
numbers.splice(2, 1, 99)
// 2๋ฒ์งธ ์์ดํ
๋ถํฐ ์์ํด์ 1๊ฐ์ ์์ดํ
์ ์ง์ฐ๊ณ ๊ทธ ์๋ฆฌ์ 99๋ฅผ ๋ผ์๋ฃ์ด๋ผ
//Before : [0, 1, 3, 4, 5]
//After : [0, 1, 99, 4, 5]
numbers.splice(2,1,2,3) // [0, 1, 2, 3, 4, 5]
fruits.splice(2, 0, 'Orange')
//0๊ฐ๋ฅผ ์ง์ฐ๊ณ Orange๋ฅผ ๋ฃ์์ผ๋ฏ๋ก ์ญ์ ์์ด ๋ผ์๋ฃ๋ ์๋ฏธ์
//Before : ['Apple', 'Banana', 'Cherry', 'Blueberry']
//After : ['Apple', 'Banana', 'Orange', 'Cherry', 'Blueberry']
//Object.assign
//์์ฒด์ ์ผ๋ก ์ ๊ณต๋๋ ์ ์ญ ๊ฐ์ฒด์ธ Object์ ์ ์๋ ์ ์ ๋ฉ์๋
const userAge = {
name: 'Heropy',
age: 85
}
const userEmail = {
name: 'Heropy',
email: 'thesecon@gmail.com'
}
const target = Object.assign(userAge, userEmail)
console.log(target)
console.log(userAge)
console.log(target === userAge)
const obj1 = { k: 123 }
const obj2 = { k: 123 }
console.log(obj1)
console.log(obj2)
console.log(obj1 === obj2)
// ์ false? ๊ฐ์ฒด ๋ฐ์ดํฐ๋ ๋ฉ๋ชจ๋ฆฌ ์์ ์ ์ฅ๋์ด ์๊ณ ,
// ๋ณ์๋ ๊ทธ ๋ฐ์ดํฐ์ ์ฃผ์๋ฅผ ์ฐธ์กฐ๋ฅผ ํ๊ณ ์๊ธฐ ๋๋ฌธ์
// ๋น๊ต๋ฅผ ํ๊ฒ ๋๋ฉด ์ฐธ์กฐํ๋ ๋ฉ๋ชจ๋ฆฌ ์ฃผ์๋ผ๋ฆฌ ๋น๊ต๋ฅผ ํ๊ฒ ๋๊ณ , ๊ทธ ์ฃผ์๊ฐ์ด ๋ค๋ฅด๊ธฐ ๋๋ฌธ์ false๊ฐ ๋์จ๋ค.
// ๊ฐ์ฒด ๋ด์ ๋ฐ์ดํฐ๋ฅผ ๋น๊ตํ๋ ๊ฒ ์๋!!
// ๊ทธ๋ ๋ค๋ฉด ๋ ๊ฐ ์ด์์ ๊ฐ์ฒด๋ฅผ ๊ธฐ์กด์ ๊ฐ์ฒด ์ค ํ๋์ ํฉ์น๋ ๊ฒ์ด ์๋๋ผ,
// ์๋ก์ด ๊ฐ์ฒด๋ฅผ ๋ง๋ค์ด์ ๊ฑฐ๊ธฐ์ ํฉ์น๊ณ ์ถ๋ค๋ฉด ์ด๋ป๊ฒ? const newObject = Object.assign({}, userAge, userEmail)
//์ด๋ ๊ฒ ํ๋ฉด ๊ธฐ์กด์ ๊ฐ์ฒด๋ฅผ ์์์ํค์ง ์๊ณ ๊ฐ์ฒด๋ค์ ํฉ์น ์ ์๋ค.
const userTemp = Object.assign({}, userAge, userEmail)
//๊ฐ์ฒด ๋ฐ์ดํฐ์ ํค๋ค์ ๊ฐ์ ธ์์ ๋ฐฐ์ด์ ๋ฐํ
const keys = Object.keys(userTemp)
console.log(keys)
//ํน์ ํค์ ํด๋นํ๋ value๋ง์ ๊บผ๋ผ ์ ์๋ค
console.log(userTemp['email'])
const values = keys.map(key => userTemp[key])
console.log(values)
const values_other_way = Object.values(userTemp)
console.log(values_other_way)
console.log('---------------------------------------------------')
// ๊ตฌ์กฐ ๋ถํด ํ ๋น (Destructuring assignment)
// = ๋น๊ตฌ์กฐํ ํ ๋น
const { name: userName, age, email, address = 'Korea' } = userTemp
// ์ํ๋ ์์ฑ๋ค๋ง ๊บผ๋ด์ด ๋ณ์๋ก ๋ง๋ค์ด ์ฌ์ฉํ ์ ์๋ค
// E.g, user.address
// address ๋ณ์์๋ 'Korea'๋ผ๋ ๊ธฐ๋ณธ ๊ฐ์ ์ง์ ํด์ userTemp๋ผ๋ ๊ฐ์ฒด ๋ฐ์ดํฐ์ address ์์ฑ์ด ์๋ค๋ฉด ๊ธฐ๋ณธ ๊ฐ์ด ์ง์ ๋๋ค.
// ๊บผ๋ด์จ ์์ฑ์ ๋ด์ ๋ณ์์ ์ด๋ฆ์ ์ํ๋ ๋๋ก ์ง์ ํ๊ณ ์ถ๋ค๋ฉด ์ฝ๋ก (:)๊ธฐํธ๋ฅผ ํตํด ๋ค์ ๋ช
์ํด์ฃผ๋ฉด ๋๋ค
// userName === 'Heropy'
//console.log(name) ์ด๋ ๊ฒ ํ๋ฉด ์๋ฌ๋จ
const [fruit1, fruit2, fruit3, fruit4, fruit5, fruit6] = fruits // Apple Banana Orange Cherry Blueberry undefined
// ๋ฐฐ์ด ๋ฐ์ดํฐ๋ ๊ตฌ์กฐ ๋ถํด ํ ๋น์ด ๊ฐ๋ฅํ๋ค
// ๋ฐฐ์ด ๋ฐ์ดํฐ์๋ key๊ฐ ์๊ธฐ ๋๋ฌธ์ ์์๋๋ก ๋ฐ์์จ๋ค
// ์ ๊ฐ ์ฐ์ฐ์ (Spread)
// fruits = ['Apple', 'Banana', 'Cherry', 'Orange', 'Blueberry']
console.log(...fruits) //Apple Banana Orange Cherry Blueberry
//... ๊ธฐํธ๋ฅผ ์ฌ์ฉํ๋ฉด ๋ฐฐ์ด์ ์ ์ฅ๋ ๊ฐ ์์ดํ
๋ค์ ์ ๊ฐํ ์ ์๋ค
function toObject(a, b, c) {
return {
a: a,
b: b,
c: c
}
}
console.log(toObject(...fruits))
// console.log(toObject(fruits[0], fruits[1], fruits[2])) ์ ๊ฐ๋ค
function toObject2(a, b, ...c) {
return {
a: a,
b: b,
c: c
}
}
// ๋งค๊ฐ ๋ณ์์์๋ ์ ๊ฐ ์ฐ์ฐ์๋ฅผ ์ฌ์ฉํ ์ ์๋ค
// ๋จ์ ๋ฐ์ดํฐ๋ฅผ ๋ฐฐ์ด์ ํํ๋ก ๋ฐ์์ c๋ผ๋ ๋งค๊ฐ ๋ณ์์ ๋ด์
console.log(toObject2(...fruits))
const same_as_toObject2 = (a, b, ...c) => ({a, b, c})
// ๊ฐ์ฒด ๋ฐ์ดํฐ์ ์์ฑ๊ณผ ๋งค๊ฐ ๋ณ์์ ์ด๋ฆ์ด ๊ฐ์ ๋์๋ ์ฝ๋ก (:) ๋ท๋ถ๋ถ ์๋ต ๊ฐ๋ฅ
console.log(same_as_toObject2(...fruits))
console.log('---------------------------------------------------')
// ๋ฐ์ดํฐ ๋ถ๋ณ์ฑ(Immutability)
// ์์ ๋ฐ์ดํฐ: String, Number, Boolean, undefined, null
// ๋ฐ์ดํฐ ๊ฐ๋ณ์ฑ
// ์ฐธ์กฐํ ๋ฐ์ดํฐ: Object, Array, Function
// ์์ ๋ณต์ฌ(Shallow copy), ๊น์ ๋ณต์ฌ(Deep copy)
// ๋จ์ํ ๊ฐ๋ฆฌํค๋ ์ฃผ์๊ฐ๋ง ๊ฐ๊ฒ ๋ง๋ค๋ฉด ์์ ๋ณต์ฌ
// ์์ ํ ์๋ก์ด ๊ฐ์ฒด๋ฅผ ๋ง๋ค์ด์ ๋ด์ฉ๋ง ๋ณต์ฌํ๋ฉด ๊น์ ๋ณต์ฌ
// Object.assign({}, ๋ณต์ฌํ ๊ฐ์ฒด)
// copy = {...๋ณต์ฌํ ๊ฐ์ฒด}
// ๊ทธ๋ฌ๋ ์ด๋ ๊ฒ ๋ณต์ฌ๋ฅผ ํ๋ ๊ฒฝ์ฐ์๋ ๋ฌธ์ ๊ฐ ๋ฐ์ํ๋ค.
// ๊ฐ์ฒด์ ๋ฐ์ดํฐ๋ก ๋ฐฐ์ด ๋ฐ์ดํฐ๋ฅผ ๊ฐ์ง๊ณ ์๋ ๊ฒฝ์ฐ ๋ฐฐ์ด ๋ฐ์ดํฐ ์ญ์ ์ฐธ์กฐํ ๋ฐ์ดํฐ์ด๊ธฐ ๋๋ฌธ์, ์์ ๋ณต์ฌ๊ฐ ์ด๋ฃจ์ด์ง๋ค.
// lodash (low dash) _
// ํจํค์ง๋ฅผ ์ด์ฉํ ๊น์ ๋ณต์ฌ
const user_to_copy = {
name: 'Heropy',
age: 85,
emails: ['thesecon@gmail.com']
}
const copyUser = _.cloneDeep(user_to_copy) //Deep copy
console.log(copyUser === user_to_copy) // false
user_to_copy.age = 22
user_to_copy.emails.push('newmail@mail.com')
console.log(copyUser.emails === user_to_copy.emails) // false
// ๋ณต์ฌํ ์ฐธ์กฐํ ๋ฐ์ดํฐ ๋ด์ ๋ ๋ค๋ฅธ ์ฐธ์กฐํ ๋ฐ์ดํฐ๋ฅผ ๋ฐ์ดํฐ๋ก ๊ฐ์ง๊ณ ์๋ ๊ฒฝ์ฐ lodash๋ฅผ ํตํด ๊น์ ๋ณต์ฌ๋ฅผ ํ์
console.log('---------------------------------------------------')
// ๊ฐ์ ธ์ค๊ธฐ, ๋ด๋ณด๋ด๊ธฐ
// ๋ค๋ฅธ ํ์ผ๋ก ๋ฐ์ดํฐ๋ฅผ ๋ด๋ณด๋ด๋ ํต๋ก๋ Default export์ Named export 2๊ฐ์ง๊ฐ ์๋ค
// export default๋ก ์์ฑํ ํจ์๋ Default export๋ฅผ ํตํด ๋ด๋ณด๋ด์ง๊ฒ ๋๋ฉฐ ํ๋์ ํจ์๋ง ๋ด๋ณด๋ผ ์ ์๋ค.
// default ํค์๋๋ฅผ ๋นผ๊ณ ์์ฑํ ํจ์๋ ๋ฐ๋์ ํจ์์ ์ด๋ฆ์ ๊ฐ์ ธ์ผ ํ๋ฉฐ ํจ์์ ์ด๋ฆ์ ํตํด importํ ์ ์๋ค.
// ์ด ๊ฒฝ์ฐ์๋ importํ ๋ { } ์์ importํ ํจ์์ ์ด๋ฆ๋ค์ ๋์ดํด์ฃผ๋ฉด ๋๋ค.
// import * as R from './๋ถ๋ฌ์ฌ ๋ฐ์ดํฐ๊ฐ ์๋ ํ์ผ๋ช
'
// ์ด๋ ๊ฒ * ๊ธฐํธ๋ฅผ ์ฌ์ฉํ๋ฉด ๋ชจ๋ ๋ด์ฉ์ ๋ฐ์ดํฐ๋ฅผ ์ง์นญํ๋ ์์ผ๋์นด๋๋ก ์ฌ์ฉํ ์ ์๋ค.
const random_number = random()
const double_random_number = R.double(random_number)
// ์ค๋ณต ์ ๊ฑฐ _.uniq (lodash ํจํค์ง ์ฌ์ฉ)
const usersA = [
{userId: '1', name: 'Heropy'},
{userId: '2', name: 'Neo'},
]
const usersB = [
{userId: '1', name: 'Heropy'},
{userId: '3', name: 'Amy'},
]
const usersC = usersA.concat(usersB)
console.log('concat', usersC)
console.log('uniqBy', _.uniqBy(usersC, 'userId'))
// uniqBy๋ ํ๋์ ๋ฐฐ์ด ๋ฐ์ดํฐ์์ ํน์ ํ ์์ฑ์ ์ด๋ฆ์ผ๋ก ๊ณ ์ ํ๋ฅผ ์์ผ์ฃผ๋ Method
const usersD = _.unionBy(usersA, usersB, 'userId')
console.log('unionBy', usersD)
// unionBy๋ ํฉ์น๊ธฐ ์ ์ ์ฌ๋ฌ ๊ฐ์ ๋ฐฐ์ด ๋ฐ์ดํฐ๋ฅผ ๋จผ์ ์ ์ด์ฃผ๊ณ ํฉ์น ๋ ๊ณ ์ ํ๋ฅผ ์ํฌ ์์ฑ์ ์ด๋ฆ์ ์์ฑ
console.log('---------------------------------------------------')
// _.find (lodash ํจํค์ง ์ฌ์ฉ)
const users = [
{ userId: '1', name: 'Heropy' },
{ userId: '2', name: 'Neo' },
{ userId: '3', name: 'Amy' },
{ userId: '4', name: 'Evan' },
{ userId: '5', name: 'Lewis' },
]
const foundUser = _.find(users, { name: 'Amy' })
const foundUserIndex = _.findIndex(users, { name: 'Amy' })
console.log(foundUser)
console.log('Amy\'s index: ', foundUserIndex)
// _.remove (lodash ํจํค์ง ์ฌ์ฉ)
_.remove(users, { name: 'Heropy' })
console.log('After remove', users)
console.log('---------------------------------------------------')
// JSON (JavaScript Object Notation)
// ์๋ฐ์คํฌ๋ฆฝํธ์ ๊ฐ์ฒด ํ๊ธฐ๋ฒ
// JSON์ด๋ผ๋ ํฌ๋งท์ ์ ํํ๋ ํ๋์ ๋ฌธ์ ๋ฐ์ดํฐ์ด์ง๋ง ํด์๋๋ ์์ค์ import๋ก ๊ฐ์ ธ์์ง๋ฉด ๊ฐ์ฒด ๋ฐ์ดํฐ์ฒ๋ผ ๋ณด์ฌ์ง๋ค.
const user = {
name: 'Heropy',
age: 85,
emails: [
'thesecon@gmail.com',
'neo@zilinks.com'
]
}
console.log('user', user)
const str = JSON.stringify(user)
// ๊ฐ์ฒด ๋ฐ์ดํฐ๋ฅผ JSON ํฌ๋งท์ ๋ง๊ฒ ๋ฌธ์ํ
console.log('str', str)
console.log(typeof str)
// ํ๋์ ๋ฌธ์ ๋ฐ์ดํฐ์ธ JSON์ ๊ฐ์ฒด ๋ฐ์ดํฐ์ฒ๋ผ ์ฌ์ฉํ๊ธฐ ์ํด parse ์ฌ์ฉ
const obj = JSON.parse(str)
console.log('obj', obj)
console.log('---------------------------------------------------')
// localStroage, sessionStorage
// google์ local storage mdn ๊ฒ์
// ๋ฌธ์ ๋ฐ์ดํฐ๋ก ์ ์ฅํ๋ ๊ฒ์ ๊ถ๊ณ
// JSON.stringify()๋ฅผ ์ฌ์ฉํด์ ๊ฐ์ฒด ๋ฐ์ดํฐ๋ฅผ ๋ฌธ์ ๋ฐ์ดํฐํ ์์ผ์ค
localStorage.setItem('user', JSON.stringify(user))
// ๋ก์ปฌ ์ ์ฅ์์ ์ ์ฅ๋ user ๋ฐ์ดํฐ๋ ๋ฌธ์ ๋ฐ์ดํฐํ ๋์ด ์์ผ๋ฏ๋ก
// JSON.parse()๋ฅผ ์ฌ์ฉํด์ ๊ฐ์ฒด ๋ฐ์ดํฐํ ์์ผ์ค๋ค
console.log(JSON.parse(localStorage.getItem('user')))
console.log('---------------------------------------------------')
// ๋ก์ปฌ ์ ์ฅ์์ ์ ์ฅ๋ ๋ฐ์ดํฐ ์์
// 1. ๋ฐ์ดํฐ๋ฅผ ๋ถ๋ฌ์์ ์์ ํ ํ ๊ธฐ์กด์ ํค์ ๋ฎ์ด์ฐ๊ธฐ ํ๋ค
const temp = localStorage.getItem('user')
const obj_temp = JSON.parse(temp)
obj_temp.age = 22
console.log(obj_temp)
localStorage.setItem('user', JSON.stringify(obj_temp))
localStorage.removeItem('user')
// 2. Lowdb (lodash ํจํค์ง ์ฌ์ฉ)
console.log('---------------------------------------------------')
function fetchMovies() {
axios
.get('https://www.omdbapi.com/?apikey=7035c60c&s=frozen')
.then(res => {
console.log(res)
const h1El = document.querySelector('h1')
const imgEl = document.querySelector('img')
h1El.textContent = res.data.Search[0].Title
imgEl.src = res.data.Search[0].Poster
})
}
fetchMovies()
|
cs |
728x90
'๊ฐ๋ฐ > HTML, CSS, JS' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
์ ์ ํ์ผ ์ฐ๊ฒฐ (0) | 2023.02.13 |
---|---|
๋ฒ๋ค๋ฌ ๊ฐ์ (0) | 2023.02.13 |
Type annotation (0) | 2023.02.04 |
BEM (0) | 2023.01.13 |
๋ฉ์๋ ์ฒด์ด๋(Method Chaining) (0) | 2023.01.12 |