TypeScript(七) 函数

news2024/11/24 11:56:25

1. TypeScript 函数

1.1. 函数的定义

  函数就是包裹在花括号中的代码块,前面使用关键字function。
语法:

// An highlighted block
function function_name() {
    // 执行代码
}

实例:

function test() {   // 函数定义
    console.log("我就是创建的名称为test的函数") 
} 

1.2. 调用函数

  函数只有通过调用才可以执行函数内的代码。
语法:

function_name()

实例:

function test() {   // 函数定义
    console.log("我就是创建的名称为test的函数") 
} 
test(); // 调用函数

1.3. 函数返回值

  有时我们希望函数将执行的结果返回到调用它的地方,这个需要通过return语句来实现,使用return语句时,函数就会停止,并返回指定的值。
语法:

function function_name(): return_type { 
    // 语句
    return value; 
}

说明:
(1)return_type是返回值的类型。
(2)return关键字后跟着的是要返回的结果。
(3)一般情况下,一个函数只有一个return语句
(4)返回值的类型需要与函数定义的返回类型(return_type)一致。
实例:

// 函数定义
function getName(): string { // 返回一个字符串
    return "zhangDM" 
} 
function caller() { 
    var msg = getName() // 调用 getName() 函数 
    console.log(msg) 
} 
 // 调用函数
caller()

(5)实例中定义了函数getName(),返回值的类型是string
(6)getName()函数通过return语句返回给调用它的地方,即变量msg,之后输出该返回值。

1.4. 带参数函数

  上述咱们定义的函数都是无参函数,有参数函数是指可向函数传递值,并且向函数可以发送多个参数,每个参数使用“,”逗号分隔。
语法:

function func_name( param1 [:datatype], param2 [:datatype]) {   
}

(1)param1 、param2为参数名
(2)datatype为参数类型
实例:

function add(x: number, y: number): number {
    return x + y;
}
console.log(add(2,3))

执行结果:5

1.5. 可选参数与默认参数

  在TypeScript函数里,如果我们定义了参数,则我们就必须传入这些参数,除非将这些参数设置为可选,可选参数使用问号标识“?”。
实例:

function buildName(firstName: string, lastName?: string) {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}
let result1 = buildName("Bob");  // 正确
let result2 = buildName("Bob", "Adams", "Sr.");  // 错误,参数太多了
let result3 = buildName("Bob", "Adams");  // 正确

默认参数格式:

function function_name(param1[:type],param2[:type] = default_value) {

}

注意:参数不能同时设置为可选和默认。

实例:

function calculate_discount(price:number,rate:number = 0.50) { 
    var discount = price * rate; 
    console.log("计算结果: ",discount); 
} 
calculate_discount(1000) 
calculate_discount(1000,0.30)

执行结果:
在这里插入图片描述

1.6. 剩余参数

  有一种情况,我们不知道要传入多少个参数,这个时候就可以使用剩余参数来定义。
实例:

function addNumbers(...nums:number[]) {  
    var i;   
    var sum:number = 0; 
    
    for(i = 0;i<nums.length;i++) { 
       sum = sum + nums[i]; 
    } 
    console.log("和为:",sum) 
 } 
 addNumbers(1,2,3) 
 addNumbers(10,10,10,10,10)

执行结果:
在这里插入图片描述

1.7. 匿名函数

  匿名函数是一个没有函数名的函数。
  匿名函数在程序运行时动态声明,除了没有函数名外,其他的与标准函数一样。
  我们可以将匿名函数赋值给一个变量,这种表达式就成为函数表达式。
语法:

var res = function( [arguments] ) { ... }

  匿名函数自调用是在函数后使用()即可:

(function () { 
    var x = "Hello!!";   
    console.log(x)     
 })()

**执行结果:**Hello!!

1.8. Lambda函数

  Lambda 函数也称之为箭头函数。
  箭头函数表达式的语法比函数表达式更短。
语法:

( [param1, param2,…param n] )=>statement;

实例:

var foo = (x:number)=>10 + x 
console.log(foo(100))      //输出结果为 110

执行结果:110
  函数是一个语句块:

( [param1, param2,…param n] )=> {
    // 代码块
}

  我们可以不指定函数的参数类型,通过函数内来推断参数类型:

var func = (x)=> { 
    if(typeof x=="number") { 
        console.log(x+" 是一个数字") 
    } else if(typeof x=="string") { 
        console.log(x+" 是一个字符串") 
    }  
} 
func(12) 
func("Tom")

执行结果:
12 是一个数字
Tom 是一个字符串

1.9. 函数重载

  重载是方法名字相同,而参数不同,返回类型可以相同也可以不同。
  每个重载的方法(或者构造函数)都必须有一个独一无二的参数类型列表。
(1)参数类型不同:

function disp(string):void; 
function disp(number):void;

(2)参数数量不同:

function disp(n1:number):void; 
function disp(x:number,y:number):void;

(3)参数类型顺序不同:

function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

  如果参数类型不同,则参数类型应设置为 any。
  参数数量不同你可以将不同的参数设置为可选。
实例:

function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 
function disp(x:any,y?:any):void { 
    console.log(x); 
    console.log(y); 
} 
disp("abc") 
disp(1,"xyz");

执行结果:
abc
undefined
1

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1421997.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Linux系统——文本三剑客

目录 一、grep 1.格式 2.选项 2.1 grep重定向 2.2grep -m 匹配到几次停止 2.3grep -i 忽略大小写 2.4grep -n 显示行号 2.5grep -c 统计匹配行数 2.6grep -A 后几行 2.7grep -C 前后三行 2.8grep -B 前三行 2.9grep -e 或 2.10grep -w 匹配整个单词 2.11grep -r…

聊聊百度造车

10月27日&#xff0c;极越-01上市&#xff0c;一个月后大幅降价&#xff0c;时至今日距离发布已经过去了两个月&#xff0c;官方迟迟不肯公布销量&#xff0c;实际情况大家也都心知肚明。 如今小米汽车技术发布会风头无两&#xff0c;而同一年宣布造车的极越却无人问津&#x…

ElementUI安装与使用指南

Element官网-安装指南 提醒一下&#xff1a;下面实例讲解是在Mac系统演示的&#xff1b; 一、开发环境配置 电脑需要先安装好node.js和vue2或者vue3 安装Node.js Node.js 中文网 安装node.js命令&#xff1a;brew install node node.js安装完后&#xff0c;输入&#xff1…

界面控件DevExtreme v23.2新版亮点 - 全新的Fluent主题

DevExtreme拥有高性能的HTML5 / JavaScript小部件集合&#xff0c;使您可以利用现代Web开发堆栈&#xff08;包括React&#xff0c;Angular&#xff0c;ASP.NET Core&#xff0c;jQuery&#xff0c;Knockout等&#xff09;构建交互式的Web应用程序。从Angular和Reac&#xff0c…

[力扣 Hot100]Day18 矩阵置零

题目描述 给定一个 m x n 的矩阵&#xff0c;如果一个元素为 0 &#xff0c;则将其所在行和列的所有元素都设为 0 。请使用 原地 算法。 出处 思路 在原数组上直接操作势必会出现“冗余”的0&#xff0c;即原本[i,j]处不是0&#xff0c;例如由于i行的其他位置有0导致[i,j]…

【深度学习每日小知识】Precision 精度

Precision 精度 精度是机器学习 &#xff08;ML&#xff09; 中分类器或预测器准确性的度量。它被定义为分类器做出的真正正预测数与分类器所做的正预测总数之比。换句话说&#xff0c;真正正确的是正面预测的比例。 精度是机器学习中的一个关键参数&#xff0c;因为它量化了…

Adobe Photoshop 2024 v25.4.0 - 专业的图片设计软件

Adobe Photoshop 2024 v25.4.0更新了&#xff0c;从照片编辑和合成到数字绘画、动画和图形设计&#xff0c;任何您能想象到的内容都能通过PS2024轻松实现。 利用人工智能技术进行快速编辑。学习新技能并与社区分享您的工作。借助我们的最新版本&#xff0c;做令人惊叹的事情从未…

Java中支持父类转子类,不支持子类转父类吗?

不&#xff0c;我的意思是正好相反。在 Java 中&#xff1a; 子类转父类&#xff08;向上转型&#xff09;&#xff1a;这是自动的且总是安全的。子类是父类的一个特化&#xff0c;因此子类的对象可以被视为是父类的一个实例。例如&#xff0c;如果 ExamineApproveNode 是 Base…

【Tomcat与网络3】Tomcat的整体架构

目录 1.演进1&#xff1a;将连接和处理服务分开 2演进2&#xff1a;Container的演进 3 再论Tomcat的容器结构 4 Tomcat处理请求的过程 5 请求的处理过程与Pipeline-Valve管道 在前面我们介绍了Servlet的基本原理&#xff0c;本文我们结合Tomcat来分析一下如何设计一个大型…

小程序真机调试websocket错误码1006

有心跳机制 模拟器上都没问题连接稳定 一到真机就30秒断连 怎么解决救救我T_T

Flink CEP实现10秒内连续登录失败用户分析

1、什么是CEP&#xff1f; Flink CEP即 Flink Complex Event Processing&#xff0c;是基于DataStream流式数据提供的一套复杂事件处理编程模型。你可以把他理解为基于无界流的一套正则匹配模型&#xff0c;即对于无界流中的各种数据(称为事件)&#xff0c;提供一种组合匹配的…

C#,欧拉数(Eulerian Number)的算法与源代码

1 欧拉数 欧拉数特指 Eulerian Number&#xff0c;不同于 Euler numbers&#xff0c;Eulers number 哦。 组合数学中&#xff0c;欧拉数&#xff08;Eulerian Number&#xff09;是从1到n中正好满足m个元素大于前一个元素&#xff08;具有m个“上升”的排列&#xff09;条件的…

C++ 之LeetCode刷题记录(二十三)

&#x1f604;&#x1f60a;&#x1f606;&#x1f603;&#x1f604;&#x1f60a;&#x1f606;&#x1f603; 开始cpp刷题之旅。 目标&#xff1a;执行用时击败90%以上使用 C 的用户。 118. 杨辉三角 给定一个非负整数 numRows&#xff0c;生成「杨辉三角」的前 numRows …

力扣hot100 括号生成 递归回溯 超简洁版

Problem: 22. 括号生成 Code 使用 static 会被复用 class Solution {List<String> ans new ArrayList<>();public List<String> generateParenthesis(int n){dfs(n, n, "");return ans;}/*** param l 左括号待补个数* param r 右括号待补个数*…

flask+django基于python的网上美食订餐系统_3lyq1

设计旨在提高顾客就餐效率、优化餐厅管理、提高订单准确性和客户的满意度。本系统采用 Python 语言作为开发语言&#xff0c;采用Django框架及其第三方库和第三方工具来进行开发。该方案分为管理员功能模块&#xff0c;商家功能模块以及用户前后功能模块三部分。开发前期根据用…

方法阻塞的解决方案之一

1、简单使用 一个h一个cpp文件 #pragma once #include <iostream> #include <thread> #include <atomic> #include <chrono> #include <string>class Person {public:struct dog {std::string name;int age;};public:void a(std::atomic<bo…

系统架构设计师-22年-下午题目

系统架构设计师-22年-下午题目 更多软考知识请访问 https://ruankao.blog.csdn.net/ 试题一必答&#xff0c;二、三、四、五题中任选两题作答 试题一 (25分) 说明 某电子商务公司拟升级其会员与促销管理系统&#xff0c;向用户提供个性化服务&#xff0c;提高用户的粘性。…

在线版XD,免费使用,功能全面,设计神器!

Adobe XD是什么软件&#xff1f; Adobe XD软件是一个结合设计和建立原型功能的一站式UX/UI设计平台。在XD软件中&#xff0c;数字团队可以进行移动应用、网页设计和原型制作。与此同时&#xff0c;Adobe XD软件也是一种跨平台设计产品&#xff0c;结合设计和建立原型功能&…

探索世界的奇妙之旅——Google Earth Pro(谷歌地球)软件介绍

Google Earth Pro&#xff08;谷歌地球&#xff09;是一款由谷歌公司开发的地图浏览和虚拟地球软件&#xff0c;为用户提供了全球范围内精确的地理浏览和探索功能。该软件整合了卫星图像、地图、地形、建筑物和3D视图等多种信息&#xff0c;让用户可以深入了解世界各地的地理特…