前端面试项目细节重难点(已工作|做分享)(九)

面试官:请你讲讲你在工作中如何开发一个新需求,你的整个开发过程是什么样的?

答:仔细想想,我开发新需求的过程如下:

(1)第一步:理解需求文档:

首先,我会整体阅读一遍需求文档,把自己不理解的地方使用绿的颜色做好标记并打上一个?作为标记,看完后,我会把不理解的地方直接截图给产品,然后主动与她交流理解需求,也就是要我前端开发做什么。

Eg:提供排序功能,按照截止日期、优先级等条件对待办事项进行排序?(我不理解排序条件的优先级是什么)

(2)第二步:理清代码逻辑:

然后,由于我们做的是二次迭代开发,所以必须得先理清与该需求相关得代码,梳理并确定需要的主要功能模块组件之间的交互关系,对于一些比较复杂的功能,可以使用流程图方式(或文字方式)记录整个动态交互逻辑,便于我们进行下一步的代码开发。

Eg:文字形式的流程图:定义 Todo 组件,表示单个待办事项->开发 TodoList 组件,管理待办事项列表,提供增删改查的功能->在 App 组件中组合使用 TodoList 组件,形成完整的应用

(3)第三步:开始编写代码:

最后一步,才是动手写代码。

(4)举个实例:假设有一个新需求,需要开发一个待办事项列表的功能

- 1)第一步:理解需求文档:

需求文档中说明:用户可以添加、编辑、删除待办事项,并标记事项的完成状态。

待办事项列表支持按照完成状态进行筛选和排序。

用户还可以设置事项的优先级,以及设置提醒时间。

- 2)第二步:理清代码逻辑:

确定需要有 Todo 组件表示单个待办事项,包含标题、描述、完成状态、优先级、提醒时间等属性。

需要有 TodoList 组件管理待办事项列表,提供增删改查的功能。

TodoList 组件需要有筛选和排序的功能,根据完成状态和优先级进行展示。

还需要有一个 TodoForm 组件,用于添加和编辑待办事项。

- 3)第三步:开始写代码:

首先定义 Todo 组件,包含所需的属性和方法。

实现 TodoList 组件,提供增删改查的操作,并添加筛选和排序功能。

开发 TodoForm 组件,实现添加和编辑待办事项的表单。

将这三个组件组合使用,形成完整的待办事项列表功能。

编写相应的单元测试,确保功能正常。

持续优化代码结构和性能,提升用户体验。

定义 Todo 组件,表示单个待办事项。

f6a4526407eb4008b68ca3471254cb7f.png

 

开发 TodoList 组件,管理待办事项列表,提供增删改查的功能。

5f276b96204248f493ad5a99b0bd2d8a.png

13175fef892242319640a569d49921cf.png 

 

在 App 组件中组合使用 TodoList 组件,形成完整的应用。

e55c7d2c78d74b7ab86ac4dcb6dd2186.png

 

 

 

 

 

 

 

 

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

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

相关文章

Java——面向对象进阶(三)

前言: 抽象类,接口,内部类 文章目录 一、抽象类1.1 抽象方法1.2 抽象类1.3 抽象类的使用 二、 接口2.1 接口的定义和实现2.2 default 关键字2.3 实现接口时遇到的问题 三、内部类3.1 成员内部类3.2 静态内部类3.3 成员内部类3.4 匿名内部类&a…

6月17(信息差)

1.马斯克最新预测:未来不再需要手机 将被脑机芯片替代 当地时间6月17日,马斯克高仿号“Not Elon Musk”发帖称:“你会在你的大脑上安装一个Neuralink接口,让你通过思考来控制你的新X手机吗?”对此,马斯克本…

C++ 62 之 冒泡排序

#include <iostream> // #include <string> #include <cstring>using namespace std;// 冒泡排序:函数模板 template<typename T> void mySort(T arr[], int len){ // size参数是数组的个数&#xff0c;一定是int型的for (size_t i 0; i < len -1;…

88. 合并两个有序数组(简单)

88. 合并两个有序数组 1. 题目描述2.详细题解3.代码实现3.1 Python3.2 Java 1. 题目描述 题目中转&#xff1a;88. 合并两个有序数组 2.详细题解 两个数组均有序&#xff08;非递减&#xff09;&#xff0c;要求合并两个数组&#xff0c;直观的思路&#xff0c;借助第三个数…

利用AI云防护实现高效负载均衡

在当今高度数字化的世界里&#xff0c;保证网站和应用的高可用性和响应速度对企业的业务连续性和用户体验至关重要。传统的负载均衡技术虽然能够分发流量&#xff0c;但在面对突发流量、DDoS攻击或资源动态调整时往往力不从心。本文将探讨如何借助AI云防护服务&#xff0c;不仅…

超图论文细品——2019年AAAI《Hypergraph Neural Networks》

我是“导航” 1 摘要1.1 简介1.2 问题描述 2 超图2.1 图和超图对比 参考 1 摘要 1.1 简介 文章提出了一种名为超图神经网络的框架&#xff0c;用于高维数据的表示学习。 该方法英文称呼为 Hypergraph Neural Networks&#xff0c;简写为 HGNN。 1.2 问题描述 传统的 GNN 是…

大模型精调:实现高效迁移学习的艺术

在人工智能领域&#xff0c;大型预训练模型&#xff08;以下简称“大模型”&#xff09;已经取得了令人瞩目的成果。这些模型通过在海量数据上进行预训练&#xff0c;能够捕捉到丰富的特征信息&#xff0c;为各种下游任务提供强大的支持。然而&#xff0c;如何将这些大模型应用…

graalvm编译springboot3 native应用

云原生时代容器先行&#xff0c;为了更好的拥抱云原生&#xff0c;spring boot3之后&#xff0c;推出了graalvm编译boot项目&#xff0c;利用jvm的AOT&#xff08; Ahead Of Time &#xff09;运行前编译技术&#xff0c;可以将java源码直接构建成机器码二进制的文件&#xff0…

(资料收藏)王阳明传《知行合一》共74讲,王阳明知行合一音频讲解资料

今天给大家带来的不是软件&#xff0c;而是一份精神食粮——《知行合一》的教程福利。这可不是一般的教程&#xff0c;它关乎心灵&#xff0c;关乎智慧&#xff0c;关乎我们如何在纷繁复杂的世界中找到自己的位置。 咱们得聊聊王阳明&#xff0c;这位明代的大儒&#xff0c;他…

JAVAEE之网络原理(2)_传输控制协议(TCP)、概念、格式、确认应答及超时重传机制

前言 在上一节中&#xff0c;我们介绍了 UDP (用户数据报) 的相关知识&#xff0c;在这一节中我们将继续介绍传输层中另一种更为重要的协议。 一、什么是TCP协议&#xff1f; 1.1 TCP 基本概念 TCP协议全称&#xff1a;传输控制协议&#xff08;TCP&#xff0c;Transmission C…

Prometheus配置文件与核心功能

Prometheus配置文件与核心功能 环境部署完成以后&#xff0c;我们就需要对产品进行稳定性监控。在知道怎么监控收集数据之前&#xff0c;我们需要知道prometheus的配置文件和核心功能 全局配置文件 首先我们从针对prometheus的全局文件进行说起&#xff0c;首先进入promethe…

springboot宠物医院信息管理系统-计算机毕业设计源码04164

摘 要 现如今在中国&#xff0c;随着人民生活质量的逐渐提高&#xff0c;以及人民群众消费能力的日渐增长&#xff0c;各种各样的家养小动物&#xff0c;已经逐渐成为人类越来越亲密的生活伴侣。并且&#xff0c;现如今社会竞争及其激烈&#xff0c;人们的生活节奏越发急促、紧…

【免费API推荐】:满足您的开发需求,加速项目上线

免费API助力项目开发&#xff0c;为开发者们提供了强大的支持和工具。这些API提供了各种功能和服务&#xff0c;能够帮助项目开发者们快速构建出高质量的应用。无论是地理位置服务、支付接口、社交媒体集成还是图像识别&#xff0c;这些免费API为项目开发者们提供了丰富的功能和…

图解ZGC

ZGC&#xff08;Z Garbage Collector&#xff09; 是一款性能比 G1 更加优秀的垃圾收集器。ZGC 第一次出现是在 JDK 11 中以实验性的特性引入&#xff0c;这也是 JDK 11 中最大的亮点。在 JDK 15 中 ZGC 不再是实验功能&#xff0c;可以正式投入生产使用了&#xff0c;使用 –X…

Axure8.0实例|数量编辑器

Axure8.0实例&#xff5c;数量编辑器 一、元件准备 1、添加三个矩形框&#xff0c;分别取名为“减少数量”、“数量背景”、“增加数量”。“减少数量”矩形框中输入“-”号&#xff0c;“增加数量”矩形框中输入“”号&#xff0c;待用&#xff1b; 2、添加一个文本框&#…

高等数学笔记(一):映射与函数

一、映射 1.1 映射的概念 存在一个法则 f &#xff0c;使得对 X 中每个元素 x &#xff0c;在 Y 中有唯一确定的元素 y 与之对应&#xff08;X、Y 非空集&#xff09; 称 f 为从 X 到 Y 的映射&#xff0c;如图所示 其中 y 称为元素 x&#xff08;在映射 f 下&#xff09;的…

通过LotusScript中的NotesDateTime类来进行时间计算

大家好&#xff0c;才是真的好。 今天我们介绍的是时间日期处理&#xff0c;其实以前也讲过&#xff0c;主要是通过LotusScript中的NotesDateTime类来进行时间计算。 但是这里也存在一个问题&#xff1a;就是时间日期类的比较只能计算出秒&#xff0c;不能计算出毫秒。 毕竟…

手写一个JSON可视化工具

前言 JSON 平时大家都会用到&#xff0c;都不陌生&#xff0c;今天就一起来实现一个 JSON 的可视化工具。 大概长成下面的样子&#xff1a; 树展示 相比于现有的一些 JSON 格式化工具&#xff0c;我们今天制作的这个小工具会把 JSON 转为树去表示。其中&#xff1a; 橙色标…

Cloneable接口和对象的克隆——浅拷贝和深拷贝

用Clonable接口实现对象的克隆——浅拷贝和深拷贝 1. 浅拷贝2. 深拷贝 在Object类中提供了clone方法&#xff0c;用来是实现对象的克隆&#xff01; 1. 浅拷贝 我们首先来尝试用clone方法去克隆一个Person对象 public class Person {public String name;public int age;publi…

数据驱动决策:工单统计工具如何赋能企业精准运营

在当今这个数字化飞速发展的时代&#xff0c;企业对于内部运营效率的追求已经达到了前所未有的高度。你是否曾为了繁杂的工单统计管理而头疼不已&#xff1f;是否曾因为无法准确进行工单统计数据而错失商机&#xff1f;今天&#xff0c;我将向你展示一款革命性的工单统计工具&a…