[GraphQL/Apollo] javascript / Query tip

※ 아래 기술하는 구조들은 Query뿐만 아니라 node.js 등 다른 javascript 문법구조의 기본이 될 수 있으므로, 잘 기억하고 있어야 한다.

1. 선언(정의)과 resolver(활용)는 기본 세트다.

보통 javscript 내 사용되는 함수는, 아래와 같이 함수활용과 이에 대한 선언(정의)이 이루어져야 하는 구조이다.

const sum = add(1,2)

function add(value1, value2) {
  return value1 + value2
}

Query도 이와 유사한 구조로 사용되며,

• type Query를 통해 사용할 Query문을 선언한다.
• 이를 Resolver통해 활용한다.

아래는 코드 예시이다.

type 선언

type Query {
  WhatisPersonProperty : [Person]
}

type Person {
	name : String!,
    	favoriteNumber : Int!,
  	favoriteFood : String!
}

Resolver

const resolvers = {
  Query{
  	WhatisPersonProperty : () => Person
	}
}

const Person [
  {
    name : "LEE Hyo Kyun",
    favoriteNumber : 7,
    favoriteFood : "rice"
  }
]

GraphQl에서 Query를 사용하기 위해 미리 "설계도"를 그려놓는다 → type
GraphQL의 Query를 설계한대로 사용하여 data를 얻고자, 실질적으로 사용하는 data 확보도구 → resolver

2. 기존 익숙한 함수/변수 활용방법과 달리, 선언(정의)하면서 해당 객체나 Query return을 생성한다.

type Query {
  WhatisPersonProperty : [Person]
}

type Person {
	name : String!,
    	favoriteNumber : Int!,
  	favoriteFood : String!
}

const resolvers = {
  Query{
  	WhatisPersonProperty : () => Person
	}
}

const Person [
  {
    name : "LEE Hyo Kyun",
    favoriteNumber : 7,
    favoriteFood : "rice"
  }
]  

위 코드에서 나타난 Query의 특징은 다음과 같다.

• Resolver에서 type을 통해 선언한 Query 형식 그대로 사용하고, return할 새로운 객체(Person)를 기재해주었다.
• type에서 정의해주었듯이 return한 Person 객체는 배열형태로 반환되어, 반드시 아래 Person을 활용하는 부분(Resolver)은 배열형태로 정의되어야 한다.

마찬가지로 아래와 같은 특징도 포함된다.

• Query type을 통해 선언된 WhatisPersonProperty는 우리가 DB에 접근하고 정보를 얻기 위해 요청하는 Query의 일종이다.
• type을 통해 선언된 return 객체 및 이름은 동시에 이루어진 형태이다.
  → return된 형태는 배열이다([]).
  → 그 return된 배열의 이름은 Person이고, 이는 resolvers의 Person 이름이나 속성과는 조금 다르다. 다만 구조적인 부분은 맞춰줘야 한다.

여기서 중요한 점은

type을 통해 선언된 return 객체 및 이름은 동시에 이루어진 형태인 점,

• return은 배열형태이며
• 그 배열은 person이라는 이름으로 사용가능하다.

이는 기존 python과 같이 함수지향적인 프로그래밍에 익숙하면 조금 헷갈릴 수 있는 부분으로, 객체지향 프로그래밍을 이해하고 구조를 살펴보는데 가장 중요한 부분 중 하나이다.

이 부분에 익숙해져서 Query 작성 / javascript 작성에 익숙해지도록 하자.