Issue
when all the key in interface is optional in typescript, an unexpected field provided is not report an error, why? Here is my snippet code:
// This is an interface which all the key is optional
interface AxiosRequestConfig {
url?: string;
method?: string;
baseURL?: string;
headers?: any;
params?: any;
paramsSerializer?: (params: any) => string;
data?: any;
timeout?: number;
timeoutErrorMessage?: string;
withCredentials?: boolean;
responseType?: ResponseType;
xsrfCookieName?: string;
xsrfHeaderName?: string;
onUploadProgress?: (progressEvent: any) => void;
onDownloadProgress?: (progressEvent: any) => void;
maxContentLength?: number;
validateStatus?: ((status: number) => boolean) | null;
maxBodyLength?: number;
maxRedirects?: number;
socketPath?: string | null;
httpAgent?: any;
httpsAgent?: any;
}
"a" field is unexpected, why TypeScript does not report an error ?
type test= {
[key:string]: (...args:any[])=> AxiosRequestConfig
}
const serviceMap: test = {
getOperationLogListByConditions(conditions: any) {
const {
currentPageIndex,
createTimeStart,
createTimeEnd,
...rest
} = conditions
return {
url: '/operateLog/page',
method: 'GET',
params: {
...rest,
pageNo: currentPageIndex,
createTimeStart: encodeURIComponent(createTimeStart),
createTimeEnd: encodeURIComponent(createTimeEnd)
},
a:"" // "a" field is unexpected, why TypeScript does not report an error ?
}
}
I can not figureout why, please help! The typescript version is 4.1.2.
Solution
The "excess property check" is not triggered in return type. This is why there is no error message for the excess field a
. The fact that all properties of AxiosRequestConfig are optionals is irrelevant
see playground
By contrast, the "excess property check" is triggered for expression and variable types in assignment statements and argument and parameter types in function calls.
interface Props1 {
age: number;
}
// expression assignment: excess property check is triggered
let x: Props1 = {age: 1, test: "tutu"};
function returnProps1(): Props1 {
let props = {age: 1, test: "tutu"};
// return type: excess property check is NOT triggered
return props
}
The excess property check is also triggered on "fresh" object literal assignment. The freshness of an object literal disappears in case of type assertion and type widening. In your case, the freshness of your object literal is lost by type assertion, since you don't specify the returned type in your function definition.
const serviceMap: test = {
getOperationLogListByConditions(conditions: any) {
const {
currentPageIndex,
createTimeStart,
createTimeEnd,
...rest
} = conditions
// type assertion occurs here.
// freshness of the object literal is lost
// Excess property chek is not triggered
return {
url: '/operateLog/page',
method: 'GET',
params: {
...rest,
pageNo: currentPageIndex,
createTimeStart: encodeURIComponent(createTimeStart),
createTimeEnd: encodeURIComponent(createTimeEnd)
},
a:"" // "a" field is unexpected, why TypeScript does not report an error ?
}
}
One solution is to specify the return type in the function definition to maintain object literal freshness.
const serviceMap: Test = {
getOperationLogListByConditions(conditions: any):
AxiosRequestConfig {
const {
currentPageIndex,
createTimeStart,
createTimeEnd,
...rest
} = conditions
// No type assertion
// object literal is fresh
// excess property check is triggered
return {
url: '/operateLog/page',
method: 'GET',
params: {
...rest,
pageNo: currentPageIndex,
createTimeStart: encodeURIComponent(createTimeStart),
createTimeEnd: encodeURIComponent(createTimeEnd)
},
a:"" // Error message
}
}
}
Answered By - Jerboas86
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.