knockout简介

news/2024/12/23 3:44:26/

knockout简介

    • 前言
    • knockout到底是很么
    • knockout的使用

前言

这一段时间,公司要完善一些代码,有幸接触到了knockout,knockout框架(以下简称KO)是微软推出的一款MVVM的框架,一说起微软就会联想起万恶的IE系列,对于开发人员来说是折磨的,当然,KO是微软的儿子,自然而然的选择了要跟大家和谐相处,所以,KO最低可以兼容到IE6。
讲述的目的是能够让大家明白使用方法,所以追求极简代码。
#为什么使用MVVM框架
相信刚入这一行不久的部分开发人员都很郁闷,为什么要使用框架,对于我个人而言,我认为每有一个框架都要学习,这个代价不如自己进行开发。当然,在此之前我没有开发过大一些的系统或是应用,直到接触到了这些以后,才会明白。
我个人的思想,使用一款框架之前需要给自己做一个假设,我为什么要使用这个框架,框架是否能够帮助我简化开发,也就是我们需要很了解框架的构成,这一点很重要。当然了,这个想法不适用于初学者或者是老手,适用于了解一部分框架而囫囵吞枣使用的人,不能否认,我不喜欢学习框架 。! - - !

knockout到底是很么

前面提到了KO是一款MVVM框架,如今MVVM框架也已经很是盛行了,例如angular、react、vue等等。我头一次接触ko的时,其实不明白什么是MVVM框架,所以,在这里我想稍微借鉴百度说一下什么是MVVM框架。
MVVM是Model-View-ViewModel的简写,是MVC框架的改进版,MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。
百度百科MVVM传送门

就KO框架来说,M - V - VM表现为:

<!--  VM 真正的核心,数据层向视图层的过程,ko已经帮助你封装好了 -->
<script type="text/javascript" src="konckout-3.5.0.min.js"></script><!-- 这就是 V 层的表现 -->
<body><div data-bind="text: name"></div><div data-bind="text: age"></div>
</body>
<!-- 这就是 M 层的表现,当然没有连接数据库,自定义数据 -->
<script>var data = [{ name: '张三', age: '18' }]var viewModel = {name: ko.observable('张三'),age: ko.observable('18')}ko.applyBindings(viewModel);viewModel.name(data[0].name).age(data[0].age);
</script>

我们直白一点,从上述页面的描述中可以看出,ko框架所做的工作就是将DATA数据DOM元素搭上关系,能够由数据直接操控页面的行为,这样方便开发人员能够专注于数据处理,而对于DOM操作则交给了ko框架,简化了开发

knockout的使用

我们之前了解到ko所做的工作,现在我们来聊聊它的使用。如同所有代码一样,想要使用ko,就需要对其进行入口配置,

ko.applyBindings(viewModel) && ko.applyBindings(new viewModel())

可以看出ko可以接收两种值,对象和函数

var viewModel = {name: ko.observable('张三'),age: ko.observable('18')
}
&&
var viewModel = function(){this.name = ko.observable('张三');this.age = ko.observable('18');
}

在这里我们可以看出,对象(方法)的目的是为了将数据输出

    <div data-bind="text: name"></div><div data-bind="text: age"></div>

最后,我们进行数据的绑定。
有一点值得一提,大多数MVVM框架的绑定绑定分为 none/one-way/two-way,而ko并没有one-way(单向绑定),所有的绑定都是双向绑定。


http://www.ppmy.cn/news/162043.html

相关文章

k近邻(kNN)算法简介

K最近邻(k-Nearest Neighbor&#xff0c;KNN)分类算法&#xff0c;是一个理论上比较成熟的方法&#xff0c;也是最简单的机器学习算法之一。 一、算法概述 k -近邻算法是基于实例的学习方法中最基本的&#xff0c;先介绍基于实例学习的相关概念。 基于实例的学习。 1、已知一系…

K近邻(KNN)

算法原理 KNN是监督学习的一种&#xff0c;K近邻法假设给定一个训练数据集&#xff0c;其中的实例类别已定。分类时对新的实例&#xff0c;根据其K个最近邻的训练实例的类别&#xff0c;通过多数表决等方式进行预测。K值的选择、距离度量及分类决策规则是K近邻法的三个基本要素…

loading out-of-tree module taints kernel

调IMC42686驱动时&#xff0c;遇到此问题&#xff0c;加载的树外模块污染了内核。 insmod driver_icm42686.ko [ 21.047635] driver_icm42686: loading out-of-tree module taints kernel. 这种错误可以不用理会&#xff0c;但看见此提示&#xff0c;不解决它又觉得不适。 解…

kni

当dpdk不想在用户态实现协议栈的还&#xff0c;可以采用KNI 调用内核实现的协议栈 kni分为用户态和内核态 其内核态的入口为lib/librte_eal/linuxapp/kni/kni_misc.c中 #可以看这是个标准的ko的实现&#xff0c;其入口函数是kni_initmodule_init(kni_init); static int __init …

KNN(K近邻)

物以类聚&#xff0c;人以群分&#xff1b;近朱者赤&#xff0c;近墨者黑。这两句话的大概意思就是&#xff0c;你周围大部分朋友是什么人&#xff0c;那么你大概率也就是这种人&#xff0c;这句话其实也就是KNN算法的核心思想。 所谓的物以类聚&#xff0c;人以群分&#xff0…

KNN(k近邻详解)

KNN&#xff08;k近邻详解&#xff09; 详细链接一 详细链接二 一句话说明白KNN算法原理 下面我们只讲关于分类的KNN&#xff0c;回归的不讲。 其实很简单&#xff0c;就是计算你要预测的点的周围最近的K个点&#xff0c;然后取这k个点中最多的类定义为你要预测的这个点所属…

Kibana

Kibana Kibana 是一款开源的数据分析和可视化平台&#xff0c;它是 Elastic Stack 成员之一&#xff0c;设计用于和 Elasticsearch 协作。您可以使用 Kibana 对 Elasticsearch 索引中的数据进行搜索、查看、交互操作。您可以很方便的利用图表、表格及地图对数据进行多元化的分析…

电子发票(PDF)识别信息提取(JAVA)电子专票(OFD)在线预览

网上也有资料&#xff0c;有的只有jar包没有源码&#xff0c;整理好网上的资源&#xff0c;把源码开放出来。 https://gitee.com/kanen/invoice 欢迎使用和交流。 内容介绍 电子发票&#xff08;PDF&#xff09;识别与验真 1、支持电子发票&#xff08;PDF&#xff09;的读取…