- 博客(48)
- 问答 (1)
- 收藏
- 关注
原创 Vue面试题(自留,持续更新)
文章目录1.MVVM的理解?2.Vue数据双向绑定/响应式原理3.Vue响应式原理4.Vue3.x响应式数据原理5.为什么Vue采用异步渲染?6.Vue生命周期7.Vue中父子组件的生命周期8.Vue组件通信的方式9.diff算法10.computed、watch、method的区别11.Vue优化方式12.v-show和v-if有什么区别1.MVVM的理解?Model:数据模型,可以定义数据修改和操作的业务逻辑View:视图层,负责将数据模块转化成UI组件表现出来ViewModel:同步View和
2022-04-25 17:56:31
1722
原创 前端面试计网、HTTP协议,操作系统(自留,持续更新)
参考:https://juejin.cn/post/6844903590058786824https://space.bilibili.com/3272478761.ajax,fetch,axios是什么,优缺点?1)ajaxajax指异步的javascript和XML,是一个技术统称,特点就是局部刷新页面、不需要重载整个页面。ajax通过js操作浏览器提供的XMLHttpRequest构造函数表示网页请求,以此来进行网络通信。ajax内部有这么几个需要注意点函数和参数:open(请求方法.
2022-04-15 12:20:39
2957
原创 HTML5新特性(面试自留)
文章借鉴:https://blog.csdn.net/weixin_45709829/article/details/115433620技术蛋老师: https://www.bilibili.com/video/BV1SL4y1i7ZL一、语义标签二、增强型表单三、视频音频四、Canvas绘图五、SVG画图六、地理定位七、拖放API八、Web Workerjs是单线程执行的,缺点有二:一、现在的CPU大多数是多核,单线程无法发挥出CPU计算的价值。二、页面上js在执行的时候会阻塞浏.
2022-04-07 18:37:52
1831
原创 js算法常用接口总结(呜呜不然老是记不住)
1.如何遍历map(1)forEach遍历map.forEach(function(value,key){ console.log(value,key);})(2)for-of遍历//遍历出[key,map]数组,效果与entries相同for (let item of map) { console.log(item);}//遍历map的值for (let key of map.keys()) { console.log(key);}//遍历map的键for
2022-04-03 12:07:04
325
原创 js面试准备(自留,持续更新)
1. 数据类型有哪些6+16种简单数据类型(原始类型):undefined、null、boolean、number、string、symbol。其中symbol是es6新增的。1种复杂数据类型:Object对象1)typeof操作符需要注意的是typeof是一个操作符而不是函数,因此不需要参数。调用typeof null时返回的是“object”,这是因为特殊值null被认为是一个对空对象的引用。严格来讲函数在js里被认为是对象,而不是数据类型,但函数有自己的特性,因此需要通过typeof来区
2022-03-23 17:34:45
857
原创 CSS栅格系统
CSS 网格布局(Grid Layout) 是CSS中最强大的布局系统。 这是一个二维系统,这意味着它可以同时处理列和行。栅格系统与FLEX弹性布局有相似之处,都是由父容器包含多个项目元素的使用。由于兼容性并不强,效率也并未得到很大提升,因此目前不太普及。1.声明栅格系统的容器display: grid(块) | inline-grid(行)article { display: grid; width: 300px; height: 300px; border: s
2022-02-11 15:45:54
1459
原创 CSS弹性盒模型
Flex 是 Flexible Box 的缩写,意为"弹性布局",可以轻松的控制元素排列、对齐和顺序的控制。现在的终端类型非常多,使用弹性盒模型可以让元素在不同尺寸终端控制尺寸。1.弹性布局与传统布局相应对比<body> <main> <nav> Yooo </nav> <article> Alison </art
2022-02-09 14:59:35
1359
原创 CSS定位布局
定位的基本思想很简单,它允许你定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。1.相对定位position: relative相对定位:从当前位置添加定位(当前位置是保留的)* { padding: 0; margin: 0;}p { border: solid 5px blueviolet; width: 400px; height: 400px; padding: 30px;}p img
2022-01-23 17:28:27
469
原创 CSS浮动布局
CSS浮动布局float属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。float: left | right | none1.文档流指元素在排版布局的过程中,元素会自动从左到右,从上到下的流式排列。添加浮动会脱离文档流,对后续元素产生影响。(1)空间丢失第一个div设置浮动,第二个未设置。第一个会脱离文档流,第二个div向前填充。div { width: 200px;
2022-01-21 17:13:04
4448
原创 CSS操作数据内容样式
CSS操作数据内容样式1.表格(1)CSS定制表格display:table...表格可以非常快速的部署数据,灵活控制表格样式是必要的。样式规则说明table对应 tabletable-caption对应 captiontable-row对表 trtable-row-group对应 tbodytable-header-group对应 theadtable-footer-group对应 tfoot<article class=
2022-01-19 16:12:08
770
原创 JS日期与时间戳
日期与时间戳1.Date->Timestamp(1)new Date()与Date()new Date()声明类型为objectconst date = new Date();console.log(date);console.log(typeof date);// 返回时间戳 1970年0时0分0秒到现在的ms数console.log(date * 1);Date()声明类型为stringconst date2 = Date();console.log(date2);co
2022-01-15 23:36:02
2636
1
原创 JS Math数学计算
Math数学计算1.最大最小值max() min()不支持数组作为参数,只支持多数值参数。因此数组使用…展开语法或者apply方法。console.log(Math.max(1, 2, 3, 4, 5));console.log(Math.min(1, 2, 3, 4, 5));let grade = [12, 3, 5, 67, 88];console.log(Math.max(grade));console.log(Math.max(...grade));console.log(Mat
2022-01-15 23:32:56
263
原创 JS类型转换
类型转换1.String->Numberconst string = "99";// 隐式转换console.log(string * 1 + 77);// 显式转换console.log(Number(string) + 77);2.Number->Stringconst number = 66;console.log(typeof number);// 隐式转换console.log(typeof (number + ""));// 显式转换console.lo
2022-01-15 23:31:04
360
原创 JS数值Number
数值Number1.数值声明定义(1)使用对象方法(引用类型)let number = new Number(99);console.log(typeof number);(2)创建使用字面量(值类型)创建let number1 = 99;console.log(typeof number1);2.数值基本函数(1)输出值toString() valueOf()调用方法时会将值类型转换成对象来调用let number1 = 99;console.log(number1.toS
2022-01-15 23:28:06
281
原创 JS字符串
字符串String1.字符串声明定义(1)使用字面量(值类型)创建返回类型是stringlet yoo = "yooo.com";console.log(typeof yoo);console.log(yoo);(2)使用对象方法(引用类型)创建返回类型是object(使用值类型调用方法,js会在执行时将值类型转为对象)let alison = new String("alison.com");console.log(typeof alison);console.log(alison
2022-01-15 23:26:19
616
原创 JS类型检测:typeof、instanceof
类型检测1.typeof可以使用typeof判断数据的类型。<body> <script> let num = 3; let str = '3'; let arr = [1, 2, 3]; let obj = {}; function run() { }; console.log(typeof num); console.log(typeof str);
2022-01-15 23:21:15
221
原创 JS: for循环、for-in与for-of的使用
一、for循环打印杨辉三角<body> <style> span { color: white; } </style> <script> function hd(row) { for (let i = 1; i < row; i++) { for (let n = row - i; n > 0;
2021-11-24 23:48:18
467
1
原创 JS:null与undefined
一、undefined当想定义一个基本类型参数时,使用undefined<body> <script> let config = undefined; console.log(typeof (config)); </script></body>没有返回值的函数,输出结果为undefined<body> <script> function sho
2021-11-23 00:15:21
558
2
原创 JS:两种存储数据方式:传值和传址
一、传值:开辟新内存区域存储值<body> <script> let a = 1; let b = a; console.log(a, b); b = 3; console.log(a, b); </script></body>let b = a;时为b开辟了一块新内存区域来存储1,因此修改b=3后,不会影响a内存区域的值。传值通常用于基本类型(比较小
2021-11-23 00:12:51
1433
原创 JS:use strict严格模式与Object.freeze冻结变量
一、use strict严格模式:高质量代码守卫严格模式的作用域:当前作用域及其子作用域严格模式使一切不规范的代码都会报错,使代码可用范围更广泛,举几个例子。<body> <script> "use strict"; web = 22; console.log(web); </script></body>例如变量未被定义,使用严格模式会提醒报错。<body> &
2021-11-23 00:10:14
577
原创 JS:块作用域和const常量声明
一、块作用域什么是块作用域?js作用域中原有全局作用域、函数作用域。在ES6中新增了块级作用域。块作用域由"{}"包括,例如if语句和for语句。1.var:声明的变量存在于最近的函数或全局作用域中,不受块作用域影响。如下所示。<body> <script> var i = 99; for (var i = 0; i < 5; i++) { console.log(i); }
2021-11-23 00:05:42
623
原创 JS:全局污染、Window全局对象污染和重复声明
一、全局污染未使用var/let/const来声明变量时,会导致全局污染,如下函数function show() { web = 'yooo';}<body> <script src="05.js"></script> <script> web = 'alison'; show(); console.log(web); </script></body&
2021-11-22 23:59:29
1140
原创 JS:变量提升与临时性死区TDZ
一、解析过程js运行前会有编译解析过程,有些错误会在编译过程中被发现。<body> <script> var web = 'yooo'; console.log(web); var class = 'alison'; </script></body>二、变量提升<body> <script> console.log(web);
2021-11-20 22:11:25
554
原创 东北大学全栈开发课程笔记9
Navigation导航机制问题一:因为View调用ViewModel,ViewModel调用IService,是单向的,不能形成环,因此IService不能调用View。但IContentPage还要导航view,因此将view剥离成页面键字符串string pageKey。导航有两种:侧栏导航,页面中导航页面间导航的方法:new一个ItemDetailPage再Navigation.PushAsyncasync void OnItemSelected(object sender, Even
2021-11-15 22:03:13
540
2
原创 东北大学全栈开发课程笔记8
连接View和ViewModel:ViewModelLocator1.实现IPreferenceStorage、PreferenceStorage类2.注册public class ViewModelLocator { /// <summary> /// 搜索结果页ViewModel /// </summary> public ResultPageViewModel ResultPageViewModel => Simple
2021-11-14 15:42:11
493
原创 东北大学全栈开发课程笔记7
单元测试:ResultPageViewModelTest问题一:如何追踪状态信息(Status)?如何感应变化?利用mvvm每次status变化时,都会自动触发PropertyChanged事件这个事实。每次发生变化时将status加入列表。public class ResultPageViewModelTest { /// <summary> /// 测试诗词集合。 /// </summary> /// <returns><
2021-11-14 15:40:57
394
原创 CSS盒子模型
CSS盒子模型网页布局三大核心:盒子模型、浮动和定位网页布局过程:先准备好网页元素,网页元素基本都是盒子Box利用css设置盒子样式往盒子里面装内容网页布局核心本质:利用css摆盒子1.盒子模型组成就是把HTML页面中元素看作是一个矩形的能盛装内容的盒子,CSS盒子模型本质上是一个盒子封装周围的HTML元素。它包括:边框(border)、外边距(margin)、内边距(padding)和实际内容(content)2.边框(border)边框由三部分组成:边框宽度(粗细)、边框样式和边
2021-11-08 18:45:13
243
2
原创 CSS三大特性:层叠性、继承性、优先级
CSS三大特性层叠性、继承性、优先级1.层叠性相同选择器设置相同样式,此时一个样式就会覆盖(层叠)另一个冲突的样式。原则:样式冲突,遵循就近原则,哪个样式离结构近,就执行哪个样式样式不冲突,不会层叠div { color: red; font-size: 20px;}div { color: pink;}/* 执行color: pink;和font-size: 20px; */<div>长江后浪推前浪</div>2.继承性
2021-11-08 18:43:16
173
原创 东北大学全栈开发课程笔记6
ViewModel层:ResultPageViewModel依赖一:mvvmlightlibsviewmodel可被单元测试ResultPageViewModel.cs—公开变量/// <summary>/// 正在载入。/// </summary>public const string Loading = "正在载入";/// <summary>/// 没有满足条件的结果。/// </summary>public const st
2021-11-05 11:20:18
185
原创 CSS背景
1.背景颜色background-color: transparent透明色(默认)|colordiv { width: 200px; height: 200px; background-color: transparent; background-color: pink;}2.背景图片实际开发常见于logo/一些装饰性的小图片/超大的背景图片,优点是非常便于控制位置。(精灵图也是一种运用场景)background-image: url(xxx) | none
2021-11-03 16:16:08
156
原创 CSS元素显示模式
指标签以什么方式进行显示HTML元素一般分为块元素和行内元素1. 块元素例:h1~h6,p,div,ul,ol,li等特点:霸道,独占一行高度、宽度、外边距以及内边距都能控制宽度默认是容器(父级宽度)的100%是一个容器及盒子,里面可以放行内或者块级元素注意:文字类元素内不能放块级元素p标签,h1~h6标签主要存放文字,因此p里面不能放块级元素,特别是div2. 行内元素(内联元素)例:a,strong,b,em,i,del,s,ins,u,span等特点:相邻的行内
2021-11-03 16:14:32
69
原创 CSS中使用Emmet语法
Emmet语法使用缩写,提高html/css的编写速度1.快速生成HTML结构语法输入标签名+tab键生成多个相同标签,使用标签名*个数父子关系用>兄弟关系用+带类名的 span.nav带id的 span#nav默认是div标签如果生成的标签类名是有顺序的,可以用自增符号$ (span.nav$*5)想要在标签中添加默认文字,使用{} (div{$*5})2.快速生成CSS样式语法简写形式,如:w200=width: 200px; lh26=l
2021-11-03 16:12:28
120
原创 CSS引入方式
1. 内部样式表(嵌入式)写到html页面内部,放到一个style标签里<style> div { color: red; font-size: 12px; }</style>2. 行内样式表(行内式)<p style="color: red; font-size: 16px;">粉红色的回忆</p>3. 外部样式表(链接式)开发中常用单独写到css文件中,再把css通过链接引入html:新建.css样式文
2021-11-03 16:11:09
57
原创 CSS文本属性
定义文本的外观:颜色,对齐,装饰,缩进,行间距…1. 文本颜色p { /* color: pink; */ /* color: #961179; */ color: rgb(255,0,0);}表示形式属性值预定义的颜色值red,green,blue…十六进制#FF0000,#FF6600RGB代码rgb(255,0,0),rgb(100%,0%,0%)开发中最常用十六进制2. 对齐文本text-align设置文本的水平对
2021-11-03 16:09:28
122
原创 CSS字体属性
1. 字体系列:font-familyh2 { font-family: '微软雅黑';}p { font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;}各种字体之间必须使用英文状态下的逗号隔开一般情况下,如果有空格隔开的多个单词组成的字体,加引号尽量使用系统默认自带字体,保证在任何用户的浏览器中都能正确显示多个字体:兼容性好,如果没有向后找2. 字体大小body { font-size:
2021-11-03 16:07:42
113
原创 CSS选择器分类(有例子非常全)
1.基础选择器单个选择器组成1)标签选择器指用HTML标签名称作为选择器,为页面中某一类标签指定统一的CSS样式。p { color: green;}div { color: pink;}缺点:不能设计差异化样式2)类选择器(开发最常用)差异化选择不同的标签,单独选择一个或者某几个标签口诀:样式点定义,结构类调用注意不能用标签当类名可以使用中横线不要使用纯数字,中文定义类名命名要有意义.red { color: red;}.gr
2021-11-03 16:04:27
1804
原创 CSS语法规范&代码风格
美化网页,布局页面层叠样式表/css样式表/级联样式表结构(HTML)和样式(CSS)相分离语法规范两部分组成:选择器{一条或多条声明(键值对);}p { color: red; font-size: 12px;}代码风格样式格式书写:展开式样式大小写:小写空格规范:属性值前面,冒号后面保留一个空格选择器和大括号中间保留空格...
2021-11-03 15:58:25
999
原创 HTML标签语义(下)
10.表格标签:用来展示数据的基本语法: table:用于定义表格 tr:定义表格中的行 td:定义表格中的单元格(td指table data,即单元格的内容) th:表头单元格标签,table head 表格第一行,加粗居中11.表格结构标签为了更好地表示表格的语义,将表格分割为表格头部和表格主体两大部分基本语法:thead:表格头部区域tbody:表格主体区域表格属性(不提倡 一般用css来设置):这些属性要写到table里属性名属性值描述
2021-11-02 23:14:42
90
原创 HTML标签语义(上)
1.h1~h6标题标签:作为标题使用,并且依据重要性递减变粗变大独占一行2.p段落标签:将文字分成不同的段落在段落中的文本会根据浏览器大小自动换行段落间有空隙3.br换行标签 :强制换行是单标签只是单纯换行 无空隙4.文本格式化标签:粗体:strong / b斜体:em / i删除线:del / s下划线:ins / u5.没有语义的标签:就是一个盒子,用来装内容的div分割分区:用来布局,一行只能放一个div,大盒子span跨度跨距:用来布局,一行可以放多
2021-11-02 22:55:22
77
原创 东北大学全栈开发课程笔记5
PoetryStorage单元测试新建一个单元测试项目(NUnit Test Project.NET Core)测试xx函数,测试函数名就叫TestxxServices层PoetryStorageTest.cs—TestInitializeAsync()/// <summary>/// 诗词存储测试。/// </summary>public class PoetryStorageTest { /// <summary> /// 自动删除
2021-11-02 20:45:12
246
空空如也
CSS行高的继承在chrome浏览器出现问题?
2021-11-07
TA创建的收藏夹 TA关注的收藏夹
TA关注的人