LearnFit

 YouTube, Computed Property Names in JavaScript | ES6 | ES2015

서원석님의 학습노트

Computed Property Names in JavaScript | ES6 | ES2015

#전체

#개발자

#프론트엔드

#javascript

#es6

#es2015

#computed property names

#javascript objects

#es6 tutorial

#computed properties

#javascript tutorial

#javascript tutorial for beginners

#javascript functions

#javascript promises

#javascript interview questions and answers

#javascript computed

#javascript computed property

#javascript computed property names

#js computed property

#js computed property names

#learn javascript

#learn react

#tyler mcginnis

#tylermcginnis

#ui

#ui.dev

#learn es6

01:40코드 확인(영상은 재생하지마시고 코드만 봐주세요) 함수 objectify는 객체를 반환합니다. 인자로는 key, value를 받네요. 즉 { key: value }를 반환하는 함수가 됩니다. 그런데 key의 양옆에 대괄호가 사용된 것이 보이시나요? 만약 대괄호 없이 key: value가 되면 어떻게 될까요? 그것은 코드로 결과를 확인해보면 되겠죠? *objectify(test, 123);를 호출했을 때 1. [key]일 때: { test: 123 } 반환 2. key일 때: { key: 123 } 반환 즉, 대괄호로 감싸줘야만 object의 key가 함수에 입력된 값으로 설정됩니다. 일반적으로 객체 생성시에 { name: 'seo', age: 100 } 이런 식으로 하드코딩해서 key 값을 적지만 key 값을 모르는 상황에선 하드 코딩을 할 수가 없잖아요? 그럴 때 활용하는 방식이라고 생각하시면 됩니다.

✔ 학습 완료

취소

작성하기

이 학습노트가 포함된 러닝패스예요.

자바스크립트 ES6

서원석님의 다른 노트는 어때요?

서원석

의 학습노트

리액트로 이미지 미리보기 구현(feat. useState, useEffect, useRef, FileReader)

Video

⏱ 핵심 스탬프

25개

00:01

이 학습노트에서 구현하는 결과물 입니다.(파일 선택기에서 이미지 파일을 고르면 이미지 미리보기)

00:25

코드 살펴보기 시작

👍

서원석

의 학습노트

리액트 라우터 버전 6의 리다이렉트는 Navigate로 구현

Video

⏱ 핵심 스탬프

8개

00:00

해당 학습노트에서는 react router 버전6에서 redirect를 어떻게 구현하는지 소개합니다. 공식 문서: https://reactrouter.com/

00:50

react router 버전5에서 redirect를 구현하는 방법입니다. *예상 시나리오: pathname이 '/redirect'인 page 접근 시 pathname '/about'인 page로 전환됨 *특정 pathname에 redirect 로직을 등록하는 이유는 가지각색이겠지만 그 중 대표적인 용도는 로그인 여부 검사입니다. 서비스를 이용하는 유저가 로그인을 했을 경우 특정 pathname에 접근하지 못하도록 사용하는 것이죠.

👍

다시 보지않기

👋 다양한 인사이트를 읽어보고 계신가요?

나만의 학습 기록을 남기고, 관리하고 싶다면!

다양한 전문가의 멤버십 전용 콘텐츠를 보고 싶다면!

나의 학습 내용을 공유하고, 수익을 올리고 싶다면!

3초 회원가입/로그인으로, 런핏의 커뮤니티에 여러분도 함께하세요.

3초 만에 가입하기