πŸ“š
TIL
  • README
  • Git
    • Basic
    • Remote Repository
    • Log & Diff
    • Rebase&Cherri-Pick
    • git-flow
  • DevOps
    • Monolithic vs MSA
    • Jenkins μ‹œμž‘ν•˜κΈ°
    • Airflow μ‹œμž‘ν•˜κΈ°
    • Airflow μ‹œμž‘ν•˜κΈ°
    • Build Tools
      • maven
  • 개발 방법둠
    • TDD
  • Spring
    • IoC
    • Is Spring Bean Thread-Safe?
    • Spring Singleton
    • Component Scan
    • Spring Annotation
    • 의쑴 관계 μ£Όμž…(DI)
    • Lombok ν™œμš©ν•˜κΈ°
    • Bean 생λͺ…주기와 콜백
    • Bean Scope
    • AOP(1) - AOPλž€
    • AOP(2) - Aop Proxy
    • AOP(3) - Dynamic Proxy
    • AOP(4) - AspectJ
    • POJO
    • Spring μ„œλΉ„μŠ€ ꡬ쑰
    • Transaction
    • JPAλž€?
    • JPA Entity
    • Spring Data JPA
    • Spring Data Specification
    • Model Mapping
    • Cache
    • restTemplate
    • YAML 파일 μ„€μ •
    • Spring Boot
      • H2 DB μ„€μ •
      • 닀쀑 λ°μ΄ν„°λ² μ΄μŠ€ μ„€μ •
      • Mybatis μ—°λ™ν•˜κΈ°
    • Spring Batch
      • Batch μ‹œμž‘ν•΄λ³΄κΈ°
      • Batch Job Flow
      • Job
      • Step
      • Batch Scope & Job Parameter
      • JobRepository와 λ©”νƒ€ν…Œμ΄λΈ”
      • Chunk μ§€ν–₯ ν”„λ‘œκ·Έλž˜λ°
      • ItemReader
      • ItemProcessor
      • ItemWriter
      • Batch Schedular
      • Job별 Beanλ“±λ‘ν•˜κΈ°
      • Batch κ΅¬ν˜„μ‹œ λ°œμƒν•œ 였λ₯˜ 정리
      • Spring Batch Scaling
        • Multithread Jobκ΅¬ν˜„μ‹œ μ΄μŠˆμ‚¬ν•­
    • Spring test
      • Junit5
        • ν…ŒμŠ€νŠΈ 이름 ν‘œκΈ°
        • ν…ŒμŠ€νŠΈ κ·Έλ£Ή μ‚¬μ΄μ˜ 관계
        • νƒœκ·Έμ™€ 필터링
        • 동적 ν…ŒμŠ€νŠΈ
        • ν…ŒμŠ€νŠΈ LifeCycle
        • ν…ŒμŠ€νŠΈ λ©”μ„œλ“œ
        • ν…ŒμŠ€νŠΈ μˆœμ„œ
        • AssertJ
        • ν…ŒμŠ€νŠΈ 병렬 μ‹€ν–‰
        • AssertJ
        • Mock
      • Spring Boot Test DB 뢄리
      • Spring Batch Test
  • Web Application
    • Web Server & WAS
    • κ΄€λ ¨ κ°œλ… - HTTP API, HTML, CSR, SSR
    • Servlet
    • JSP
    • Cookie And Session
    • μ˜ˆμ™ΈνŽ˜μ΄μ§€
    • Java Bean
    • JDBC
    • Connection Pool
    • 파일 μ—…λ‘œλ“œ
    • Expression Language
    • JSTL
    • FrontControllerνŒ¨ν„΄ Command νŒ¨ν„΄
    • Forwarding
    • MVC
    • νšŒμ›κ°€μž…μ˜ˆμ œ
    • μ°Έκ³ 
      • κ°œλ°œν™˜κ²½μ„€μ •
  • Java+
    • SOAP/WSDL vs REST
    • WSDL을 JAVA둜 λ³€ν™˜ν•˜κΈ°
    • SOAP 톡신 OPEN API둜 κ°œλ°œν•΄λ³΄κΈ°
  • Java
    • Basic
      • λ³€μˆ˜μ™€ νƒ€μž…
      • μ—°μ‚°μž
      • 쑰건문과 반볡문
      • μ°Έμ‘° νƒ€μž…
      • 클래슀
      • 상속(Inheritance)
      • μΈν„°νŽ˜μ΄μŠ€(Interface)
      • 쀑첩 ν΄λž˜μŠ€μ™€ 쀑첩 μΈν„°νŽ˜μ΄μŠ€
      • μ˜ˆμ™Έ 처리
      • API - Object, System, Class, Math, Wrapper
      • API - String, StringBuffer, StringBuilder
      • Thread
      • Generic
      • Lambda
      • Collection - List, Set
      • Collection - Map
      • Collection - Tree
      • Collection - Stack, Queue
      • Stream
      • Reflection
      • μ •κ·œν‘œν˜„μ‹
      • GUI
      • UML
      • Serializable
    • Advanced
      • OutOfMemoryError
      • AutoValue
      • meta-annotation
        • @Retention
        • @Target
        • @Repeatable
    • Effective Java 3/E
      • ITEM 1: Static Factory Method(정적 λ©”μ†Œλ“œ)
      • ITEM 2: Builder Pattern
      • ITEM 3: Singleton
      • ITEM 4: Private Constructor
      • ITEM 5: Dependency Injection
      • ITEM 6: Avoid Unnecessary Object
      • ITEM 7: Eliminate Object Reference
      • ITEM 8: Avoid finalizer and cleaner
      • ITEM 9: try-with-resources
      • ITEM 10: The gerneral contract when overriding equlas
      • ITEM 11: Overriding hashCode
      • ITEM 12: overriding toString
      • ITEM 13: overriding clone judiciously
      • ITEM 14: Consider implementing comparable
      • ITEM 15: ν΄λž˜μŠ€μ™€ λ©€λ²„μ˜ 접근을 μ΅œμ†Œν™”ν•΄λΌ
      • ITEM 16: Use Accessor methods
      • ITEM 17: λ³€κ²½ κ°€λŠ₯성을 μ΅œμ†Œν™”ν•΄λΌ(λΆˆλ³€ 클래슀)
      • ITEM 18: 상속보단 μ»΄ν¬μ§€μ…˜μ„ μ‚¬μš©ν•΄λΌ
      • ITEM 19: 상속을 κ³ λ €ν•΄ μ„€κ³„ν•˜κ³  λ¬Έμ„œν™”ν•΄λΌ
      • ITEM 20: 좔상 ν΄λž˜μŠ€λ³΄λ‹€ μΈν„°νŽ˜μ΄μŠ€λ₯Ό μš°μ„ ν•˜λΌ
      • ITEM 21: μΈν„°νŽ˜μ΄μŠ€λŠ” κ΅¬ν˜„ν•˜λŠ” μͺ½μ„ 생각해 섀계해라.
      • ITEM 22: μΈν„°νŽ˜μ΄μŠ€λŠ” νƒ€μž…μ„ μ •μ˜ν•˜λŠ” μš©λ„λ‘œλ§Œ μ‚¬μš©ν•΄λΌ
      • ITEM 23: νƒœκ·Έ 달린 ν΄λž˜μŠ€λ³΄λ‹€ 클래슀 계측ꡬ쑰λ₯Ό ν™œμš©ν•΄λΌ
      • ITEM 24: 멀버 ν΄λž˜μŠ€λŠ” λ˜λ„λ‘ static으둜 κ΅¬ν˜„ν•΄λΌ
      • ITEM 25: ν†±λ ˆλ²¨ ν΄λž˜μŠ€λŠ” ν•œ νŒŒμΌμ— ν•˜λ‚˜λ§Œ 생성해라.
      • ITEM 26: Raw type은 μ‚¬μš©ν•˜μ§€ 마라
      • ITEM 27: 비검사 κ²½κ³ λ₯Ό μ œκ±°ν•΄λΌ
      • ITEM 28: λ°°μ—΄λ³΄λ‹€λŠ” 리슀트λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 29: 이왕이면 μ œλ„€λ¦­ νƒ€μž…μœΌλ‘œ λ§Œλ“€μ–΄λΌ
      • ITEM 30: 이왕이면 μ œλ„€λ¦­ λ©”μ„œλ“œλ‘œ λ§Œλ“€μ–΄λΌ
      • ITEM 31 : ν•œμ •μ  μ™€μΌλ“œμΉ΄λ“œλ₯Ό μ‚¬μš©ν•΄ API μœ μ—°μ„±μ„ 높여라
      • ITEM 32: μ œλ„€λ¦­κ³Ό κ°€λ³€μΈμˆ˜λ₯Ό ν•¨κ»˜ μ“Έ λ•ŒλŠ” 신쀑해라
      • ITEM 33: νƒ€μž… μ•ˆμ „ 이쒅 μ»¨ν…Œμ΄λ„ˆλ₯Ό 고렀해라
      • ITEM 34: int μƒμˆ˜ λŒ€μ‹  μ—΄κ±° νƒ€μž…μ„ μ‚¬μš©ν•΄λΌ
      • ITEM 35: ordinal λ©”μ„œλ“œ λŒ€μ‹  μΈμŠ€ν„΄μŠ€ ν•„λ“œλ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 36: λΉ„νŠΈ ν•„λ“œ λŒ€μ‹  EnumSet을 μ‚¬μš©ν•΄λΌ
      • ITEM 37: ordinal 인덱싱 λŒ€μ‹  EnumMap을 μ‚¬μš©ν•΄λΌ
      • TEM 38 : ν™•μž₯ν•  수 μžˆλŠ” μ—΄κ±°νƒ€μž…μ΄ ν•„μš”ν•˜λ©΄ μΈν„°νŽ˜μ΄μŠ€λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 39: λͺ…λͺ… νŒ¨ν„΄λ³΄λ‹€ μ• λ„ˆν…Œμ΄μ…˜μ„ μ‚¬μš©ν•΄λΌ
      • ITEM 40: @Override μ–΄λ…Έν…Œμ΄μ…˜μ„ μΌκ΄€λ˜κ²Œ μ‚¬μš©ν•΄λΌ
      • ITEM 41: μ •μ˜ν•˜λ €λŠ” 것이 νƒ€μž…μ΄λΌλ©΄ 마컀 μΈν„°νŽ˜μ΄μŠ€λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 42: 읡λͺ… ν΄λž˜μŠ€λ³΄λ‹€λŠ” λžŒλ‹€λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 43: λžŒλ‹€λ³΄λ‹€λŠ” λ©”μ„œλ“œ μ°Έμ‘°λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 44: ν‘œμ€€ ν•¨μˆ˜ν˜• μΈν„°νŽ˜μ΄μŠ€λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 45: μŠ€νŠΈλ¦Όμ€ μ£Όμ˜ν•΄μ„œ μ‚¬μš©ν•΄λΌ
      • ITEM 46: μŠ€νŠΈλ¦Όμ—μ„œ λΆ€μž‘μš© μ—†λŠ” ν•¨μˆ˜λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 47: λ°˜ν™˜ νƒ€μž…μœΌλ‘œλŠ” μŠ€νŠΈλ¦Όλ³΄λ‹€ μ»¬λ ‰μ…˜μ΄ λ‚«λ‹€.
      • ITEM 48: 슀트림 λ³‘λ ¬ν™”λŠ” μ£Όμ˜ν•΄μ„œ μ‚¬μš©ν•΄λΌ
      • ITEM 49: λ§€κ°œλ³€μˆ˜κ°€ μœ νš¨ν•œμ§€ 검사해라
      • ITEM 50: μ μ‹œμ— 방어적 볡사본을 λ§Œλ“€μ–΄λΌ
      • ITEM 51: λ©”μ„œλ“œ μ‹œκ·Έλ‹ˆμ²˜λ₯Ό μ‹ μ€‘νžˆ 섀계해라
      • ITEM 52: λ‹€μ€‘μ •μ˜λŠ” μ‹ μ€‘νžˆ μ‚¬μš©ν•΄λΌ
      • ITEM 53: κ°€λ³€μΈμˆ˜λŠ” μ‹ μ€‘νžˆ μ‚¬μš©ν•΄λΌ
      • ITEM 54: null이 μ•„λ‹Œ, 빈 μ»¬λ ‰μ…˜μ΄λ‚˜ 배열을 λ°˜ν™˜ν•΄λΌ
      • ITEM 55: Optional λ°˜ν™˜μ€ μ‹ μ€‘ν•˜κ²Œ 해라
      • ITEM 56: 곡개된 API μš”μ†Œμ—λŠ” 항상 주석을 μž‘μ„±ν•΄λΌ
      • ITEM 57: μ§€μ—­λ³€μˆ˜μ˜ λ²”μœ„λ₯Ό μ΅œμ†Œν™”ν•΄λΌ
      • ITEM 58: 전톡적인 for λ¬Έλ³΄λ‹€λŠ” for-each문을 μ‚¬μš©ν•΄λΌ
      • ITEM 59: 라이브러리λ₯Ό 읡히고 μ‚¬μš©ν•΄λΌ
      • ITEM 60: μ •ν™•ν•œ 닡이 ν•„μš”ν•˜λ‹€λ©΄ float와 double은 피해라
      • ITEM 61: λ°•μ‹±λœ κΈ°λ³Έ νƒ€μž…λ³΄λ‹€λŠ” κΈ°λ³Έ νƒ€μž…μ„ μ‚¬μš©ν•΄λΌ
      • ITEM 62: λ‹€λ₯Έ νƒ€μž…μ΄ μ μ ˆν•˜λ‹€λ©΄ λ¬Έμžμ—΄ μ‚¬μš©μ„ 피해라
      • ITEM 63: λ¬Έμžμ—΄ 연결은 λŠλ¦¬λ‹ˆ μ£Όμ˜ν•΄λΌ
      • ITEM 64: κ°μ²΄λŠ” μΈν„°νŽ˜μ΄μŠ€λ₯Ό μ‚¬μš©ν•΄ 참쑰해라
      • ITEM 65: λ¦¬ν”Œλ ‰μ…˜λ³΄λ‹€λŠ” μΈν„°νŽ˜μ΄μŠ€λ₯Ό μ‚¬μš©ν•΄λΌ
      • ITEM 66: λ„€μ΄ν‹°λΈŒ λ©”μ„œλ“œλŠ” μ‹ μ€‘νžˆ μ‚¬μš©ν•΄λΌ
      • ITEM 67: μ΅œμ ν™”λŠ” μ‹ μ€‘νžˆ 해라
      • ITEM 68: 일반적으둜 ν†΅μš©λ˜λŠ” λͺ…λͺ… κ·œμΉ™μ„ 따라라
    • 객체지ν–₯ 섀계 원칙(SOLID)
    • λ””μžμΈνŒ¨ν„΄
      • Strategy Pattern
      • Template Method Pattern
      • Factory Method Pattern
      • Singleton
      • Delegation
      • Proxy
      • Adapter Pattern
    • μ‹€μŠ΅
      • μΈν„°νŽ˜μ΄μŠ€ μ‹€μŠ΅ - Vehicle
      • μΈν„°νŽ˜μ΄μŠ€ μ‹€μŠ΅ - Remote
      • GUI μ‹€μŠ΅ - Calculator
      • GUI μ‹€μŠ΅ - button
      • GUI μ‹€μŠ΅ - lotto
      • Thread μ‹€μŠ΅ - μ’Œμ„μ˜ˆμ•½, 메세지보내기
    • Jar vs War
  • λ°μ΄ν„°λ² μ΄μŠ€
    • KEY
    • Index
    • Transaction
    • Trigger
    • Procedure / Function
    • Package
    • λ°μ΄ν„°λ² μ΄μŠ€ 배움터
      • λ°μ΄ν„°λ² μ΄μŠ€ μ‹œμŠ€ν…œ
      • 관계데이터 λͺ¨λΈ
      • κ΄€κ³„λŒ€μˆ˜μ™€ SQL
    • MySQL
      • Databaseλž€
      • MySQL μ‹œμž‘ν•˜κΈ°
      • MySQL Database
      • MySQL Table
      • CRUD
      • κ΄€κ³„ν˜• λ°μ΄ν„°λ² μ΄μŠ€
      • Server와 Client
    • PostgreSQL
    • NoSQL
      • Install Cassandra on mac
      • Cassandraλž€?
      • NiFiλž€
  • Algorithm
    • String
    • Recursion
    • Dynamic Programming
    • Array, Struct, Pointer
    • Math
    • Sort
    • List
    • Stack
    • Queue
    • Graph
    • Tree
    • Maze
    • AVL
    • μ΄μ§„νƒμƒ‰νŠΈλ¦¬(Binary Search Tree)
    • DFS와 BFS
    • λ‹€μ΅μŠ€νŠΈλΌ μ•Œκ³ λ¦¬μ¦˜(Dijkstra's Algorithm)
    • Red-Black 트리
    • A* μ•Œκ³ λ¦¬μ¦˜
    • Heap
    • Huffman Coding
    • Priority Queue
    • Bellman-Ford μ•Œκ³ λ¦¬μ¦˜
    • C++
      • Class
      • STL
        • STL pair
        • STL Container - Associate Container
        • STL Container - Sequence Container
        • STL Container - Container Adapter
  • JavaScript
    • JABASCRIPT BASIC
    • Shallow Copy vs Deep Copy
    • OBJECT MODEL
    • NODE
    • 동기 처리 vs 비동기 처리
    • AJAX
    • CALLBACK
    • PROMISE
    • DEFERRER
    • UNDERSCORE
    • WEBPACK
    • SCOPE
    • EXECUTION CONTEXT
    • Image Object
    • BFCacheλž€?
    • history.scrollRestoration
    • Intersection Observer
    • JWT - JSON Web Token
    • HTML vs JSON
  • Vue.js
    • ν™˜κ²½μ„€μ •
    • Vue.jsλž€?
    • Vue Instance
    • Vue Component
    • Vue Router
    • HTTP 톡신
    • Template
    • Single File Component
    • Vue Animation
    • Vuex
    • Djnago와 μ—°λ™ν•˜κΈ°
  • Backbone.js
    • Model
    • Collection
    • Sync
    • view
  • Node.js
    • Doit! - λ…Έλ“œλ‘œ λ§Œλ“€ 수 μžˆλŠ” λŒ€ν‘œμ μΈ μ„œλ²„μ™€ μš©λ„
    • Doit! - λ…Έλ“œμ— λŒ€ν•΄ μ•Œμ•„λ³΄κ³  개발 도ꡬ μ„€μΉ˜ν•˜κΈ°
    • Doit! - λ…Έλ“œ κ°„λ‹¨ν•˜κ²Œ μ‚΄νŽ΄λ³΄κΈ°
    • Doit! - λ…Έλ“œμ˜ μžλ°”μŠ€ν¬λ¦½νŠΈμ™€ μΉœν•΄μ§€κΈ°
    • Doit! - λ…Έλ“œμ˜ κΈ°λ³Έ κΈ°λŠ₯ μ•Œμ•„λ³΄κΈ°
    • Doit! - μ›Ή μ„œλ²„ λ§Œλ“€κΈ°
    • Doit! - λ°μ΄ν„°λ² μ΄μŠ€ μ‚¬μš©ν•˜κΈ°
    • Doit! - μ΅μŠ€ν”„λ ˆμŠ€ ν”„λ‘œμ νŠΈλ₯Ό λͺ¨λ“ˆν™”ν•˜κΈ°
    • Doit! - λ·° ν…œν”Œλ¦Ώ μ μš©ν•˜κΈ°
    • Doit! - 패슀포트둜 μ‚¬μš©μž μΈμ¦ν•˜κΈ°
    • Doit! - μ±„νŒ…μ„œλ²„ λ§Œλ“€κΈ°
    • Doit! - JSON-RPC μ„œλ²„ λ§Œλ“€κΈ°
  • Python
    • Warning-Could not import the lzma module
    • Pandas
      • Pandas 자료ꡬ쑰
      • Pandas 데이터 μž…μΆœλ ₯
      • DataFrame Data μ‚΄νŽ΄λ³΄κΈ°
      • μ‹œκ°ν™” 도ꡬ - Matplotlib
  • ML
    • μΆ”μ²œ μ‹œμŠ€ν…œ
      • Collaborative Filtering
      • Matrix Factorization
  • Django
    • Basic
      • ν™˜κ²½μ„€μ •
      • About Django
      • Start Django Project
      • Secret Key κ΄€λ¦¬ν•˜κΈ°
      • Settings λΆ„λ¦¬ν•˜κΈ°
      • Django App
      • Django View & URL (1)
      • Django Model
        • MySQL 연동
      • Django Admin
      • Django View & URL (2)
      • Django Template
      • Django Template & View & URL
      • Django Static
      • Django form
    • Advanced
      • Django Generic View
      • Django Automated Testing
      • Django Extenstion Template
      • Django Model Package
      • Django OpenSSL setting
    • REST framework
      • Rest API
      • Serializers
      • ViewSet
    • Error
      • ν™˜κ²½μ„€μ • zlib 였λ₯˜λ°œμƒ
      • ModuleNotFoundError
    • νŒ¨ν‚€μ§€
      • django-debug-toolbar
    • Vue.js μ—°λ™ν•˜κΈ°
  • Ruby
    • variable & input/output
    • 쑰건문
    • 반볡문
    • Array & Hash
    • Method
    • Proc&Lamda
    • Class
  • Ruby on Rails
    • Scaffolding
    • Controller
    • Model
    • Model-M:N relation
    • Model Validation
    • 멋사 10μ£Όμ°¨ μˆ˜μ—…(Tip)
  • HTML/CSS
    • Udacity - Intro to HTML/CSS
    • Udacity - Responsive Web Design
    • Udacity - Responsive Images
    • HTML Basic
    • CSS Basic
    • HTML5 Sementic Tag
    • HTML ν…μŠ€νŠΈ κ΄€λ ¨ νƒœκ·Έλ“€
    • HTML5 λ©€ν‹°λ―Έλ””μ–΄
    • HTML 폼 κ΄€λ ¨ νƒœκ·Έλ“€
    • ν…μŠ€νŠΈ κ΄€λ ¨ μŠ€νƒ€μΌ
    • 색상과 배경을 μœ„ν•œ μŠ€νƒ€μΌ
    • λ ˆμ΄μ•„μ›ƒμ„ μœ„ν•œ μŠ€νƒ€μΌ
    • CSS 포지셔닝
    • λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž
    • CSS와 μ• λ‹ˆλ©”μ΄μ…˜
    • λ°˜μ‘ν˜• μ›Ήμ΄λž€?
  • OS(운영체제)
    • Linux
      • Daemon
      • Cron
      • ν”„λ‘œμ„ΈμŠ€ κ΄€λ ¨ λͺ…λ Ήμ–΄
      • ν…μŠ€νŠΈ 파일 λͺ…λ Ήμ–΄
  • Network
    • λ„€νŠΈμ›Œν¬ κΈ°λ³Έ κ°œλ…
    • λ„€νŠΈμ›Œν¬ κΈ°λ³Έ κ·œμΉ™
    • 물리 계측
    • 데이터 링크 계측
    • λ„€νŠΈμ›Œν¬ 계측
    • 전솑 계측
    • μ‘μš© 계측
    • λ„€νŠΈμ›Œν¬ 전체 흐름
    • 무선 랜
  • IT 기타지식
    • NASλž€
Powered by GitBook
On this page
  • λ³€μˆ˜
  • scope
  • undefined
  • Null
  • boolean
  • number
  • μ›μ‹œ κ°’κ³Ό μ°Έμ‘° κ°’
  • 동적 ν”„λ‘œνΌν‹°
  • κ°’ 볡사
  • λ§€κ°œλ³€μˆ˜
  • νƒ€μž… νŒλ³„
  • μ—°μ‚°μž
  • 일치/뢈일치 vs 동일/비동일 μ—°μ‚°μž
  • ν•¨μˆ˜

Was this helpful?

  1. JavaScript

JABASCRIPT BASIC

λ³€μˆ˜

scope

function test(){
  var message = "hi"; // μ§€μ—­λ³€μˆ˜
}
test();
alert(message); // 였λ₯˜ λ°œμƒ
VM3067:5 Uncaught ReferenceError: message is not defined
    at <anonymous>:5:7

var μ—°μ‚°μžλŠ” λ³€μˆ˜λ₯Ό 둜컬 μŠ€μ½”ν”„μ—μ„œ μ •μ˜ν•œλ‹€λŠ” 점을 λ°˜λ“œμ‹œ κΈ°μ–΅ν•΄μ•Όν•œλ‹€. var ν‚€μ›Œλ“œλ₯Ό μ¨μ„œ λ³€μˆ˜λ₯Ό μ •μ˜ν•˜λ©΄ ν•΄λ‹Ή λ³€μˆ˜λŠ” μœ„μ™€ 같이 ν•¨μˆ˜κ°€ μ’…λ£Œλ˜λŠ” μˆœκ°„ νŒŒκ΄΄λœλ‹€.

function test(){
  message = "hi"; // μ „μ—­λ³€μˆ˜
}
test();
alert(message);    //"hi"

var μ—°μ‚°μžλ₯Ό μƒλž΅ν•˜λŠ” κ²½μš°μ—λŠ” λ³€μˆ˜λ₯Ό μ „μ—­μœΌλ‘œ μ •μ˜ν•  수 μžˆλ‹€.

데이터 νƒ€μž… ECMAScriptμ—λŠ” λ‹€μ„― κ°€μ§€ 기본적인 데이터 νƒ€μž…μ΄ μžˆλ‹€. 이λ₯Ό primitive(μ›μ‹œ) 데이터 νƒ€μž…μ΄λΌ λΆ€λ₯΄κΈ°λ„ν•œλ‹€.

  • Undefined

  • Null

  • Boolean

  • number

  • string

λ³΅μž‘ν•œ 데이터 νƒ€μž…

  • object : ν•¨μˆ˜λ₯Ό μ œμ™Έν•œ 객체 or null

  • function : ν•¨μˆ˜

μœ„μ˜ λ‹€μ„― κ°€μ§€κ°€ 이에 ν•΄λ‹Ήλœλ‹€.

undefined

undefined λŠ” var λ₯Ό μ¨μ„œ λ³€μˆ˜λ₯Ό μ •μ˜ν–ˆμ§€λ§Œ μ΄ˆκΈ°ν™” ν•˜μ§€μ•Šμ€ κ²½μš°μ΄λ‹€.

var message;
console.log(message); //=> undefined

기본적으둜 μ΄ˆκΈ°ν™”ν•˜μ§€ μ•Šμ€ λ³€μˆ˜μ—λŠ” 항상 undefinedκ°€ ν• λ‹Ήλœλ‹€.

var message; // undefined

console.log(message); // "undefined"
console.log(age);            // 였λ₯˜
Uncaught ReferenceError: age is not defined
    at <anonymous>:1:13

undefined 값이 ν• λ‹Ήλœ λ³€μˆ˜μ™€ μ •μ˜λ˜μ§€ μ•Šμ€ λ³€μˆ˜λ₯Ό ꡬ뢄할 수 μžˆμ–΄μ•Όν•œλ‹€. 아직 μ •μ˜ν•œ 적 μ—†λŠ” λ³€μˆ˜μ— μ‹€ν–‰ν•  수 μžˆλŠ” 쑰적은 typeof뿐이닀.

var message; 
typeof message
"undefined"
typeof age; // "undefined"

Null

Null νƒ€μž… μ—­μ‹œ κ°’ ν•˜λ‚˜λ§Œμ„ κ°–λŠ”λ‹€. null 은 빈 객체λ₯Ό κ°€λ¦¬ν‚€λŠ” ν¬μΈν„°μ΄λ―€λ‘œ typeof λ₯Ό ν˜ΈμΆœν•˜λ©΄ objectλ₯Ό λ°˜ν™˜ν•œλ‹€.

var a = null;
typeof(a); // "object"

λ³€μˆ˜ μ •μ˜μ‹œμ— ν•΄λ‹Ή λ³€μˆ˜κ°€ 객체λ₯Ό κ°€λ¦¬ν‚€κ²Œ ν•  것이라면 null둜 μ΄ˆκΈ°ν™”ν•˜λŠ” 것을 ꢌμž₯ν•œλ‹€.

console.log(null == undefined) // true

undefinedλŠ” nullμ—μ„œ νŒŒμƒν–ˆμœΌλ―€λ‘œ ν‘œλ©΄μ μœΌλ‘œ λ™μΌν•œ κ²ƒμœΌλ‘œ μ •μ˜ν•œλ‹€. nullκ³Ό undefinedλŠ” μ„œλ‘œ κ΄€λ ¨μžˆμ§€λ§Œ 두 값은 μ•„μ£Ό λ‹€λ₯΄κ²Œ 쓰인닀. λ³€μˆ˜κ°’μ— λͺ…μ‹œμ μœΌλ‘œ undefinedλ₯Ό ν• λ‹Ήν•΄μ„œλŠ” μ•ˆλ˜μ§€λ§Œ, null은 객체λ₯Ό μ‚¬μš©ν•΄μ•Όν•˜μ§€λ§Œ ν•΄λ‹Ή 객체λ₯Ό μ΄μš©ν•  수 없을 λ•Œ 항상 null이 μ™€μ•Όν•œλ‹€.

boolean

데이터 νƒ€μž…

true

false

boolean

true

false

string

λΉ„μ–΄μžˆμ§€μ•Šμ€ λ¬Έμžμ—΄ μ „λΆ€

""(빈 λ¬Έμžμ—΄)

number

0이 μ•„λ‹Œ λͺ¨λ“  숫자, λ¬΄ν•œλŒ€(Infinity) 포함

0, NaN

object

λͺ¨λ“  객체

null

undefined

X(ν•΄λ‹Ήμ—†μŒ)

undefined

number

λΆ€λ™μ†Œμˆ˜μ  μˆ«μžλŠ” μ†Œμˆ˜μ  μ•„λž˜ 17μžλ¦¬κΉŒμ§€ μ •ν™•ν•˜μ§€λ§Œ 사칙연산에 μžˆμ–΄μ„œλŠ” λΆ€μ •ν™•ν•˜λ‹€.

a = 0.1
b = 0.2
a+b // 0.30000000000000004
console.log(a+b == 0.3) //=> false

0.1 + 0.2κ°€ 0.3이 μ•„λ‹Œ 0.30000000000000004λ₯Ό λ°˜ν™˜ν•˜λŠ” 것을 λ³Ό 수 μžˆλ‹€. λ”°λΌμ„œ λΆ€λ™μ†Œμˆ˜μ  숫자λ₯Ό λΉ„κ΅ν• λ•ŒλŠ” μ΄λŸ¬ν•œ 버그λ₯Ό μΈμ§€ν•˜κ³  λ‹€λ₯Έ 방법을 μ¨μ•Όν•œλ‹€.

Number.MIN_VALUE // 5e-324
Number.MAX_VALUE // 1.7976931348623157e+308
isFinite(123124124123123) // true
isFinite(Infinity)        // false

μ΅œμ†Ÿκ°’κ³Ό μ΅œλŒ€κ°’μ€ MIN_VALUE, MAX_VALUEλ₯Ό ν†΅ν•΄μ„œ μ•Œ 수 있으며, ν•΄λ‹Ή μˆ«μžκ°€ μœ νš¨ν•œ λ²”μœ„μ•ˆμ— μžˆλŠ”μ§€λŠ” isFinite() ν•¨μˆ˜λ₯Ό μ‚¬μš©ν•˜λ©΄λœλ‹€.

NaN

NaN은 Not a Number으둜 μ˜λ„ν•œ μ‘°μž‘μ΄ μ‹€νŒ¨ν–ˆμ„ λ•Œ λ°˜ν™˜λ˜λŠ” 값이닀. NaN은 μ–΄λ– ν•œ 값도 μΌμΉ˜ν•˜μ§€ μ•ŠμœΌλ©°, NaN끼리도 μΌμΉ˜ν•˜μ§€ μ•ŠλŠ”λ‹€.

console.log(NaN == NaN); // false

κ·ΈλŸ¬λ―€λ‘œ, isNaN() ν•¨μˆ˜λ₯Ό λ”°λ‘œ μ œκ³΅ν•΄μ€€λ‹€.

μ›μ‹œ κ°’κ³Ό μ°Έμ‘° κ°’

μžλ°”μŠ€ν¬λ¦½νŠΈ λ³€μˆ˜λŠ” λ³€μˆ˜κ°€ κ°€μ Έμ•Όν•  데이터 νƒ€μž…μ— λŒ€ν•œ κ·œμΉ™μ΄ μ—†μœΌλ―€λ‘œ λ³€μˆ˜μ˜ κ°’κ³Ό 데이터 νƒ€μž…μ€ μ‹€ν–‰ 쀑에 λ°”λ€” 수 μžˆλ‹€.

μ›μ‹œ 값은 λ‹¨μˆœν•œ 데이터이며, μ°Έμ‘° 값은 μ—¬λŸ¬ κ°’μœΌλ‘œ κ΅¬μ„±λ˜λŠ” 객체λ₯Ό 가리킨닀. λ³€μˆ˜μ— 값을 ν• λ‹Ήν•˜λ©΄ μžλ°”μŠ€ν¬λ¦½νŠΈ 엔진은 ν•΄λ‹Ή 값이 μ›μ‹œ 데이터인지 μ°Έμ‘° 데이터인지 νŒλ‹¨ν•œλ‹€.

μ›μ‹œνƒ€μž…μ€ Undefined, Null, Boolean, 숫자, λ¬Έμžμ—΄μ΄λ‹€. μ°Έμ‘° 값은 λ©”λͺ¨λ¦¬μ— μ €μž₯된 객체둜, μžλ°”μŠ€ν¬λ¦½νŠΈλŠ” λ©”λͺ¨λ¦¬ 곡간을 직접 μ‘°μž‘ν•˜λŠ” 것이 λΆˆκ°€λŠ₯ν•˜λ©°, 객체λ₯Ό μ‘°μž‘ν• λ•ŒλŠ” 사싀 ν•΄λ‹Ή 객체에 λŒ€ν•œ μ°Έμ‘°λ₯Ό μ‘°μž‘ν•˜λŠ” 것이닀.

동적 ν”„λ‘œνΌν‹°

μ°Έμ‘° 값을 λ‹€λ£°λ•ŒλŠ” μ–Έμ œλ“  ν”„λ‘œνΌν‹°μ™€ λ©”μ„œλ“œλ₯Ό μΆ”κ°€ν•˜κ±°λ‚˜ λ°”κΎΈκ³  μ‚­μ œν•  수 μžˆλ‹€.

var person = new Object();
person.name = "Faker";
console.log(person.name); // "Faker"

객체λ₯Ό μƒμ„±ν•œ ν›„ ν”„λ‘œνΌν‹°λ₯Ό μΆ”κ°€ν–ˆλ‹€. 이 μ‹œμ λΆ€ν„° 객체가 νŒŒκ΄΄λ˜κ±°λ‚˜ ν”„λ‘œνΌν‹°λ₯Ό λͺ…μ‹œμ μœΌλ‘œ μ œκ±°ν•˜κΈ° μ „κΉŒμ§€λŠ” ν•΄λ‹Ή ν”„λ‘œνΌν‹°μ— μ ‘κ·Όν•  수 μžˆλ‹€.

var name = "Faker";
name.age = 24;
console.log(name.age); // undefined

μ›μ‹œκ°’μ—λŠ” ν”„λ‘œνΌν‹°κ°€ μ—†μœΌλ©°, μΆ”κ°€ν•˜λ €ν•΄λ„ 였λ₯˜κ°€ λ°œμƒν•˜μ§€λŠ” μ•Šμ§€λ§Œ λ°”λ‘œ 사라진닀. λ™μ μœΌλ‘œ ν”„λ‘œνΌν‹°λ₯Ό μΆ”κ°€ν•  수 μžˆλŠ” 값은 μ°Έμ‘°κ°’ 뿐이닀.

κ°’ 볡사

μ›μ‹œ 값을 λ‹€λ₯Έ λ³€μˆ˜λ‘œ 볡사할 λ•ŒλŠ” ν˜„μž¬ μ €μž₯된 값을 μƒˆλ‘œ μƒμ„±ν•œ λ‹€μŒ μƒˆλ‘œμš΄ λ³€μˆ˜μ— λ³΅μ‚¬ν•œλ‹€.

var num1 = 4;
var num2 = num1;

console.log(num1 , num2); // 4 4
num1 = 5;
console.log(num1 , num2); // 5 4

μ—¬κΈ°μ„œ λ³΅μ‚¬λœ κ°’ num2λŠ” num1에 μ €μž₯된 κ°’κ³ΌλŠ” μ™„μ „νžˆ λΆ„λ¦¬λ˜μ–΄μžˆλŠ” 것을 확인할 수 μžˆλ‹€.

μ°Έμ‘° 값은 객체λ₯Ό λ³΅μ‚¬ν•˜λ©΄ κ·Έ 값이 객체 μžμ²΄κ°€ μ•„λ‹ˆλΌ νž™μ— μ €μž₯된 객체λ₯Ό κ°€λ¦¬ν‚€λŠ” 포인터이닀.

var obj = Object();
var obj2 = obj;

obj.name = "Faker";
console.log(obj2.name);
obj2.name = "Clid";
console.log(obj.name);

λ‹€μŒκ³Ό 같이 객체λ₯Ό μ‘°μž‘ν•˜λ©΄ λ‹€λ₯Έ 객체에도 영ν–₯이 κ°€λŠ” 것을 확인할 수 μžˆλ‹€.

λ§€κ°œλ³€μˆ˜

ECMAScript의 ν•¨μˆ˜ λ§€κ°œλ³€μˆ˜λŠ” λͺ¨λ‘ κ°’μœΌλ‘œ μ „λ‹¬λœλ‹€. ν•¨μˆ˜ 외뢀에 μžˆλŠ” 값은 ν•¨μˆ˜ λ‚΄λΆ€μ˜ λ§€κ°œλ³€μˆ˜μ— λ³΅μ‚¬λ˜λŠ”λ°, μ΄λ•Œ λ³€μˆ˜μ˜ 값을 λ³΅μ‚¬ν•˜λŠ” 것과 κ°™λ‹€. λ³€μˆ˜λŠ” κ°’μœΌλ‘œλ„, μ°Έμ‘°λ‘œλ„ μ ‘κ·Όκ°€λŠ₯ν•˜μ§€λ§Œ λ§€κ°œλ³€μˆ˜λŠ” 였직 κ°’μœΌλ‘œλ§Œ μ „λ‹¬λœλ‹€.

function addTen(num){
  // μ—¬κΈ°μ„œ λ§€κ°œλ³€μˆ˜ num은 μ§€μ—­λ³€μˆ˜μ΄λ‹€.
  num += 10;
  return num;
}

var count = 20;
var result = addTen(count);
console.log(count); // 20
console.log(result); // 30
function setName(obj){
  obj.name = "Faker";
}
var person = new Object();
setName(person);
console.log(person);
[object Object] {
  name: "Faker"
}

objλŠ” ν•¨μˆ˜μ— κ°’ ν˜•νƒœλ‘œ μ „λ‹¬λ˜μ—ˆμ§€λ§Œ, μ°Έμ‘°λ₯Ό ν†΅ν•΄μ„œ 객체에 μ ‘κ·Όν•œλ‹€. ν•¨μˆ˜ λ‚΄λΆ€μ—μ„œ obj에 name ν”„λ‘œνΌν‹°λ₯Ό μΆ”κ°€ν•˜λ©΄ ν•¨μˆ˜ μ™ΈλΆ€μ—μ„œλ„ λ°˜μ˜λ˜λŠ”λ° objκ°€ κ°€λ¦¬ν‚€λŠ” 것은 νž™μ— μ‘΄μž¬ν•˜λŠ” μ „μ—­ 객체이기 λ•Œλ¬Έμ΄λ‹€.

function setName2(obj){
  obj.name = "Faker";
  obj = new Object();
  obj.name = "Greg";
}

var person2 = new Object();
setName2(person2);
console.log(person2);
[object Object] {
  name: "Faker"
}

λ§Œμ•½ person2κ°€ 참쑰둜 μ „λ‹¬λ˜μ—ˆλ‹€λ©΄, person2의 name ν”„λ‘œνΌν‹° 값은 Grag둜 λ³€κ²½λ˜μ–΄μ•Όν•˜μ§€λ§Œ "Faker"κ·ΈλŒ€λ‘œμ΄λ‹€. ν•¨μˆ˜μ— 값을 μ „λ‹¬ν–ˆκΈ°λ•Œλ¬Έμ— ν•¨μˆ˜ λ‚΄λΆ€μ—μ„œ λ§€κ°œλ³€μˆ˜μ˜ 값이 λ°”λ€Œμ—ˆμŒμ—λ„ λΆˆκ΅¬ν•˜κ³  μ›λž˜ 객체에 λŒ€ν•œ μ°Έμ‘°λ₯Ό κ·ΈλŒ€λ‘œ μœ μ§€ν•œ 것이닀. ν•¨μˆ˜ λ‚΄λΆ€μ—μ„œ μƒˆλ‘œμš΄ 객체λ₯Ό μƒμ„±ν•˜λ©΄, objλŠ” μ§€μ—­ 객체λ₯Ό κ°€λ¦¬ν‚€λŠ” 포인터가 되며, 이 μ§€μ—­ κ°μ²΄λŠ” ν•¨μˆ˜κ°€ 싀행을 λ§ˆμΉ˜λŠ” μˆœκ°„ μ¦‰μ‹œ νŒŒκ΄΄λœλ‹€.

νƒ€μž… νŒλ³„

typeof μ—°μ‚°μžλŠ” λ³€μˆ˜κ°€ μ›μ‹œ νƒ€μž…μΈμ§€ νŒŒμ•…ν•˜κΈ°μ— μ΅œμƒμ΄μ§€λ§Œ, 참쑰값에 λŒ€ν•΄μ„œλŠ” νŒλ³„ν•˜κΈ° μ–΄λ ΅λ‹€. μ΄λŸ¬ν•œ κ²½μš°μ— instanceof λ₯Ό μ‚¬μš©ν•˜λ©΄λœλ‹€.

variable instanceof constructor
console.log(person instanceof Object); // true

λͺ¨λ“  μ°Έμ‘° 값은 Object의 μΈμŠ€ν„΄μŠ€μΈ κ²ƒμœΌλ‘œ μ •μ˜λ˜μ–΄ μžˆμœΌλ―€λ‘œ 항상 trueλ₯Ό λ°˜ν•œν™˜λ‹€.

μ—°μ‚°μž

일치/뢈일치 vs 동일/비동일 μ—°μ‚°μž

동일(==)/비동일(!=) μ—°μ‚°μžμ™€ 일치(===)/뢈일치(!==) μ—°μ‚°μžλŠ” 같은 μΌμ„ν•˜μ§€λ§Œ 일치, 뢈일치 μ—°μ‚°μžλŠ” ν”Όμ—°μ‚°μžμ˜ νƒ€μž…μ„ λ³€ν™˜ν•˜μ§€ μ•Šκ³  κ·ΈλŒ€λ‘œ λΉ„κ΅ν•œλ‹€.

console.log("55"==55); // true
console.log("55"===55); // false

동일 μ—°μ‚°μž(==)λŠ” λ¬Έμžμ—΄μ„ 숫자둜 λ³€ν™˜ν•œ λ‹€μŒ 비ꡐλ₯Ό ν•˜λ―€λ‘œ 두 값이 λ™μΌν•˜λ‹€κ³  λ³Έλ‹€. ν•˜μ§€λ§Œ 일치 μ—°μ‚°μž(===)λŠ” λ³€ν™˜ν•˜μ§€ μ•Šμ€ μƒνƒœμ—μ„œ λΉ„κ΅ν•˜λ―€λ‘œ μΌμΉ˜ν•˜μ§€ μ•Šλ‹€κ³  λ°˜ν™˜ν•œλ‹€.

console.log(undefined == null); // true
console.log(undefined === null); // false

ν•¨μˆ˜

ECMAScript ν•¨μˆ˜λŠ” λ§€κ°œλ³€μˆ˜ 숫자λ₯Ό λ”°μ§€μ§€ μ•ŠμœΌλ©° 데이터 νƒ€μž…λ„ μ²΄ν¬ν•˜μ§€ μ•ŠλŠ”λ‹€. ν•¨μˆ˜μ—μ„œ λ§€κ°œλ³€μˆ˜λ₯Ό 두 개 받도둝 λ§Œλ“€μ—ˆλ”λΌλ„ λ°˜λ“œμ‹œ λ§€κ°œλ³€μˆ˜ 두 개λ₯Ό λ„˜κ²¨μ•Όν•˜λŠ” 건 μ•„λ‹ˆλ‹€. ECMAScript의 λ§€κ°œλ³€μˆ˜κ°€ λ‚΄λΆ€μ μœΌλ‘œλŠ” λ°°μ—΄λ‘œ ν‘œν˜„λ˜κΈ° λ•Œλ¬Έμ΄λ‹€. 이 배열은 항상 ν•¨μˆ˜μ— μ „λ‹¬λ˜μ§€λ§Œ ν•¨μˆ˜λŠ” 배열에 μ–΄λ–€ 값이 λ“€μ–΄μžˆλŠ”μ§€ μ²΄ν¬ν•˜μ§€ μ•ŠλŠ”λ‹€. ν•¨μˆ˜λŠ” argumentsλΌλŠ” 객체λ₯Ό ν†΅ν•΄μ„œ λ§€κ°œλ³€μˆ˜ 값에 μ ‘κ·Όν•  수 μžˆλ‹€.

function sayHi(){
  console.log(arguments);
}
sayHi('test1','1234', '25');
[object Arguments] {
  0: "test1",
  1: "1234",
  2: "25"
}

argumentsλŠ” 인덱슀 κ°’μœΌλ‘œ μ ‘κ·Όν•  수 μžˆλ‹€.

ECMAScript ν•¨μˆ˜μ—λŠ” λ‹€λ₯Έ μ–Έμ–΄μ—μ„œ μ‚¬μš©ν•˜λŠ” μ˜€λ²„λ‘œλ”©μ΄ μ—†λ‹€.같은 μ΄λ¦„μœΌλ‘œ ν•¨μˆ˜λ₯Ό μ—¬λŸ¬ 번 μ •μ˜ν•˜λ©΄ λ§ˆμ§€λ§‰ ν•¨μˆ˜κ°€ ν• λ‹Ήλœλ‹€.

PreviousJavaScriptNextShallow Copy vs Deep Copy

Last updated 4 years ago

Was this helpful?