当前位置:网站首页>Typescript basic operations
Typescript basic operations
2022-07-06 16:53:00 【Society, you Lei brother, life is hard, don't bend down】
Interface
TS Interface, as I understand it, is a specification in object-oriented programming , After defining the interface, don't worry about the internal state data of the function , It only stipulates that certain methods must be provided in this batch of classes , Meet the specified development needs like this .
Property type interface
interface Iperson{
//? Represents an optional parameter
firstname?:string;
lastname:string
}
function showFullName(person:Iperson){
return person.firstname+person.lastname
}
let person = {
firstname:'ren',
lastname:'jialei',
age:8
}
console.log(showFullName(person))
console.log(showFullName({
lastname:'jialei'}))
Function type interface
interface encrypt{
(key:string,value:string):string
}
var md5:encrypt = function(key:string,keyvalue:string):string{
return key+keyvalue
}
console.log(md5('ren','jialei'));
Class type interface Constraints on classes , Similar to abstract classes
interface Animail{
name:string;
eat(foot:string):void
}
// Class type interfaces can also implement inheritance
interface Person extends Animail{
work():void
}
//Dog This class should implement Animail Interface
class Dog implements Animail{
name:string
constructor(name:string){
this.name=name
}
eat(){
console.log(this.name+' Eating rats ')
}
}
//LEIGE This class should implement Person This interface
class LEIGE implements Person{
name:string = 'renjialei'
work(){
console.log(this.name+' Like to write code ')
}
eat(){
console.log(this.name+' I like to eat fruit ')
}
}
let dog = new Dog(' kitten ');
let leige = new LEIGE();
dog.eat();
leige.eat();
leige.work();
Decorator
Decorators are one way , It can be injected into classes , Method , Expand their functions on attribute parameters
Class decorator
Class decorators apply constructors , That is, the parameters we get target Is the constructor of the class .
function logclass(params:string){
return function(target:any){
// It is equivalent to defining methods on the prototype of a class
target.prototype.eat=()=>{
console.log(' Brother Lei likes eating watermelon ');
}
}
class HttpClient{
@logUrl('xxxxxx')
url='www.baidu.com'
constructor(){
}
@logMethod('www.baidu.com')
getItem(){
}
setItem(@logArg('xxx') uuid:any){
}
}
var http:any = new HttpClient();
Attribute decorator
Property decorator expressions are called at run time as functions , Respectively pass in the following 2 Parameters :
The first parameter is the constructor of the class for static members , For instance members are prototype objects of a class .
The second parameter is the name of the member .
function logUrl(params:string){
return function(target:any,attr:any){
target[attr]=params;
console.log(target,attr);
}
}
Method decorator
The function takes three arguments , Namely :
The first parameter is the constructor of the class for static members , For instance members are prototype objects of a class .
Member's name
The property descriptor of the member
function logMethod(params:string){
return function(target:any,attr:any,desc:any){
target.run = ()=>{
// console.log('i am running');
}
}
}
Method parameter decorator
Receive three parameters
The first parameter is the constructor of the class for static members , For instance members are prototype objects of a class .
Parameter name
The index of the parameter in the function parameter list
function logArg(params:string){
return function(target:any,attr:any,index:number){
console.log(target)
console.log(attr)
console.log(index)
}
}
边栏推荐
- Educational Codeforces Round 122 (Rated for Div. 2)
- 谢邀,人在工区,刚交代码,在下字节跳动实习生
- ByteDance 2022 school recruitment R & D advance approval publicity meeting, students' top 10 issues
- @RequestMapping、@GetMapping
- [unsolved] 7-15 shout mountain
- Solve the single thread scheduling problem of intel12 generation core CPU (II)
- Fdog series (VI): use QT to communicate between the client and the client through the server (less information, recommended Collection)
- ~86m rabbit practice
- Fdog series (III): use Tencent cloud SMS interface to send SMS, write database, deploy to server, web finale.
- 字节跳动技术面试官现身说法:我最想pick什么样的候选人
猜你喜欢
Audio and video development interview questions
Detailed explanation of FLV format
~68 Icon Font introduction
The concept of spark independent cluster worker and executor
Shell_ 02_ Text three swordsman
Chapter 5 detailed explanation of consumer groups
图像处理一百题(11-20)
Error occurred during initialization of VM Could not reserve enough space for object heap
图像处理一百题(1-10)
姚班智班齐上阵,竞赛高手聚一堂,这是什么神仙编程大赛?
随机推荐
DS18B20数字温度计系统设计
~71 abbreviation attribute of font
One hundred questions of image processing (1-10)
第6章 Rebalance详解
[unsolved]7-14 calculation diagram
~87 animation
第5章 消费者组详解
LeetCode 1584. Minimum cost of connecting all points
~Introduction to form 80
我走过最迷的路,是字节跳动程序员的脑回路
LeetCode 1560. The sector with the most passes on the circular track
Solr standalone installation
LeetCode 1562. Find the latest group of size M
[unsolved] 7-15 shout mountain
Eureka single machine construction
Some instructions on whether to call destructor when QT window closes and application stops
~75 background
LeetCode 1561. The maximum number of coins you can get
Chapter 5 detailed explanation of consumer groups
~78 radial gradient