java script 中括号_typescript对象里中括号引用应该怎么写才正确？

时间: 2019-10-27 11:37:52

标签:

typescript

const Tween = {

Linear: (t: number, b: number, c: number, d: number) => (c * t) / d + b,

Quad: {

easeIn: (t: number, b: number, c: number, d: number) => c * (t /= d) * t + b,

easeOut: (t: number, b: number, c: number, d: number) => -c * (t /= d) * (t - 2) + b,

easeInOut: (t: number, b: number, c: number, d: number) => ((t /= d / 2) < 1 ? (c / 2) * t * t + b : (-c / 2) * (--t * (t - 2) - 1) + b),

}

}

type TweenFunc =

| 'Linear'

| 'Quad.easeIn'

| 'Quad.easeOut'

| 'Quad.easeInOut';

export default (tween: TweenFunc) => {

const [name, func] = tween.split('.');

if (!func) return Tween.Linear;

// Tween[name]这里会报错

// element implicitly has an any type because expression of type string cant be used to index

return Tween[name][func];

};

谢过各位大佬

最佳答案

TypeScript 目前还不支持字面量类型拆分组合，你可以

Tween 扁平化，不搞多层。

强制转换 split 出来的类型，这需要你同时手动维护两个 type。

或者 tween 用 string 类型，对 split 出来的结果做额外判断，确保 Tween 中有对应的域。

按 2 的例子：

const Tween = {

Linear: (t: number, b: number, c: number, d: number) => (c * t) / d + b,

Quad: {

easeIn: (t: number, b: number, c: number, d: number) => c * (t /= d) * t + b,

easeOut: (t: number, b: number, c: number, d: number) => -c * (t /= d) * (t - 2) + b,

easeInOut: (t: number, b: number, c: number, d: number) => ((t /= d / 2) < 1 ? (c / 2) * t * t + b : (-c / 2) * (--t * (t - 2) - 1) + b),

}

}

type TweenFunc =

| 'Linear'

| 'Quad.easeIn'

| 'Quad.easeOut'

| 'Quad.easeInOut';

+type TweenNameFuncPair =

+ | ['Linear']

+ | ['Quad', 'easeIn']

+ | ['Quad', 'easeOut']

+ | ['Quad', 'easeInOut']

export default (tween: TweenFunc) => {

+ const pair = tween.split('.') as TweenNameFuncPair;

+ if (!pair[1]) return Tween.Linear;

+ return Tween[pair[0]][pair[1]];

};