vue快速入门(十四)reduce求和

注释很详细,直接上代码

新增内容

  1. 非嵌套情况求和
  2. 嵌套情况求和

源码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><!-- 挂载点 --><div id="root"><button @click="add1">求第一个数组的和</button><button @click="add2">求第二个数组的和</button></div><!-- 导入vue的js代码 --><script src="./lib/vue2.js"></script><script>const app = new Vue({// Vue实例el: '#root',// 挂载点data: {// 数据arr1:[1,2,3,4,5],arr2:[{id:1,num:5},{id:2,num:6},{id:3,num:7},{id:4,num:8}]},methods: {// 方法add1(){//非嵌套情况求和let sum=this.arr1.reduce((total,curr)=>{return total+curr},0)console.log('第一个数组的和为:'+sum)},add2(){//嵌套情况求和let sum=this.arr2.reduce((total,curr)=>{return total+curr.num},0)console.log('第二个数组的和为:'+sum)}}})</script>
</body>
</html>

效果演示

在这里插入图片描述

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

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

相关文章

C++第十五弹---string基本介绍(一)

✨个人主页&#xff1a; 熬夜学编程的小林 &#x1f497;系列专栏&#xff1a; 【C语言详解】 【数据结构详解】【C详解】 目录 1、什么是STL 2、STL的版本 3、STL的六大组件 4、STL的重要性 5、如何学习STL 6、STL的缺陷 7、为什么学习string类 7.1、C语言中的字符串…

[C++][特殊类设计][单例模式]详细讲解

目录 1.[不能被拷贝]2.[只能在堆上创建对象]3.[只能在栈上创建对象]4.[请设计一个类&#xff0c;不能被继承]5.[只能创建一个对象(单例模式)]0. 设计模式1.单例模式2.饿汉模式3.懒汉模式4.单例对象释放问题 1.[不能被拷贝] 拷贝只会发生在两个场景中&#xff1a; 拷贝构造函数…

Google play开发者新手必看:2024最新最全的谷歌上架避坑指南

Google Play作为一个全球性的Android应用分发平台&#xff0c;吸引了无数开发者的目光。据统计&#xff0c;该平台的月活跃用户数已超过20亿&#xff0c;这无疑是一个巨大的市场。 但随着行业的发展&#xff0c;谷歌风控和审核机制不断升级&#xff0c;即便是经验丰富的开发者也…

Nginx配置文件修改结合内网穿透实现公网访问多个本地web站点

文章目录 1. 下载windows版Nginx2. 配置Nginx3. 测试局域网访问4. cpolar内网穿透5. 测试公网访问6. 配置固定二级子域名7. 测试访问公网固定二级子域名 1. 下载windows版Nginx 进入官方网站(http://nginx.org/en/download.html)下载windows版的nginx 下载好后解压进入nginx目…

抖音评论ID提取工具|视频关键词评论批量采集软件

抖音评论ID提取工具&#xff1a;批量抓取抖音评论 抖音评论ID提取工具是一款功能强大的软件&#xff0c;可以帮助您批量抓取抖音视频下的评论信息。通过输入关键词和评论监控词&#xff0c;即可进行评论的抓取&#xff0c;并提供评论昵称、评论日期、评论内容、命中关键词以及所…

C++更改文件名称,在文件名增加字符

void ChangeName(string filename) {char flagcharacter a; // 要在文件名前添加的标志字符int filelocation 0 ; // 暂存文件名起始下标int directoryend 0 ; // 暂存文件夹名结束下标for(int i (filename.length() - 1); i>0; i--)if(filenam…

嵌入式系统在智能家居与工业自动化等领域的应用创新

嵌入式系统在智能家居与工业自动化等领域的应用创新 随着科技的飞速发展&#xff0c;嵌入式系统已经渗透到我们生活的方方面面&#xff0c;特别是在智能家居和工业自动化领域&#xff0c;嵌入式系统的应用正带来前所未有的变革和创新。本文将深入探讨嵌入式系统在这两个领域的…

【CSDN活动】人工智能:前沿科技中的创业机遇与挑战

&#x1f308;个人主页: 鑫宝Code &#x1f525;热门专栏: 闲话杂谈&#xff5c; 炫酷HTML | JavaScript基础 ​&#x1f4ab;个人格言: "如无必要&#xff0c;勿增实体" 文章目录 人工智能&#xff1a;前沿科技中的创业机遇与挑战一、AI技术的快速发展与应用拓…

QML学习记录:并排页面切换效果的实现

定义一个ApplicationWindow窗口&#xff0c;通过添加SwipeView和PageIndicator来实现页面切换效果和显示当前页面位置的指示器。 ApplicationWindow {id:rootvisible: truewidth: 340height: 480title: qsTr("SwipeView") // 定义一个SwipeView用于页面切换效果 Swip…

Oracle ADG主备切换

文章目录 一、主库切换备库二、备库切换主库三、新备库&#xff08;原主库&#xff09;启用实时日志应用四、新主库切换日志五、查看当前主备库状态 一、主库切换备库 # 查看切换前的状态&#xff0c;确认当前从操作的是主库 select name,open_mode,switchover_status from v$…

Java每日一题

我的思路是: 通过示例我们可以判断出一共会有四种情况1.正常情况、2.负数、3.最后一位是0、4.反转后越界。 所以我就打算分为四步进行处理&#xff1a;首先我会创建两个StringBulider&#xff0c;一个用来存储原数字&#xff0c;一个用来存储结果集。 第一种情况进行处理的思路…

无人机倾斜摄影技术在智慧城市中的应用

随着智慧城市的不断发展和完善&#xff0c;新兴热门技术也不断崛起。无人机技术作为其中之一&#xff0c;具有操作简单、应用灵活等优势&#xff0c;受到了各个行业的青睐。现阶段&#xff0c;无人机技术与5G移动通信系统、人工智能系统深度融合&#xff0c;实现了无人机技术的…

LLMs之FreeGPT35:FreeGPT35的简介、安装和使用方法、案例应用之详细攻略

LLMs之FreeGPT35&#xff1a;FreeGPT35的简介、安装和使用方法、案例应用之详细攻略 目录 FreeGPT35的简介 FreeGPT35的安装和使用方法 1、部署和启动服务 Node 2、使用 Docker 部署服务&#xff1a; 运行 Docker 容器以部署服务 使用 Docker Compose 进行更方便的容器化…

抖音视频无水印采集软件|视频关键词批量提取工具

轻松实现抖音视频批量下载&#xff0c;让营销更高效&#xff01; 随着抖音视频在营销领域的日益普及&#xff0c;如何高效地获取并管理大量视频资源成为了市场人员的重要挑战。针对这一需求&#xff0c;我们推出了一款强大的音视频无水印采集软件&#xff0c;帮助您轻松实现批量…

LeetCode刷题笔记第746题:使用最小花费爬楼梯

LeetCode刷题笔记第746题&#xff1a;使用最小花费爬楼梯 题目&#xff1a; 花费每个楼梯的代价就能向上爬一个或两个楼梯&#xff0c;求最终登顶需要的最小代价。 想法&#xff1a; 使用动态规划的思想将每个楼梯向上爬需要花费的最小代价记录下来&#xff0c;最终获得登顶…

C++笔记:学习使用C++

一.命名空间 namespace 名字 作用&#xff1a;一种用来隔离命名冲突的机制&#xff0c;是C的一项特性 例如&#xff1a; #include<iostream>namespace A {void func_1() {printf("hello world A\n");return ;} }namespace B {void func_1() {printf("hell…

MySQL——查询数据的处理

一、并列 连接两个数据列的值&#xff0c;并进行输出的格式化处理&#xff08;显示为一种统一的格式&#xff09; concat( 列 1 格式化字 符 ) mysql> select concat(vend_name, vend_country) from vendors; --------------------------------- | concat(vend_name, ve…

某211大学src挖掘

信息收集 这次信息收集比较玄学&#xff0c;起初就是用谷歌语法搜了一下带注册功能的点 然后就找到了本次目标站的注册点: 这边的学号啥的我都是不知道的而且这边最后显示的不是注册&#xff0c;显示的是提交所以可以断定注册账号得需要管理员审核信息才能注册&#xff0c;所以…

【Unity渲染】渲染管线原理

整理自B站UPKerry佬的视频【【教程】技术美术入门&#xff1a;渲染管线概述】 https://www.bilibili.com/video/BV1Q54y1G7v3/?share_sourcecopy_web&vd_source7e6249c05fba6efe32e8867373f75917 应用阶段 、几何阶段顶点处理、光栅化、片元处理、输出合并 应用阶段是CUP…

独家原创 | SCI 1区 高创新轴承故障诊断模型!

往期精彩内容&#xff1a; Python-凯斯西储大学&#xff08;CWRU&#xff09;轴承数据解读与分类处理 Python轴承故障诊断 (一)短时傅里叶变换STFT Python轴承故障诊断 (二)连续小波变换CWT_pyts 小波变换 故障-CSDN博客 Python轴承故障诊断 (三)经验模态分解EMD_轴承诊断 …