去哪儿前端一面

谈谈你对mvvm的理解

MVVM分为三个部分:分别是M(Model,模型层 ),V(View,视图层),VM(ViewModel,V与M连接的桥梁,也可以看作为控制器)

1、 M:模型层,主要负责业务数据相关;

2、 V:视图层,顾名思义,负视图相关,细分下来就是html+css层;

3、 VM:V与M沟通的桥梁,负责监听M或者V的修改,是实现MVVM双向绑定的要点;

MVVM支持双向绑定,意思就是当M层数据进行修改时,VM层会监测到变化,并且通知V层进行相应的修改,反之修改V层则会通知M层数据进行修改,以此也实现了视图与模型层的相互解耦;

13.png

要实现一个mvvm的库,我们首先要理解清楚其实现的整体思路。先看看下图的流程:

14.png

1.实现compile,进行模板的编译,包括编译元素(指令)、编译文本等,达到初始化视图的目的,并且还需要绑定好更新函数;

2.实现Observe,监听所有的数据,并对变化数据发布通知;

3.实现watcher,作为一个中枢,接收到observe发来的通知,并执行compile中相应的更新方法。

4.结合上述方法,向外暴露mvvm方法

谈一谈对单页面应用的理解

一、定义
单页 Web 应用 (single-page application 简称为 SPA) 是一种特殊的 Web 应用。它将所有的活动局限于一个Web页面中,仅在该Web页面初始化时加载相应的HTML、JavaScript 和 CSS。一旦页面加载完成了,SPA不会因为用户的操作而进行页面的重新加载或跳转。取而代之的是利用 JavaScript 动态的变换HTML的内容,从而实现UI与用户的交互。由于避免了页面的重新加载,SPA 可以提供较为流畅的用户体验。

二、优缺点

单页Web程序的出现是富客户端发展的必然结果,但是该技术也是有些局限性,所以采用之前需要了解清楚它的优缺点。

1、优点:

1).良好的交互体验

用户不需要重新刷新页面,获取数据也是通过Ajax异步获取,页面显示流畅。

2).良好的前后端工作分离模式

单页Web应用可以和RESTful规约一起使用,通过REST API提供接口数据,并使用Ajax异步获取,这样有助于分离客户端和服务器端工作。更进一步,可以在客户端也可以分解为静态页面和页面交互两个部分。

3).减轻服务器压力

服务器只用出数据就可以,不用管展示逻辑和页面合成,吞吐能力会提高几倍;

4).共用一套后端程序代码
不用修改后端程序代码就可以同时用于Web界面、手机、平板等多种客户端;
2、缺点:

1).SEO难度较高

由于所有的内容都在一个页面中动态替换显示,所以在SEO上其有着天然的弱势,所以如果你的站点对SEO很看重,且要用单页应用,那么就做些静态页面给搜索引擎用吧。

2).前进、后退管理

由于单页Web应用在一个页面中显示所有的内容,所以不能使用浏览器的前进后退功能,所有的页面切换需要自己建立堆栈管理,当然此问题

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

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

相关文章

Rust 解决循环引用

导航 循环引用一、现象二、解决 循环引用 循环引用出现的一个场景就是你指向我,我指向你,导致程序崩溃 解决方式可以通过弱指针,而Rust中的弱指针就是Weak 在Rc中,可以实现,对一个变量,持有多个不可变引…

极致视觉盛宴,尽在Extreme Picture Finder!

在信息爆炸的时代,网络图片如同繁星点点,为我们的生活增添无尽的色彩。然而,如何在浩渺的网海中快速、准确地找到心仪的图片,却成了许多人的难题。此刻,Extreme Picture Finder如同一位贴心的向导,引领我们…

[一本Java+一本Java]5月7日简历指导直播

一、直播预告 每周二、四、六16:30简历指导直播,前美团项目负责人、校招VIP CEO-大拿老师在线讲简历优化 二、简历内容 三、简历核心问题 【简历1】一本- Java 1 虽然项目名称有一定的包装,两个项目的内容都是一眼能看出来的烂大街的项目&#xff0c…

AIP美国物理联合会文献在家如何查看下载

AIP(美国物理联合会,American Institute of Physics)成立于1931年,其主要任务是物理知识和应用的推广普及,也是世界上居于领导地位的物理期刊出版社之一。主要的研究方向为物理学和天文物理学。 今天有位同学求助一篇…

呆滞物料规范管理了,问题就好办了

对于制造企业来说,库存是生存和发展的重要保障,过高的库存会占用企业大量的资金和管理成本,影响企业的正常生产,然而多数中小制造企业还在用人工干预管理,如何控制呆滞物料成为仓储管理的一大难题。 什么是呆滞料 呆滞…

#LLM入门 | langchain | RAG # 4.3_文档分割

上一章讨论了文档标准化加载,现在转向文档的细分,这虽简单却对后续工作有重大影响。 一、为什么要进行文档分割 模型大小和内存限制:大型GPT模型参数众多,需大量计算和内存,而硬件设备如GPU或TPU有内存限制&#xff…

Linux下GraspNet复现流程

Linux,Ubuntu中GraspNet复现流程 文章目录 Linux,Ubuntu中GraspNet复现流程1.安装cuda和cudnn2.安装pytorch3.编译graspnetAPIReference 🚀非常重要的环境配置🚀 ubuntu 20.04cuda 11.0.1cudnn v8.9.7python 3.8.19pytorch 1.7.0…

花园牛奶:从靠谱奶牛到新鲜牛奶的匠心之旅

在花园乳业有限公司,我们深知生产出优质牛奶的秘诀——从靠谱的奶牛开始。为此,我们特意引进了品质卓越的荷斯坦奶牛,它们以“黑白花”的优雅身姿,成为了我们牧场上的明星。荷斯坦奶牛以其出色的生产性能和高产奶量而著称&#xf…

CoPilot 产品体验:提升 OpenNJet 的控制管理和服务提供能力

文章目录 前言系统架构介绍CoPilot 配置CoPilot 插件规范 体验 CoPilot 实例CoPilot: Broker 实例CoPilot: Ctrl 实例 开发其他语言编写的 CoPilot目标主要思路具体实现执行 go 程序代码 功能扩展总结 前言 CoPilot 是 OpenNJet 的一个重要组成部分,它在 Master-Wo…

机器学习之基于Python多种混合模型的糖尿病预测

欢迎大家点赞、收藏、关注、评论啦 ,由于篇幅有限,只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统四. 总结 一项目简介 一、项目背景 糖尿病是一种慢性代谢性疾病,其发病率在全球范围内逐年上升,已成为影响人类健…

xmind的13个快捷方式

1.新建导图 CtrlshiftN 2.编辑文字 空格键 3.插入图片 Ctrli 4. 插入主题 Enter键 5. 插入主题之前 ShiftEnter键 6. 插入子主题 Tab键 7. 放大导图 “Ctrl”“” 8. 缩小导图 “Ctrl”“-” 9. 复制 CtrlInsert 10. 粘贴 Shift Insert 11. 剪切 ShiftDelete 12. 截图 F7 13. 保…

【论文阅读笔记】MAS-SAM: Segment Any Marine Animal with Aggregated Features

1.论文介绍 MAS-SAM: Segment Any Marine Animal with Aggregated Features MAS-SAM:利用聚合特征分割任何海洋动物 Paper Code(空的) 2.摘要 最近,分割任何模型(SAM)在生成高质量的对象掩模和实现零拍摄图像分割方面表现出卓越…

9.4.k8s的控制器资源(job控制器,cronjob控制器)

目录 一、job控制器 二、cronjob控制器 一、job控制器 job控制器就是一次性任务的pod控制器,pod完成作业后不会重启,其重启策略是:Never; 简单案例 启动一个pod,执行完成一个事件,然后pod关闭;…

基于Flask的岗位就业可视化系统(一)

🌟欢迎来到 我的博客 —— 探索技术的无限可能! 🌟博客的简介(文章目录) 前言 本项目综合了基本数据分析的流程,包括数据采集(爬虫)、数据清洗、数据存储、数据前后端可视化等 推荐…

(40)4.30数据结构(队列)

1.队列的基本概念 2.队列的顺序 #define MaxSize 10 #define ElemType int typedef struct { ElemType data[MaxSize]; int front, rear; }SqQueue;//1.初始化操作 void InitQueue(SqQueue& Q) { //初始化 队头,队尾指针指向0 Q.rear Q.fron…

单细胞|GeneTrajectory·基因轨迹

跑完了,记录一下,顺便写写我在使用中遇到的问题,欢迎讨论~ 声明:我是用自己数据跑的,因为还未发表所以就还是借用官网的图啦~ 1.准备 library(GeneTrajectory) library(Seurat) library(dply…

有哪些软件可以使用云渲染?

随着技术的发展,云渲染已成为动画制作人员与设计师重要的渲染助手。它可结合云端强大的计算机能力,帮助渲染人员高速的完成渲染任务,大幅度节省时间和本地计算资源。它们以用户友好的界面、强大灵活的渲染能力,满足了各类专业渲染…

XSS漏洞---XSS-labs通关教程

文章目录 前言一、pandas是什么&#xff1f;二、使用步骤 1.引入库2.读入数据总结 Level-1 过滤源码&#xff1a;无 pyload&#xff1a; name<script>alert(1)</script> Level-2 过滤源码&#xff1a;利用转译函数将特殊字符转译为实体字符 $str $_GET["…

翻译《The Old New Thing》 - Double-clicking radio buttons

Double-clicking radio buttons - The Old New Thing (microsoft.com)https://devblogs.microsoft.com/oldnewthing/20050804-10/?p34713 Raymond Chen 在 2005年08月04日 让对话框单选按钮支持双击确定 提示 本文提供了一种让对话框窗口上的控件支持双击确定窗口返回的方法 …

git-新增业务代码分支

需求 使用git作为项目管理工具管理项目&#xff0c;我需要有两个分支&#xff0c;一个分支是日常的主分支&#xff0c;会频繁的推送和修改代码并推送另外一个是新的业务代码分支&#xff0c;是一个长期开发的功能&#xff0c;同时这个业务分支需要频繁的拉取主分支的代码&#…