如何在JS / TS函数编程中将箭头函数用作属性

时间:2019-07-01 17:38:42

标签: javascript typescript functional-programming

假设我将使用TypeA:一些参数,而TypeB:类本身的类型来构造函数类的构造函数,我可以使用

functionName(argument: TypeA): TypeB {
    this.property = argument;
    return this;
  }

但不能使用

property: (argument: TypeA): TypeB => ({
    property: argument,
    ...
  })

我了解这是由于使用箭头功能和普通功能时this的不同。

然后,我该如何使用箭头功能,使其与第一种正常功能的情况一样工作?

示例:

import personConst from './personConst';
// const personConst: { [key: string]: UnitBase } = {
//   brah: {
//     name: "Thomas",
//     age: 25,
//     gender: "male"
//   },
//   hoge: {
//     name: "Sarah",
//     age: 29,
//     gender: "female"
//   },
//   ...
// }

import { PersonBase } from './PersonBase';
// export interface UnitBase {
//   name: string;
//   age: number;
//   gender: string;
// }


interface Person extends PersonBase {
  income: number;
  zip: number;
  setIncome(newIncome: number): this;
  setZip(newZip: number): this;
}

const person = (key: string): Person => ({
  income: 50000,
  zip: 50000,
  setIncome: (newHp: number): Person => ({
    income: newIncome,
    ... // Error: Expression expected.
  }),
  setZip(newZip: number): Person {
    this.zip = newZip;
    return this; // OK
  },
  ...personConst[key]
});

export default person;

2 个答案:

答案 0 :(得分:1)

我不确定我是否理解您的问题,但是如果您想使用string(163146) "%PDF-1.4 %???? 1 0 obj << /Type /Catalog /Pages 2 0 R /Metadata 63 0 R >> endobj 2 0 obj << /Type /Pages /Kids [ 01 0 R 8 0 R ] /Count 2 /MediaBox [ 0 0 618 003 ] >> endobj 3 0 obj << /ModDate (D:20190907120701+02'00') /CreationDate (D:20130904150701+02'00') /Title (F:/Data/Composer/0510.IN.PDF) /Subject (NONE) /Author (User: Windows XP/ User) /Creator (PDF/PReS Version: 6.1.1 ) /Producer ([ClibPDF Library 2.02-r1-2] Windows XP) >> endobj 5 0 obj << /Type /Page /Parent 2 0 R /Resources << /Font << /Fcpdf0 30 0 R >> /XObject << /6p 8 0 R >> /ProcSet 7 0 R >> /MediaBox [ 0 0 595 842 ] /CropBox [ 0 0 595 842 ] /Rotate 0 /Contents 6 0 R >> endobj 6 0 obj << /Length 246 /Filter [ /FlateDecode ] >> stream x??QMk?@?'1?bia=?!?L6I7?V??AB??AQ(???_:?T?"$;<vf??7?I??c?(?(?????F??4?E?<L?ku????xs???w*?? ??FGD?AlY?{,???E??-A????u?o?/^^O%|??>???\?T?Y ??iS??5q?t?C2I??q???c>?V?z?8:??C??#???p/?\???0F)k#?1???U?`Sa?????.???PyoY endstream endobj 7 0 obj [ /PDF /Text /ImageC ] endobj 8 0 obj << /Type /XObject /BBox [ 0 0 595 842 ] /Filter /FlateDecode /FormType 1 /Length 17871 /Matrix [ 1 0 0 1 0 0 ] /Resources << /ColorSpace << /CS0 27 0 R /CS1 26 0 R /CS10 27 0 R /CS11 26 0 R /CS12 27 0 R /CS13 26 0 R /CS14 29 0 R /CS15 28 0 R /CS16 29 0 R /CS17 28 0 R /CS18 29 0 R /CS19 28 0 R /CS2 27 0 R /CS20 29 0 R /CS21 28 0 R /CS22 29 0 R /CS23 28 0 R /CS24 29 0 R /CS25 28 0 R /CS26 29 0 R /CS27 28 0 R /CS28 29 0 R /CS29 28 0 R /CS3 26 0 R /CS30 29 0 R /CS31 28 0 R /CS32 29 0 R /CS33 28 0 R /CS34 29 0 R /CS35 28 0 R /CS36 29 0 R /CS37 28 0 R /CS4 27 0 R /CS5 26 0 R /CS6 27 0 R /CS7 26 0 R /CS8 27 0 R /CS9 26 0 R >> /ExtGState << /GS6 25 0 R >> /Font << /TT24 21 0 R /TT25 17 0 R /TT26 13 0 R /TT27 9 0 R >> /ProcSet [ /PDF /Text ] >> /Subtype /Form >> stream x??}i?$????K?l2?@?:gu?F??????r$?im?1k???????E???????;?O???=????????????7?????o????oO??????}???O??uz?????z?O????p=M???4n~??w/??;|????OGw>???>???9???cSn'????b????5????????w??\????????_~????t?w8N??9??~?f}??qxy??????o???????M??????'?Or4|?O????|??y??o???=?= ?y?p??1vx?)??7???on????.??w?????-??K??|y:?w}d??????:???>uv??:?.???y???6?nm{????E0\??????n?????B??ra*??x?t?K^???'??7?i?8???]?p?D}??T??-?lcN???_????Q7h??n??s???n==? ??!? ?@~s??F8??G?0?K??e??ul?3n???g??????6?0?a???$??L?j?W??9~U??{?G?U??9fO?????rL?K[Z??E?!????}T|?yr/?}?+?O???6??um????a??E^?K??P??U:??+?pL??N?Q????^\?{a???[??k?N?t/????K{?Ek_??? ???t??U#??\O;??????????5??~??????? K??O??9?????</?(?*7????u?n?xa?4??rbd??^N?^z??]?7?T????r?f????|Y?ij?mC'u3???o?4On?r???Kd+ ?.??t?6??(?fa+5?$??5?}??,??ZB?Fe??E5W(??.J7??yk1??u?F\?o:^???hK???vNH?]?K???r?????U??H?d????? X???[e3 7???????qz?K?7c1>? ??o?y??Q????<?8???G4??????^?u?&??&?r???'?o??LN?_?? l??1an+G9&?m?1~?'?e?<? !??o?-??????J?r???x??`?/o?-??=????y?,????R?0y?? ??.rz|3?GhmS? U?!t????A?Oi????}?6??ct5?i???|?.?&?\??]???2?n?\?<7? ?>?4??"X1M?j??>H??}???iX??~???^?????q?????) ??;2?????'??bS????d???N?/L???K?\n?=n~&F?????fd;m?4?c????Xf??'9?D?s????`4,Mg?f????F??n?~-?????+@l??1??z?N�????l??$??+J?N6? ???}:j8Q?????$L?|C?&???^ch?70??C(?????&??????8B?L.??A??D0]?5?+?)??d?X?>??0C??|?A?&?Z???H??J?0?(m?Rr?Y???*???3?o???{??c?[???E?5 ????q?k??:V;T4?+T??>*B(???|I??}?T??7?N??�?g?W?'??U?'2v`? 4????O?)??x?*r?,?b^7??/3??y(M?Nnnd??i??????:?,?|??EYtx/]?g?!?sgi-{?i<?"????????`??4?[�??h?s*???L?,@??8???G?-(%???=?o/A?????!?????_"??%????_??y???a?%???G4?r?|?M??@z=?~???&v?J?]?<?tQ? ??n?�j?GHh[???&J??!?p?l?b?_w?\ ?#?dXb??a}?l??????S5"D~?5??w??n?.v?C?^?E??;?]????#????a???Z>Tb?;Et U?<?; pl?k???b+?m??`????Is?$3<??6??K?w?? rz???e??i@?5$;-??q4Z"????(_5??E??L?ayv y?s?M?????R?p?T8?-B?o??i?_?~\??????t??]7a?? K~9!? ?_y.H??8??5z?%?B?w?Vy?}`!h1??? ?v?u?i????????r?&?t?"??%Om??:???a3Y??j?P7?N???(?zu???6I$Z/?"??v^??? mp??/? h?I?'?V?9'Iexj}?z?t?S?*Y?m3i?J?H??Q???3???dUd?fk???}m????k???!H?%I>??????"???[\|*V??~J??????i-??Z??H??ayb????Ca?i^cP??i???r????????L??4??#??RH???(?Jb??[f??N?1;???&. ???Q???~~???e;?&[? ???0>wRI???s??c%"r???x??n?r}?b??j?h?MO???? q??'?@v$?????g?Xd?h?Pl:?M?\???9B5�?G?j??IE?J?~??????M ??A?<?[???/P7n??Q??0ej?_c?J?u??+J?xl???f?)?0? K?*??W519??uy??r6}?? ?N???s?)?X???????2-?j??b\????M{?f?????E?|?-???x+?zN?f�3?)^k'?qR????zevW?,d?V??????{6!?? ??@j?y?,?BZQ????!?eW???M?? U???D Q)vWL?N?&??T?q_C?j??@?p??????V????It?.??[??-g<]i?.T�?6%|?W??n?3?x?xx??,???b&?e??Q]???Z?&l"?L???S??N ??F???+W??y??�%??Q-oc????d?S?6???/ ?_??&?t???8p??U??�Z? ?�+^???J???? r ?k??wIB?o?P?Z?]?X???c??6N??I&w?????i"I\??v2Jr?[?(??4?}?q???t?4??!?????B??<o???Q[??Q??A???mG???Q?<???f?P?? ?????????Lp1??6F ?L;??J???????/????l?i??u?1??rw? ??c????????G??W??R?o?|?fz EA????JA?Z? ???0?b?EHP?p??7=?]g>d'?mk?3?5M|?E?8?_?T.?,???M?,dnP?L???hs=?;&???????(L?????4_??a?R^?LX??o?v+????7???????(?P??)b??A$?f??#?GF1S??????8b??RM.>?_?!Ab?`?Fs???+?#?HV??iM44?;u<C?????M]H?]?XQ1?f?JG????n1 ?R???8?????m?<?}D???)?W3?�??k???T???SI???G??G ?hS*???bD%?=p?f2?SO?K?5??9?^8??$??v??5?7.4k%_???}?Li?h?MHqf?2q?Rj-???,'?k?o?Y_zk?W?? H?QTs>c???fx?g???D|?H?d???V?]96?3?V?1?(????u?e,?B?+ ECl7D???b?C74???l?Bt 上下文,则不应直接使用箭头功能this。相反,您可以只使用更详细的匿名函数x => y语法:

(function(x){ return y })

认为表现为您想要的:

const person = (key: string): Person => ({
  income: 50000,
  zip: 50000,
  setIncome: function(newIncome: number): Person { // anonymous function
    return {
      ...this, 
      income: newIncome
    };
  },
  setZip(newZip: number): Person {
    this.zip = newZip;
    return this; // OK
  },
  ...personConst[key]
});

但是我不能从你的问题中分辨出来。无论如何,希望能有所帮助;祝你好运!

Link to code

答案 1 :(得分:0)

您不能在任何地方使用粗箭头。它最常用的: -使用粗箭头(=>),无需使用“功能”关键字。其匿名功能 -为了避免在构造函数中进行绑定,可以使用(=>) -对于doSomething(){}之类的函数,您不能在此处使用粗箭头。但是,例如:function(){},您可以在此处使用lambda。