[JavaScript] globalThis

 

 

globalThis는 ES11 (ES2020)에 추가된 기능으로 자바스크립트 환경에서 전역 객체를 가리킨다.

이전 브라우저 환경에서는 window, Node.js 환경에서는 global을 사용해야 하는 등 각각의 환경에 따라 전역 객체에 접근하는 방법이 다르기 때문에 통일성이 없었다. globalThis는 이러한 차이를 해결하고 어디에서나 동일한 방법으로 전역 객체에 접근할 수 있도록 만들어졌다.

 

console.log(globalThis === window) // 브라우저: true
console.log(globalThis === global) // Node.js: true

 

globalThis를 사용하면 특정 환경에 의존하지 않는 코드를 작성할 수 있다.

 

 

 

+

import { PrismaClient } from '@prisma/client'

const prismaClientSingleton = () => {
  return new PrismaClient()
}

declare global {
  var prisma: undefined | ReturnType<typeof prismaClientSingleton>
}

const prisma = globalThis.prisma ?? prismaClientSingleton()

export default prisma

if (process.env.NODE_ENV !== 'production') globalThis.prisma = prisma

 

프리즈마 공식 문서 중 globalThis를 사용한 코드를 발견하여 작성하게 되었다.

PrismaClient를 단일 인스턴스로 관리하기 위해 싱글톤 패턴을 사용하였다.

 

declare global {
  var prisma: undefined | ReturnType<typeof prismaClientSingleton>
}

 

이 코드는 TypeScript에서 globalThis 객체에 prisma 변수를 전역으로 선언한다는 의미이다. prisma는 prismaClientSingleton 함수의 리턴 타입 (즉 prismaClient 타입) 또는 undefined라는 의미이다.

 

const prisma = globalThis.prisma ?? prismaClientSingleton()
if (process.env.NODE_ENV !== 'production') globalThis.prisma = prisma

 

globalThis.prisma가 이미 정의되어 있다면 그 값을 사용하고, 정의되어 있지 않다면 prismaClientSingleton 함수를 호출하여 새로운 PrismaClient 인스턴스를 만들고 globalThis.prisma에 prisma 인스턴스를 할당하게 된다.