【TypeScript】TS7006の原因と解決方法｜Parameter implicitly has an ‘any’ typeを完全解説

この記事で学べること

• TS7006エラーメッセージの読み方と意味
• noImplicitAny と strict モードの関係
• 暗黙の any がなぜ危険なのか
• 関数パラメータ（通常関数・アロー関数・コールバック・デストラクチャリング・rest）の修正方法
• イベントハンドラ（addEventListener・React onClick/onChange）での正しい型付け
• Array メソッド（map/filter/reduce/forEach/find/sort）での型推論と型付け
• Promise・非同期処理（then/catch/async/setTimeout）での型付け
• Express / Node.js（req/res/next/ミドルウェア）での型付け
• React（Props・Hooks・カスタムフック・Context）での型付け
• クラスメソッド（メソッド・コンストラクタ・getter/setter）での型付け
• tsconfig.json の設定による制御（noImplicitAny / strict）
• 型の付け方パターン集（プリミティブ・オブジェクト・ユニオン・ジェネリクス・unknown）
• JavaScript → TypeScript 移行時の大量TS7006対処法

前提知識：この記事はTypeScriptの基本的な型の書き方を理解している方を対象としています。型の基本から学びたい方は【TypeScript】型の書き方 完全入門を先にお読みください。

error TS7006: Parameter ‘x’ implicitly has an ‘any’ type.

src/utils.ts:5:22 - error TS7006: Parameter 'name' implicitly has an 'any' type.

5   function greet(name) {
                     ~~~~

覚え方：「Parameter ‘パラメータ名‘ implicitly has an ‘any’ type」＝「このパラメータに型を書いてください」です。TypeScriptが「型が分からないから教えて」と言っているのです。

// JavaScript では問題なし
function greet(name) {
  return `Hello, ${name}!`;
}

// TypeScript: noImplicitAny が true の場合エラー
function greet(name) {  // TS7006: Parameter 'name' implicitly has an 'any' type.
  return `Hello, ${name}!`;
}

const numbers: number[] = [1, 2, 3];

// OK: n は number[] の要素なので number と推論される
const doubled = numbers.map(n => n * 2);

{
  "compilerOptions": {
    "strict": true   // 以下のオプションをすべて有効にする
    // "noImplicitAny": true,          ← TS7006 の原因
    // "strictNullChecks": true,
    // "strictFunctionTypes": true,
    // "strictBindCallApply": true,
    // "strictPropertyInitialization": true,
    // "noImplicitThis": true,
    // "alwaysStrict": true,
    // "useUnknownInCatchVariables": true
  }
}

注意："strict": true を設定しているプロジェクトでは、noImplicitAny を個別に設定していなくても TS7006 が発生します。現在のほとんどの TypeScript プロジェクトは strict: true で開発されているため、TS7006は非常に頻繁に遭遇するエラーです。

// noImplicitAny: false の場合、エラーなしで通る
function calculateTotal(price, quantity) {
  return price * quantity;
}

// 呼び出し側で間違った型を渡してもエラーにならない！
const total = calculateTotal("100", "3");
console.log(total); // "100" * "3" = NaN（実行時バグ！）

// さらに、存在しないメソッドを呼んでもエラーにならない
function processData(data) {
  data.toUpperCase();   // data が number でも型チェックを通る
  data.nonExistentMethod(); // 存在しないメソッドもOKになる
  data.foo.bar.baz;       // 深いプロパティアクセスもOK
}

ポイント：TS7006エラーは「うるさい」と感じるかもしれませんが、TypeScriptの型安全を守る重要なガードレールです。エラーを無効化するのではなく、適切な型を付けることで対処しましょう。

error TS7006: Parameter ‘name’ implicitly has an ‘any’ type.

function greet(name) {  // TS7006
  return `Hello, ${name}!`;
}

function add(a, b) {  // TS7006: a と b の両方でエラー
  return a + b;
}

function printUser(user) {  // TS7006
  console.log(user.name, user.age);
}

function greet(name: string): string {
  return `Hello, ${name}!`;
}

function add(a: number, b: number): number {
  return a + b;
}

interface User {
  name: string;
  age: number;
}

function printUser(user: User): void {
  console.log(user.name, user.age);
}

error TS7006: Parameter ”x” implicitly has an ”any” type.

// 変数に型注釈がないアロー関数
const double = (x) => x * 2;  // TS7006

// 複数パラメータのアロー関数
const multiply = (a, b) => a * b;  // TS7006: a と b

// ブロック構文のアロー関数
const formatName = (first, last) => {  // TS7006: first と last
  return `${first} ${last}`;
};

const double = (x: number): number => x * 2;

const multiply = (a: number, b: number): number => a * b;

const formatName = (first: string, last: string): string => {
  return `${first} ${last}`;
};

// 変数に関数型の型注釈があるため、パラメータの型が推論される
const double: (x: number) => number = (x) => x * 2;  // OK

// type エイリアスを使う方法
type MathFn = (a: number, b: number) => number;
const multiply: MathFn = (a, b) => a * b;  // OK

ポイント：修正例2のように変数側に関数型を付ける方法は、パラメータ側の型注釈を省略できるため、コードがシンプルになります。同じ関数型を複数の関数で使い回す場合にも便利です。

// callback パラメータに型がない
function fetchData(url, callback) {  // TS7006: url, callback
  // ...
}

// 方法1: 関数パラメータに型を付ける
function fetchData(url: string, callback: (data: unknown) => void): void {
  // ...
}

// コールバック内の data は unknown と推論される（型注釈不要）
fetchData("https://api.example.com", (data) => {  // OK
  console.log(data);
});

// 方法2: コールバック型を定義
type FetchCallback = (data: unknown, error?: Error) => void;

function fetchData2(url: string, callback: FetchCallback): void {
  // ...
}

error TS7006: Parameter ”name” implicitly has an ”any” type.

// デストラクチャリングに型がない
function printUser({ name, age }) {  // TS7006: name, age
  console.log(`${name} (${age}歳)`);
}

interface User {
  name: string;
  age: number;
}

function printUser({ name, age }: User): void {
  console.log(`${name} (${age}歳)`);
}

注意：デストラクチャリングの : は「リネーム」の構文と紛らわしいです。{ name: string } と書くと「name を string という変数に代入する」という意味になります。型注釈はデストラクチャリングパターン全体の後ろに書きます。

// NG
function sum(...args) { }  // TS7006

// OK
function sum(...args: number[]): number {
  return args.reduce((acc, val) => acc + val, 0);
}

// 先頭パラメータと rest を組み合わせる
function log(message: string, ...args: unknown[]): void {
  console.log(message, ...args);
}

// デフォルト値あり → 推論される → エラーなし
function greet(name = "World") { }  // OK: name は string

// オプショナル（?）だけ → 推論されない → エラー
function search(query?) { }  // TS7006

// 明示的に型を付ける
function search(query?: string): void { }  // OK

ポイント：デフォルト値がある場合でも、型注釈を明示的に付けることが推奨されます。デフォルト値の型が意図と異なる場合のバグを防げます。

// addEventListener にインラインで渡す → 推論される
document.addEventListener("click", (event) => {
  // event は MouseEvent と推論される
  console.log(event.clientX, event.clientY);
});

document.addEventListener("keydown", (event) => {
  // event は KeyboardEvent と推論される
  console.log(event.key);
});

error TS7006: Parameter ”event” implicitly has an ”any” type.

// 変数に切り出すと文脈的型付けが効かない
const handleClick = (event) => {  // TS7006
  console.log(event.clientX);
};
document.addEventListener("click", handleClick);

// 方法1: パラメータに型注釈
const handleClick = (event: MouseEvent) => {
  console.log(event.clientX, event.clientY);
};

// 方法2: 変数に関数型を付ける
const handleKeyDown: (event: KeyboardEvent) => void = (event) => {
  console.log(event.key);
};

error TS7006: Parameter ”e” implicitly has an ”any” type.

// ハンドラを変数に切り出すとTS7006
const handleClick = (e) => {  // TS7006
  console.log(e.currentTarget);
};

const handleChange = (e) => {  // TS7006
  console.log(e.target.value);
};

import React from "react";

// 方法1: React.MouseEvent を使う
const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {
  console.log(e.currentTarget);
};

// 方法2: React.ChangeEvent を使う
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
  console.log(e.target.value);
};

// 方法3: React.FormEvent を使う
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
  e.preventDefault();
};

ポイント：ReactのイベントハンドラをJSXにインラインで書く場合は文脈的型付けが効くためTS7006は発生しません。別の変数に切り出す場合にのみ型注釈が必要です。

// カスタムイベントのペイロードを型で定義
interface NotificationPayload {
  message: string;
  level: "info" | "warn" | "error";
}

// CustomEvent のジェネリクスで detail の型を指定
const handleNotification = (event: CustomEvent<NotificationPayload>) => {
  console.log(event.detail.message);  // string
  console.log(event.detail.level);    // "info" | "warn" | "error"
};

// 型付き配列 → コールバックの引数が推論される
const numbers: number[] = [1, 2, 3];
numbers.map(n => n * 2);       // OK: n は number
numbers.filter(n => n > 1);     // OK: n は number
numbers.forEach(n => console.log(n)); // OK: n は number

// リテラルから推論
const names = ["Alice", "Bob"];  // string[] と推論
names.map(name => name.toUpperCase());  // OK

// 空配列の問題: [] は never[] と推論される
const items = [];  // never[]
items.push("hello");  // TS2345: string は never に代入不可

// API レスポンスなど型が any の場合
const data = JSON.parse(response);  // any
data.map((item) => item.name);  // item は any（エラーにならないが危険）

// 空配列には明示的に型を付ける
const items: string[] = [];
items.push("hello");  // OK

// API レスポンスに型を付ける
interface ApiItem {
  name: string;
  id: number;
}
const data: ApiItem[] = JSON.parse(response);
data.map((item) => item.name);  // OK: item は ApiItem

const numbers = [1, 2, 3, 4, 5];

// OK: 初期値 0 から acc は number と推論
const sum = numbers.reduce((acc, val) => acc + val, 0);

// 初期値がオブジェクトの場合は型指定が必要
interface CountMap { [key: string]: number; }

const words = ["apple", "banana", "apple"];
const counts = words.reduce<CountMap>((acc, word) => {
  acc[word] = (acc[word] || 0) + 1;
  return acc;
}, {});

const users: { name: string; age: number }[] = [
  { name: "Alice", age: 30 },
  { name: "Bob", age: 25 },
];

// OK: a, b は { name: string; age: number } と推論
users.sort((a, b) => a.age - b.age);

// 比較関数を変数に切り出す場合は型が必要
const compareByAge = (a: { age: number }, b: { age: number }): number => {
  return a.age - b.age;
};

まとめ：Arrayメソッドのコールバックは、配列自体の型が明確であれば推論されるのでTS7006は発生しません。空配列 [] やAPIレスポンスなど型が不明確な場合は、配列に型注釈を付ければコールバックの型も自動的に推論されます。

// 型付きPromise → then のコールバックは推論される
const promise: Promise<string> = Promise.resolve("hello");
promise.then(value => {
  // value は string と推論される → エラーなし
  console.log(value.toUpperCase());
});

// fetch → json() は any を返す（危険！）
fetch("/api/users")
  .then(res => res.json())  // Promise<any>
  .then(data => {
    // data は any（TS7006にはならないが型安全でない）
    console.log(data.nonExistent);  // エラーにならない！
  });

interface User {
  id: number;
  name: string;
}

// 方法1: then で型アサーション
fetch("/api/users")
  .then(res => res.json() as Promise<User[]>)
  .then(users => {
    // users は User[] と推論される
    users.forEach(user => console.log(user.name));
  });

// 方法2: async/await + 型アサーション（推奨）
async function getUsers(): Promise<User[]> {
  const res = await fetch("/api/users");
  const data: User[] = await res.json();
  return data;
}

// NG
async function fetchUser(id) {  // TS7006: id
  const res = await fetch(`/api/users/${id}`);
  return res.json();
}

// OK
async function fetchUser(id: number): Promise<User> {
  const res = await fetch(`/api/users/${id}`);
  return res.json();
}

// ジェネリクスで型を指定 → resolve/reject は推論される
const myPromise = new Promise<string>((resolve, reject) => {
  // resolve は (value: string) => void と推論
  resolve("success");
});

// 型パラメータなしだと unknown
const noType = new Promise((resolve) => {
  resolve("hello");  // resolve は (value: unknown) => void
});

// Node.js と ブラウザで戻り値の型が異なる
// ブラウザ: number
// Node.js: NodeJS.Timeout

// 互換性のある書き方
const timerId: ReturnType<typeof setTimeout> = setTimeout(() => {
  console.log("done");
}, 1000);

前提：npm install --save-dev @types/express で型定義をインストール済みであることを前提とします。

error TS7006: Parameter ”req” implicitly has an ”any” type.
error TS7006: Parameter ”res” implicitly has an ”any” type.

const express = require("express");
const app = express();

// req, res に型がない
app.get("/users", (req, res) => {  // TS7006: req, res
  res.json({ users: [] });
});

import express, { Request, Response, NextFunction } from "express";
const app = express();

// 方法1: パラメータに直接型注釈
app.get("/users", (req: Request, res: Response) => {
  res.json({ users: [] });
});

// 方法2: ジェネリクスで req.params / req.body の型を指定
interface UserParams { id: string; }
interface UserBody { name: string; email: string; }

app.post("/users/:id", (req: Request<UserParams, {}, UserBody>, res: Response) => {
  const userId = req.params.id;    // string
  const userName = req.body.name;  // string
  res.json({ id: userId, name: userName });
});

import { Request, Response, NextFunction } from "express";

// 認証ミドルウェア
const authMiddleware = (
  req: Request,
  res: Response,
  next: NextFunction
): void => {
  const token = req.headers.authorization;
  if (!token) {
    res.status(401).json({ error: "Unauthorized" });
    return;
  }
  next();
};

import { Request, Response, NextFunction, ErrorRequestHandler } from "express";

// 方法1: 各パラメータに型注釈
const errorHandler = (
  err: Error,
  req: Request,
  res: Response,
  next: NextFunction
): void => {
  console.error(err.stack);
  res.status(500).json({ error: "Internal Server Error" });
};

// 方法2: ErrorRequestHandler 型を使う
const errorHandler2: ErrorRequestHandler = (err, req, res, next) => {
  // すべてのパラメータが推論される
  res.status(500).json({ error: err.message });
};

ポイント：Express の RequestHandler / ErrorRequestHandler 型を変数に付けると、すべてのパラメータが自動的に推論されるため、個別の型注釈が不要になります。

// Props に型がない
const UserCard = (props) => {  // TS7006: props
  return <div>{props.name}</div>;
};

// デストラクチャリングでも同様
const Greeting = ({ name, age }) => {  // TS7006: name, age
  return <p>{name} ({age}歳)</p>;
};

// 方法1: interface で Props を定義
interface UserCardProps {
  name: string;
  age: number;
  email?: string;  // オプショナル
}

const UserCard = (props: UserCardProps) => {
  return <div>{props.name}</div>;
};

// 方法2: デストラクチャリング + 型注釈
const Greeting = ({ name, age }: UserCardProps) => {
  return <p>{name} ({age}歳)</p>;
};

// 方法3: React.FC（非推奨だが既存コードでよく見る）
const UserCard2: React.FC<UserCardProps> = ({ name, age }) => {
  return <div>{name} ({age})</div>;
};

import { useState, useCallback, useMemo } from "react";

// useState: ジェネリクスで型を指定
const [user, setUser] = useState<User | null>(null);

// useCallback: コールバックのパラメータに型を付ける
const handleSelect = useCallback((id: number) => {
  console.log(`Selected: ${id}`);
}, []);

// useMemo: 戻り値の型は推論される
const sortedUsers = useMemo(() => {
  return [...users].sort((a, b) => a.name.localeCompare(b.name));
}, [users]);

// NG: パラメータに型がない
function useFetch(url) {  // TS7006
  // ...
}

// OK: ジェネリクスで戻り値の型も指定
function useFetch<T>(url: string): {
  data: T | null;
  loading: boolean;
  error: Error | null;
} {
  const [data, setData] = useState<T | null>(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState<Error | null>(null);
  // ... fetch logic ...
  return { data, loading, error };
}

// 使い方
const { data, loading } = useFetch<User[]>("/api/users");

import { createContext, useContext } from "react";

interface AuthContextType {
  user: User | null;
  login: (email: string, password: string) => Promise<void>;
  logout: () => void;
}

// ジェネリクスで型を指定
const AuthContext = createContext<AuthContextType | undefined>(undefined);

// カスタムフックで型安全に取得
function useAuth(): AuthContextType {
  const context = useContext(AuthContext);
  if (!context) {
    throw new Error("useAuth must be used within AuthProvider");
  }
  return context;
}

// NG
class Calculator {
  add(a, b) {  // TS7006: a, b
    return a + b;
  }
}

// OK
class Calculator {
  add(a: number, b: number): number {
    return a + b;
  }
}

// NG
class User {
  constructor(name, age) {  // TS7006
    this.name = name;
    this.age = age;
  }
}

// OK: パラメータプロパティを使う（推奨）
class User {
  constructor(
    public name: string,
    public age: number
  ) {}
}

// OK: 通常のパターン
class User2 {
  private name: string;
  private age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

class Temperature {
  private _celsius: number = 0;

  // getter: 戻り値は推論されるが明示推奨
  get celsius(): number {
    return this._celsius;
  }

  // setter: value に型が必要
  set celsius(value: number) {
    this._celsius = value;
  }
}

interface Logger {
  log(message: string): void;
  error(message: string, code: number): void;
}

// NG: implements していても型注釈は必要
class ConsoleLogger implements Logger {
  log(message) { }  // TS7006
  error(message, code) { }  // TS7006
}

// OK: 型注釈を明示
class ConsoleLogger implements Logger {
  log(message: string): void {
    console.log(message);
  }
  error(message: string, code: number): void {
    console.error(`[${code}] ${message}`);
  }
}

注意：TypeScript 4.x以降では、implements によるクラスメソッドのパラメータ推論は行われません。これはTypeScriptの設計上の制約です。メソッドの型注釈は省略できません。

{
  "compilerOptions": {
    // TS7006 を無効にする（非推奨）
    "noImplicitAny": false

    // TS7006 を有効にする（推奨）
    "noImplicitAny": true
  }
}

注意："strict": true を設定している場合、"noImplicitAny": false で個別にオーバーライドしない限り、noImplicitAny は自動的に true になります。

{
  "compilerOptions": {
    "strict": true,

    // strict: true の中で noImplicitAny だけ無効化
    // （移行期間中の一時的な設定として有用）
    "noImplicitAny": false
  }
}

// @ts-nocheck
// ↑ ファイル先頭に書くと、そのファイル全体の型チェックを無効化

// @ts-ignore
function legacyFunction(data) {  // この行のエラーを無視
  return data;
}

// @ts-expect-error ← より安全（エラーがないと逆にエラーになる）
function anotherLegacy(input) {
  return input;
}

ポイント：@ts-ignore より @ts-expect-error を使いましょう。@ts-expect-error は、その行にエラーがなくなったときに「不要なディレクティブ」としてエラーを出してくれるため、型を修正した後にコメントの消し忘れを防げます。

function example(
  str: string,        // 文字列
  num: number,        // 数値
  bool: boolean,      // 真偽値
  big: bigint,        // BigInt
  sym: symbol,        // Symbol
  nul: null,          // null
  und: undefined,     // undefined
) {}

// interface（拡張可能、推奨）
interface User {
  id: number;
  name: string;
  email?: string;     // オプショナル
  readonly createdAt: Date;  // 読み取り専用
}

// type エイリアス（ユニオンやタプルに便利）
type Point = {
  x: number;
  y: number;
};

function processUser(user: User): void { }
function movePoint(point: Point, dx: number, dy: number): Point {
  return { x: point.x + dx, y: point.y + dy };
}

// 複数の型を受け入れる
function formatId(id: string | number): string {
  return String(id);
}

// リテラル型のユニオン
function setStatus(status: "active" | "inactive" | "pending"): void {
  // ...
}

// null許容型
function processValue(value: string | null | undefined): void {
  if (value != null) {
    console.log(value.toUpperCase());
  }
}

// 汎用的な関数
function identity<T>(value: T): T {
  return value;
}

// 制約付きジェネリクス
function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

// 配列を受け取るジェネリクス
function first<T>(arr: T[]): T | undefined {
  return arr[0];
}

// NG: any は何でもできてしまう
function processAny(data: any): void {
  data.toUpperCase();  // エラーにならない（危険）
}

// OK: unknown は型を絞り込んでから使う
function processUnknown(data: unknown): void {
  // data.toUpperCase();  // TS2571: unknown にはプロパティがない

  // 型ガードで絞り込む
  if (typeof data === "string") {
    data.toUpperCase();  // OK: data は string
  }
}

移行の推奨ステップ

• Step 1: まず .js → .ts にリネームする（noImplicitAny: false で）
• Step 2: 明らかな型エラー（TS2322等）を修正する
• Step 3: noImplicitAny: true に切り替える
• Step 4: TS7006エラーを重要度の高いファイルから順に修正する
• Step 5: 残りのファイルには一時的に @ts-nocheck を付け、後で対処する

// Step 1: まず any で通す（最低限のTS7006解消）
function processData(data: any): any {
  return data.map((item: any) => item.value);
}

// Step 2: unknown で安全にする
function processData(data: unknown): unknown {
  if (!Array.isArray(data)) throw new Error("Expected array");
  return data;
}

// Step 3: 正確な型を定義
interface DataItem { value: number; label: string; }

function processData(data: DataItem[]): number[] {
  return data.map(item => item.value);
}

// TODO: 型を修正する（移行完了後）
function legacyProcess(data: any): any { // FIXME: any
  return data;
}

// ESLint で any の使用を警告にする
// .eslintrc.json:
// "@typescript-eslint/no-explicit-any": "warn"

/**
 * ユーザーを挨拶する
 * @param {string} name - ユーザー名
 * @returns {string} 挨拶文
 */
function greet(name) {
  return `Hello, ${name}!`;
}

/**
 * @typedef {Object} User
 * @property {number} id
 * @property {string} name
 */

/**
 * @param {User} user
 * @returns {void}
 */
function printUser(user) {
  console.log(user.name);
}

{
  "compilerOptions": {
    "allowJs": true,     // .js ファイルも処理
    "checkJs": true,     // .js ファイルも型チェック
    "noImplicitAny": true
  }
}

TS7006 解決のポイント

• 基本原則：関数パラメータに型注釈を付ける。これが最もシンプルで確実な解決方法です。
• 文脈的型付け：配列メソッドのコールバック、addEventListener のインラインコールバック、Promise.then のコールバックなどでは型推論が効くため型注釈は不要です。
• 変数に切り出す場合は注意：コールバックを別変数に切り出すと文脈的型付けが効かなくなるため、パラメータに型注釈が必要です。
• デストラクチャリング：パターン全体の後ろに型を書きます。interface / type を定義して使うのが推奨です。
• React：React.MouseEvent / React.ChangeEvent 等の合成イベント型を使います。Props は interface で定義します。
• Express：Request / Response / NextFunction を @types/express から import します。
• any より unknown：どうしても型が決められない場合は any ではなく unknown を使い、型ガードで絞り込みます。
• 移行期間：@ts-expect-error や段階的な noImplicitAny 有効化で対応します。

TypeScript 関連記事

• 【TypeScript】型の書き方 完全入門 – 基本型から応用型まで体系的に学ぶ
• 【TypeScript】関数の型定義 完全ガイド – 引数・戻り値・オーバーロード・ジェネリクス関数
• 【TypeScript】よくあるエラーと解決方法 – エラーコード全般の解決法
• 【TypeScript】tsconfig.json 完全ガイド – コンパイラオプション詳細解説
• 【TypeScript】TS2322の原因と解決方法 – 型の代入互換性エラー
• 【TypeScript】TS2339の原因と解決方法 – プロパティ不在エラー
• 【TypeScript】TS2345の原因と解決方法 – 引数の型不一致エラー