<!-- Click "Preview" for a more readable version --

Please read and follow the instructions before submitting an issue:

- Read all our documentation, especially the [README](https://github.com/axios/axios/blob/master/README.md). It may contain information that helps you solve your issue.
- Ensure your issue isn't already [reported](https://github.com/axios/axios/issues?utf8=%E2%9C%93&q=is%3Aissue).
- If you aren't sure that the issue is caused by Axios or you just need help, please use [Stack Overflow](https://stackoverflow.com/questions/tagged/axios) or [our chat](https://gitter.im/mzabriskie/axios).
- If you're reporting a bug, ensure it isn't already fixed in the latest Axios version.
- Don't remove any title of the issue template, or it will be treated as invalid by the bot.

⚠️👆 Feel free to these instructions before submitting the issue 👆⚠️
-->

#### Describe the issue
Headers are typed as `Record<string, string>`. This includes `axios.defaults.headers`, which is configured as: https://github.com/axios/axios/blob/76f09afc03fbcf392d31ce88448246bcd4f91f8c/lib/defaults.js#L119-L123

This seems incompatible with `headers` being of type `Record<string, string>`.

#### Example Code
The following line produces a TypeScript error beacuse `headers.commons` is of type `string`: "Element implicitly has an 'any' type because index expression is not of type 'number'.ts(7015)".

```ts
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN
```


#### Expected behavior, if applicable
I expect to be able to configure default headers without TypeScript errors. Using the code examples from the Axios documentation, I would exspect `axios.defaults.headers.common` to be of type `Record<string, string>` not of type `string`.

#### Environment
 - Axios Version 0.22.0 
 - Adapter N/A
 - Browser N/A
 - Browser Version N/A
 - Node.js Version 15.14.0
 - OS: Ubuntu 21.04
 - Additional Library Versions TypeScript 4.4.3

#### Additional context/Screenshots
Add any other context about the problem here. If applicable, add screenshots to help explain.

test/typescript/axios.ts
axios.interceptors.response.eject(responseInterceptorId);
axios.interceptors.response.use(
  (response: AxiosResponse) => Promise.resolve(response),
  (error: any) => Promise.reject(error)
);
axios.interceptors.response.use((response: AxiosResponse) => response);
axios.interceptors.response.use((response: AxiosResponse) => Promise.resolve(response));
const adapter: AxiosAdapter = (config: AxiosRequestConfig) => {
  const response: AxiosResponse<any> = {
    data: { foo: 'bar' },
    status: 200,
    statusText: 'OK',
    headers: { 'X-FOO': 'bar' },
    config
  };
  return Promise.resolve(response);
};
axios.defaults.adapter = adapter;
const promises = [
  Promise.resolve(1),
  Promise.resolve(2)
];
const promise: Promise<number[]> = axios.all(promises);
const fn1 = (a: number, b: number, c: number) => `${a}-${b}-${c}`;
const fn2: (arr: number[]) => string = axios.spread(fn1);
axios.get('/user')
  .then((response: AxiosResponse) => 'foo')
  .then((value: string) => {});
axios.get('/user')
  .then((response: AxiosResponse) => Promise.resolve('foo'))