SAP Fiori开发中的JavaScript基础知识8 - 分支,循环,函数,高阶函数

2024-03-30 05:28

本文主要是介绍SAP Fiori开发中的JavaScript基础知识8 - 分支,循环,函数,高阶函数,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1. 前言

JavaScript中分支和循环的概念和ABAP中类似,在此仅给出了语法和简单的示例。本文将着重介绍JavaScript中的“一等公民” - 函数Function。

2. 分支

在JavaScript中,实现条件分支的语法有三种,分别是if, swtich和三元表达式。

2.1 if…else

它们的语法如下:

if( ){

}
else if ( ) {

}
else{

}

2.2 switch

switch ( ) {
case 1:
break;
case 2:
break;
default:
break;
}

2.3 三元表达式

三元表达式: var result = (iNum < 0) ? “Negative” : “Positive”

2.4 示例代码:

let num = 10;if (num > 10) {console.log('num is greater than 10');
} else if (num < 10) {console.log('num is less than 10');
} else {console.log('num is equal to 10');
}switch (num) {case num > 10:console.log('num is greater than 10');break;case num < 10:console.log('num is less than 10');break;default:console.log('num is equal to 10');break;
}let result = (num < 0) ? "Negative" : "Positive";
console.log(result);  // 输出 Positive

3. 循环

在JavaScript中,实现循环有三种方式,分别是for, while和do-while。

2.1 for

它们的语法如下:

for (var i = 0 ; i < 5; i ++){

}

遍历对象属性
for (var prop in obj){

}

遍历数组内容
for (var item of arr){

}

示例代码:

let obj = {key1: 'value1',key2: 'value2',key3: function () { },key4: ['content1', 'content2']
};let arr = ['item1', 'item2'];for (let i = 0; i < 5; i++) {console.log(i);
}for (prop in obj) {console.log(prop);
}for (item of arr) {console.log(item);
}

2.2 while, do-while

示例代码:

let i = 0;while (i < 5) {console.log(i);i++;
}do {console.log(i);i++;
} while (i < 10);

4. 函数

在JavaScript中,函数是一种可重用的代码块,可以接受输入(参数),并返回输出(结果)。函数可以使代码更易于阅读和维护,同时避免重复。

对于传统的ABAP开发人员,要注意区分JavaScript中函数的概念与ABAP中的function概念在设计上的不同。

  1. JavaScript中的函数也是一种 值类型。函数的输入,输出参数都也可以是函数。
  1. JavaScript函数只能有一个返回值。但是,如果你需要返回多个值,你可以通过返回一个对象或数组来实现。
  1. JavaScript中函数的输入参数、输出参数都没有类型的(变量无类型)
  1. JavaScript的函数调用时,并不要求输入所有的参数

4.1 函数的声明

函数使用function关键字声明,后跟函数名称和括号内的参数列表。函数体(即要执行的代码)包含在大括号中。

function greet(name) {return "Hello, " + name;
}

在上述代码中,greet是一个接受一个参数name的函数,返回一个字符串。

4.2 函数的调用

要调用(或执行)函数,使用函数名称后跟括号和要传递的参数。

let message = greet("Alice");
console.log(message);  // 输出 "Hello, Alice"

4.3 匿名函数和函数表达式

函数也可以是匿名的,即没有名称。这些通常用作函数表达式,或者作为其他函数的参数(如回调函数)。

let greet = function(name) {return "Hello, " + name;
}console.log(greet("Bob"));  // 输出 "Hello, Bob"

4.4 箭头函数

ES6引入了箭头函数,这是创建函数的更简洁的语法。

let greet = (name) => {return "Hello, " + name;
}console.log(greet("Charlie"));  // 输出 "Hello, Charlie"

如果箭头函数只有一个参数并且函数体只有一行,那么可以省略括号和return关键字:

let greet = name => "Hello, " + name;console.log(greet("Dave"));  // 输出 "Hello, Dave"

4.5 复杂函数设计

4.5.1 返回对象 / 数组

例如,如果你想返回多个值,你可以将它们放在一个对象中:

function getSize(width, height, depth) {let area = width * height;let volume = width * height * depth;let sizes = {'area': area, 'volume': volume};return sizes;
}let result = getSize(3, 2, 3);
console.log(result.area);   // 输出 6
console.log(result.volume); // 输出 18

在上述代码中,getSize函数返回一个包含area和volume属性的对象。

或者,你也可以将它们放在一个数组中:

function getSize(width, height, depth) {let area = width * height;let volume = width * height * depth;return [area, volume];
}let result = getSize(3, 2, 3);
console.log(result[0]); // 输出 6
console.log(result[1]); // 输出 18

在这个例子中,getSize函数返回一个包含area和volume的数组。

4.5.2 高阶函数(输入参数/输出也为函数)

JavaScript中的函数可以接受其他函数作为参数。这种类型的函数通常被称为高阶函数

以下是一个例子,其中一个函数接受另一个函数作为参数:


function greet(name) {return "Hello, " + name;
}function shout(func, name) {let message = func(name);console.log(message);
}shout(greet, "Alice");  // 输出 "Hello, Alice"

在上述代码中,shout函数接受两个参数:一个函数func和一个字符串name。shout函数调用func函数,将name作为参数。

这种模式在JavaScript中非常常见,特别是在处理异步操作(如网络请求)或在数组方法(如map,filter和reduce)中时。

以下是一个例子,其中一个函数返回另一个函数:

function createGreet(name){return function(){return "Hello," + name;}
}let greetAlice = createGreet("Alice");
console.log(greetAlice()); // 输出 "Hello, Alice"

在上述代码中,createGreeting函数接受一个参数name,并返回一个新的函数。这个新的函数在被调用时会打印一条问候语。

这种模式在JavaScript中非常常见,特别是在函数式编程和闭包中。

4 小结

本文介绍了JavaScript中分支和循环的语法,同时详细介绍了函数的概念,并比较了与ABAP语言中Function概念的异同。希望对你有帮助!

这篇关于SAP Fiori开发中的JavaScript基础知识8 - 分支,循环,函数,高阶函数的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


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

相关文章

Spring Boot循环依赖原理、解决方案与最佳实践(全解析)

《SpringBoot循环依赖原理、解决方案与最佳实践(全解析)》循环依赖指两个或多个Bean相互直接或间接引用,形成闭环依赖关系,:本文主要介绍SpringBoot循环依赖原理、解决方案与最... 目录一、循环依赖的本质与危害1.1 什么是循环依赖?1.2 核心危害二、Spring的三级缓存机制2.1 三

在Spring Boot中浅尝内存泄漏的实战记录

《在SpringBoot中浅尝内存泄漏的实战记录》本文给大家分享在SpringBoot中浅尝内存泄漏的实战记录,结合实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧... 目录使用静态集合持有对象引用,阻止GC回收关键点:可执行代码:验证:1,运行程序(启动时添加JVM参数限制堆大小):2,访问 htt

SpringBoot集成Milvus实现数据增删改查功能

《SpringBoot集成Milvus实现数据增删改查功能》milvus支持的语言比较多,支持python,Java,Go,node等开发语言,本文主要介绍如何使用Java语言,采用springboo... 目录1、Milvus基本概念2、添加maven依赖3、配置yml文件4、创建MilvusClient

浅析Java中如何优雅地处理null值

《浅析Java中如何优雅地处理null值》这篇文章主要为大家详细介绍了如何结合Lambda表达式和Optional,让Java更优雅地处理null值,感兴趣的小伙伴可以跟随小编一起学习一下... 目录场景 1:不为 null 则执行场景 2:不为 null 则返回,为 null 则返回特定值或抛出异常场景

SpringMVC获取请求参数的方法

《SpringMVC获取请求参数的方法》:本文主要介绍SpringMVC获取请求参数的方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下... 目录1、通过ServletAPI获取2、通过控制器方法的形参获取请求参数3、@RequestParam4、@

shell编程之函数与数组的使用详解

《shell编程之函数与数组的使用详解》:本文主要介绍shell编程之函数与数组的使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录shell函数函数的用法俩个数求和系统资源监控并报警函数函数变量的作用范围函数的参数递归函数shell数组获取数组的长度读取某下的

使用Python开发一个带EPUB转换功能的Markdown编辑器

《使用Python开发一个带EPUB转换功能的Markdown编辑器》Markdown因其简单易用和强大的格式支持,成为了写作者、开发者及内容创作者的首选格式,本文将通过Python开发一个Markd... 目录应用概览代码结构与核心组件1. 初始化与布局 (__init__)2. 工具栏 (setup_t

SpringBoot应用中出现的Full GC问题的场景与解决

《SpringBoot应用中出现的FullGC问题的场景与解决》这篇文章主要为大家详细介绍了SpringBoot应用中出现的FullGC问题的场景与解决方法,文中的示例代码讲解详细,感兴趣的小伙伴可... 目录Full GC的原理与触发条件原理触发条件对Spring Boot应用的影响示例代码优化建议结论F

springboot项目中常用的工具类和api详解

《springboot项目中常用的工具类和api详解》在SpringBoot项目中,开发者通常会依赖一些工具类和API来简化开发、提高效率,以下是一些常用的工具类及其典型应用场景,涵盖Spring原生... 目录1. Spring Framework 自带工具类(1) StringUtils(2) Coll

SpringBoot条件注解核心作用与使用场景详解

《SpringBoot条件注解核心作用与使用场景详解》SpringBoot的条件注解为开发者提供了强大的动态配置能力,理解其原理和适用场景是构建灵活、可扩展应用的关键,本文将系统梳理所有常用的条件注... 目录引言一、条件注解的核心机制二、SpringBoot内置条件注解详解1、@ConditionalOn