Type guard for array of objects.
Validate API data, safely.

// ─── Item type ───────────────────────────────
interface User {
id: string;
name: string;
email: string;
}

// ─── Step 1: guard for the item ──────────────
function isUser(x: unknown): x is User {
return (
typeof x === 'object' &&
x !== null &&
'id' in x &&
'name' in x &&
'email' in x &&
typeof (x as User).id === 'string' &&
typeof (x as User).name === 'string' &&
typeof (x as User).email === 'string'
);
}

// ─── Step 2: guard for the array ────────────
function isUserArray(x: unknown): x is User[] {
return Array.isArray(x) && x.every(isUser);
}

// ─── Usage ───────────────────────────────────
function processData(data: unknown): string {
if (!isUserArray(data)) {
throw new Error('Invalid data: expected User[]');
}
// data is User[] from here on
return data.map(u => u.name).join(', ');
}

// ─── Real API integration ────────────────────
async function fetchUsers(): Promise {
const res = await fetch('/api/users');
const data: unknown = await res.json(); // unknown, not any
if (!isUserArray(data)) {
throw new Error('API returned unexpected shape');
}
return data;
}

// ─── What happens with bad data ──────────────
const tests: unknown[] = [
[{ id: '1', name: 'Alice', email: 'a@x.com' }], // ✅
[{ id: '1', name: 'Alice' }], // ❌ missing email
[{ id: 1, name: 'Alice', email: 'a@x.com' }], // ❌ id is number
'not an array', // ❌ not array
null, // ❌ null
[], // ✅ empty array is valid
];

for (const t of tests) {
console.log(isUserArray(t) ? 'valid' : 'invalid');
}

console.log(processData(tests[0]));

// ─── The generic array guard ─────────────────
function isArrayOf(
arr: unknown,
itemGuard: (item: unknown) => item is T
): arr is T[] {
return Array.isArray(arr) && arr.every(itemGuard);
}

// ─── Item guards ─────────────────────────────
interface User { id: string; name: string }
interface Post { id: string; title: string }
interface Product { sku: string; price: number }

function isUser(x: unknown): x is User {
return typeof x === 'object' && x !== null
&& 'id' in x && 'name' in x
&& typeof (x as User).id === 'string'
&& typeof (x as User).name === 'string';
}

function isPost(x: unknown): x is Post {
return typeof x === 'object' && x !== null
&& 'id' in x && 'title' in x
&& typeof (x as Post).id === 'string'
&& typeof (x as Post).title === 'string';
}

function isProduct(x: unknown): x is Product {
return typeof x === 'object' && x !== null
&& 'sku' in x && 'price' in x
&& typeof (x as Product).sku === 'string'
&& typeof (x as Product).price === 'number';
}

// ─── One helper, any type ────────────────────
function processData(data: unknown) {
if (isArrayOf(data, isUser)) {
// data is User[]
return data.map(u => u.name);
}
if (isArrayOf(data, isPost)) {
// data is Post[]
return data.map(p => p.title);
}
if (isArrayOf(data, isProduct)) {
// data is Product[]
return data.map(p => p.sku);
}
throw new Error('Unknown data shape');
}

// ─── In API layer ────────────────────────────
async function fetchUsers(): Promise {
const res = await fetch('/api/users');
const data: unknown = await res.json();
if (!isArrayOf(data, isUser)) {
throw new Error('Invalid users response');
}
return data; // User[] — full safety from here
}

// ─── Compatible with primitive item guards ───
const isString = (x: unknown): x is string => typeof x === 'string';
const isNumber = (x: unknown): x is number => typeof x === 'number';

const maybeStrings: unknown = ['a', 'b'];
if (isArrayOf(maybeStrings, isString)) {
console.log(maybeStrings.map(s => s.toUpperCase()));
}

console.log(processData([{ id: '1', name: 'Alice' }]));
console.log(processData([{ id: '1', title: 'Hello' }]));
console.log(processData([{ sku: 'X', price: 10 }]));

// ─── The core helpers ────────────────────────
function isArrayOf(
arr: unknown,
itemGuard: (item: unknown) => item is T
): arr is T[] {
return Array.isArray(arr) && arr.every(itemGuard);
}

function isObjectWithextends Record<string, unknown>>(
x: unknown,
shape: { [K in keyof T]: (v: unknown) => v is T[K] }
): x is T {
if (typeof x !== 'object' || x === null) return false;
for (const k of Object.keys(shape) as (keyof T)[]) {
if (!shape[k]((x as Record<string, unknown>)[k as string])) return false;
}
return true;
}

// ─── Type definitions ────────────────────────
interface User {
id: string;
name: string;
email: string;
}

// ─── Guards built from the helpers ───────────
const isString = (x: unknown): x is string => typeof x === 'string';

const isUser = (x: unknown): x is User =>
isObjectWith(x, {
id: isString,
name: isString,
email: isString
});

// ─── The API client ──────────────────────────
class ApiClient {
async fetchUsers(): Promise {
const res = await fetch('/api/users');
if (!res.ok) throw new Error(HTTP ${res.status}`);

const data: unknown = await res.json();
if (!isArrayOf(data, isUser)) {
throw new Error('Invalid /api/users response');
}
return data;
}

async fetchUser(id: string): Promise {
const res = await fetch(/api/users/${id}HTTP ${res.status});

const data: unknown = await res.json();
if (!isUser(data)) {
throw new Error(Invalid /api/users/${id} response`);
}
return data;
}
}

// ─── Everywhere else is typed and safe ───────
//
// function UserList() {
// const [users, setUsers] = useState([]);
// useEffect(() => {
// api.fetchUsers().then(setUsers); // User[] guaranteed
// }, []);
// return 
{users.map(u => 
{u.name}
)}
;
// }
//
// No guards here. No casts. Just typed data.
// The validation happened at the boundary.

const api = new ApiClient();

// ─── The rules ───────────────────────────────
//
// 1. API responses are unknown, not any.
// 2. Guard at the fetch wrapper, not in components.
// 3. Validate both single objects and arrays.
// 4. Throw on invalid — don't silently return [].
// 5. Inside the app, trust the types — that's
// what the guard at the boundary is for.

console.log(isArrayOf([{ id: '1', name: 'A', email: 'a@x.com' }], isUser));
console.log(isUser({ id: '1', name: 'A', email: 'a@x.com' }));