星河路漫漫-优快云博客

原创成为高级前端开发师需要掌握的技术

作为高级前端开发工程师，你需要掌握一系列广泛的技术和概念。

2025-02-13 14:43:06 950

原创 ES6面试题：（第三天）

事件循环loop,宏观任务和微观任务 · 语雀《事件循环loop,宏观任务和微观任务》

2024-10-27 10:10:11 590

什么是Promise?promise是异步编程的一种解决方法。所谓promise，简单说是一个容器，里面保存着一个异步操作的结果，从语法上说，promise是一个对象，从它可以获取异步操作的消息，promise提供了统一的API，各种异步操作都可以用同样的方法进行处理。比传统的解决方案——回调函数和事件——更合理且更强大。Promise的用途?主要用于异步计算可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果,所以promise链式调用解决回调地狱。

2024-10-27 10:07:46 428

原创 ES6面试题：（第一天）

3.Map由于没有格式限制，可以做数据存储,Set的值是唯一的可以做数组去重，ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。1.Map是键值对，当然键和值可以是任何的值；2.Map可以通过get方法获取值，而Set不能因为它只有值；//结果输出的是一个对象。11.ES6模块化-export-import。//使用Array.from转成数组。2.解构赋值,数组和对象的解构。4.Symbol基本数据类型。9.迭代器iterator。5.Map和Set对象。

2024-10-18 08:53:51 546

原创 Ajax面试题：（第四天）

跨域是违背同源策略就会产生跨域。要说跨域,首先得说同源策略是浏览器的安全策略，协议名、域名、端口号必须完全一致。vue代理配置 nginx代理配置后端设置 jsonp（前后端配合）JSONP利用script标签本来就具备的跨域请求功能，请求后台接口地址,来完成数据请求的,这种跨域的通讯方式称为JSONP。JSONP的原理 :利用script标签可以获取不同源资源的特点，来达到跨域访问某个资源的目的。1、JSONP只支持GET请求，不支持POST等其它类型的HTTP请求。

2024-10-15 08:25:35 862

原创 Ajax面试题：（第三天）

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。通过XMLHttpRequest对象，Web开发人员可以在页面加载以后进行页面的局部更新。

2024-10-14 08:18:54 384

原创 Ajax面试题：（第二天）

AJAX 是异步 JavaScript 和 XML, 向服务器发送数据请求,AJAX可以无需重新页面,异步的使网页实现局部的更新。

2024-10-10 17:00:02 985

原创 Ajax面试题：（第一天）

在网络数据传输中，传输层协议TCP(传输控制协议)是建立连接的可靠传输，TCP建立连接的过程，我们称为三次握手。第一次，客户端向服务器发送SYN同步报文段，请求建立连接第二次，服务器确认收到客户端的连接请求，并向客户端发送SYN同步报文，表示要向客户端建立连接第三次，客户端收到服务器端的确认请求后，处于建立连接状态，向服务器发送确认报文客户端是在收到确认请求后，先建立连接服务器是在收到最后客户端的确认后，建立连接发起连接请求的一定是客户端在网络数据传输中，传输层协议断开连接的过程我们称为。

2024-10-07 08:52:11 986

原创 Git面试题总结

发生冲突，在代码编辑器（比如vscode，IDEA等）里一般都是对比本地文件和远程分支的文件，然后把远程分支上文件的内容手工修改到本地文件，然后再提交冲突的文件使其保证与远程分支的文件一致，这样才会消除冲突，然后再提交自己修改的部分。特别要注意下，修改本地冲突文件使其与远程仓库的文件保持一致后，需要提交后才能消除冲突，否则无法继续提交。2、遇到紧急开发任务但目前任务不能提交时，会先执行git stash，然后进行紧急任务的开发，然后通过git stash pop取出栈区的内容继续开发；

2024-10-03 07:56:55 945

原创 jQuery面试题：（第三天）

答:append(),appendTo(),prepend(),prependTo(),after(),insertAfter() before(),insertBefore()children() 取得匹配元素的子元素集合,只考虑子元素不考虑后代元素。find() 取得匹配元素中的元素集合,包括子代和后代。siblings() 取得匹配元素前后的所有同辈元素。4.prependTo()把匹配的元素添加到对象前。next() 取得匹配元素后面紧邻的同辈元素。prev() 取得匹配元素前面紧邻的同辈元素。

2024-10-02 17:50:15 584

原创 jQuery面试题：（第二天）

① 关于DOM元素页面初始化渲染添加或删除可见元素元素位置发生变化元素的尺寸大小发生变化（width,height,padding,border-width,margin等）② 访问特定属性③ 特定事件发生浏览器窗口尺寸改变，即resize事件页面初始化渲染。

2024-09-30 09:10:06 1051

原创 jQuery面试题：（第一天）

window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。

2024-09-29 19:11:47 644

原创 Vue 2&3进阶面试题：（第八天）

1.由选项API转变为组合API。2.vue3将全局配置挂在了app实例上而不是构造函数上，好处是应用之间的配置互不影响。3.vue3为了减小打包体积，将很多方法都采用了具名导出的方式（如 createApp、nextTick等），这使得初始化实例的方式也有所区别。4.需要注意的是setup返回的变量都是Ref类型，修改ref的值需要修改ref.value。5.在setup中，reactive可以为我们集中定义属性。6.computed接收一个函数,该函数的返回值作为计算属性的值。

2024-09-27 09:07:04 637

原创 Vue 2&3进阶面试题：（第七天）

常用对象解析：(1) scripts：npm run xxx 命令调用node执行的 .js 文件(2) dependencies：生产环境依赖包的名称和版本号，即这些依赖包都会打包进生产环境的JS文件里面(3) devDependencies：开发环境依赖包的名称和版本号，即这些依赖包只用于代码开发的时候，不会打包进生产环境js文件里面。

2024-09-25 11:20:27 662

原创 Vue 2&3进阶面试题：（第六天）

它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。答：vue.js是采用数据劫持结合发布者 - 订阅者模式的方式，通过Object.defineProperty（）来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。5. modules：模块化vuex，可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰，方便管理。场景有：单页应用中，组件之间的状态。

2024-09-24 11:52:12 1056

原创 Vue 2&3进阶面试题：（第五天）

params一旦设置路由，params就是路由的一部分，如果这个路由有params传参，但是在跳转的时候没有传这个参数，会导致跳转失败或者页面会没有内容。例如有一个商品页面和一个详情页面，这样在两个页面切换的时候就可以用到keep-alive,在切换到详情的时候，把状态保留在内存中，而不是销毁,从而提高一个性能的优化。this.$route表示当前路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name、path、params、query等属性。

2024-09-23 20:50:40 2058

原创 Vue 2&3进阶面试题：（第四天）

接着就是做一些axios进行的api接口的封装，这里我用到了async，await封装请求接口函数，这样可以将异步操作同步化操作，代码更加友好，避免回调地域的出现。3. 作用域插槽是带数据的插槽，子组件提供给父组件的参数，父组件根据子组件传过来的插槽数据来进行不同的展现和填充内容。2. 具名插槽是在父组件中通过slot属性，给插槽命名，在子组件中通过slot标签，根据定义好的名字填充到对应的位置。1. 默认插槽就是把父组件中的数据，显示在子组件中，子组件通过一个slot插槽标签显示父组件中的数据。

2024-09-22 10:23:12 777

原创 Vue 2&3进阶面试题：（第三天）

因为组件是用来复用的，且 JS 里对象是引用关系，如果组件中 data 是一个对象，那么这样作用域没有隔离，子组件中的 data 属性值会相互影响如果组件中 data 选项是一个函数，那么每个实例可以维护一份被返回对象的独立的拷贝，组件实例之间的 data 属性值不会互相影响；而 new Vue 的实例，是不会被复用的，因此不存在引用对象的问题。

2024-09-21 13:19:03 642

原创 Vue 2&3进阶面试题：（第二天）

答：需要使用key来给每个节点做一个唯一标识，Diff算法就可以正确的识别此节点。v-show指令是通过修改元素的displayCSS属性让其显示或者隐藏。v-model.lazy - 取代 input 监听 change 事件。v-if指令是直接销毁和重建DOM达到让元素显示和隐藏的效果。v-model.number - 输入字符串转为有效的数字。v-model.trim - 输入首尾空格过滤。作用主要是为了高效的更新虚拟DOM。

2024-09-20 09:58:04 495

原创 Vue 2&3进阶面试题：（第一天）

vue是一个渐进式JavaScript 框架,用于创建用户界面的开源JavaScript框架，也是一个创建单页应用的Web应用框架；Vue所关注的核心是MVC模式中的视图层，同时，它也能方便地获取数据更新，并通过组件内部特定的方法实现视图与模型的交互。MVC：Model View Controller 模型层视图层控制器，一种软件设计典范。Model：模型层，是应用程序中用于处理应用程序数据逻辑的部分。通常模型对象负责在数据库中存取数据。

2024-09-19 20:22:31 990

原创 HTML5+CSS3面试题：（第四天）

sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面，不同页面或标签页间无法共享sessionStorage的信息，需要注意页面及标签页仅指顶级窗口，如果一个标签页包含多个iframe标签且他们属于同源页面，那么他们之间是可以共享sessionStorage的；localStorage在所有同源窗口中都是共享的，同浏览器无法共享local和session的信息，同浏览器下，local可以在不同页面 (指的是相同域名和端口的下的不同页面) 共享相同的local数据；

2024-09-18 18:23:21 796

原创 HTML5+CSS3面试题：（第三天）

navigator 对象包含有关浏览器的信息，它有很多属性，我们最常用的是 userAgent，该属性可以返回由客户机发送服务器的 user-agent 头部的值。onLine 属性是一个只读的布尔值，声明了系统是否处于脱机模式，如果系统属于脱机状态，则返回 false，否则返回 true。SVG具有更好的文本渲染，而Canvas不能很好的渲染，渲染中的SVG可能比Canvas慢，特别是应用了大量的DOM。绘制出来的每⼀个图形的元素都是独⽴的 DOM 节点，能够⽅便的绑定事件或⽤来修。

2024-09-17 11:43:10 829

原创 HTML5+CSS3面试题：（第二天）

响应式网站设计(Responsive Web design)是一个网站能够兼容多个终端，而不是为每一个终端做一个特定的版本。基本原理是通过媒体查询检测不同的设备屏幕尺寸做处理。页面头部必须有meta声明的viewport。

2024-09-16 09:43:51 1010

原创 HTML5+CSS3面试题：（第一天）

2.代码复杂，无法被一些搜索引擎索引到，这一点很关键，现在的搜索引擎爬虫还不能很好的处理iframe中的内容，所以使用iframe会不利于搜索引擎优化。2.如果有多个网页引用iframe，那么你只需要修改iframe的内容，就可以实现调用的每一个页面内容的更改，方便快捷。3.如果遇到加载缓慢的第三方内容如图标和广告，这些问题可以由iframe来解决。4.iframe框架页面会增加服务器的http请求，对于大型网站是不可取的。iframe:是一个内联框架(行内框架),可以包含另外一个文档的内容。

2024-09-15 09:04:29 1664

原创 JavaScript高阶面试题：（第三天）

优点：相比于堆来说存取速度会快，并且栈内存中的数据是可以共享的，例如同时声明了var a = 1和var b = 1，会先处理a，然后在栈中查找有没有值为1的地址，如果没有就开辟一个值为1的地址，然后a指向这个地址，当处理b时，因为值为1的地址已经开辟好了，所以b也会同样指向同一个地址。1、栈：基础变量的值是存储在栈中，而引用变量存储在栈中的是指向堆中的数组或者对象的地址，这就是为何修改引用类型总会影响到其他指向这个地址的引用变量。栈（stack）：由编译器自动分配释放，存放函数的参数值，局部变量等；

2024-09-14 11:21:13 743

原创 JavaScript高阶面试题：（第二天）

JavaScript 除了提供正常模式外，还提供了严格模式（strict mode）。ES5 的严格模式是采用具有限制性 JavaScript变体的一种方式，即在严格的条件下运行 JS 代码。严格模式在 IE10 以上版本的浏览器中才会被支持，旧版本浏览器中会被忽略。设立严格模式的原因：1、消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;2、消除代码运行的一些不安全之处，保证代码运行的安全；3、提高编译器效率，增加运行速度；4、为未来新版本的Javascript做好铺垫。

2024-09-13 13:34:55 541

原创 JavaScript高阶面试题：（第一天）

每一个构造函数，都会有一个prototype属性。该属性指向一个对象，该对象称之为原型对象,即原型。当访问一个对象的某个属性时，会先在这个对象本身属性上查找，如果没有找到，则会去它的__proto__上查找，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__中查找(即上一层构造函数的prototype)，这样一层一层向上查找直到Object的prototype结束,这样就会形成一个链式结构，我们称为原型链。我们可以说：它们是继承关系。

2024-09-11 09:02:11 939

原创 JavaScript基础面试题：（第五天）

window对象代表浏览器中打开的一个窗口。document对象代表整个html文档。实际上，document对象是window对象的一个属性。

2024-09-10 08:28:54 446

原创项目实战：深铭易购官网首页（第一阶段）

【代码】项目实战：深铭易购官网首页（第一阶段）

2024-09-09 12:13:06 785

原创 JavaScript基础面试题：（第四天）

事件委托又叫事件代理,利用事件冒泡的原理，原本绑定在子元素身上的事件，现在绑定在父元素身上，由父元素监听事件的行为。优点:1.可以减少事件注册,节省大量内存占用2.可以将事件应用于动态添加的子元素上缺点:使用不当会造成事件在不应该触发时触发应用场景：如果我们有⼀个列表，列表之中有⼤量的列表项，我们需要在点击列表项的时候响应⼀个事件；如果给每个列表项⼀⼀都绑定⼀个函数，那对于内存消耗是⾮常⼤的；这时候就可以事件委托，把点击事件绑定在⽗级元素 ul 上⾯，然后执⾏事件的时候再去匹配⽬标元素。

2024-09-08 08:53:25 612

原创 JavaScript基础面试题：（第三天）

数据封装类对象：Object、Array、Boolean、Number 和 String。应该避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）。其他对象：Function、Arguments、Math、Date、RegExp。Object 是 JavaScript 中所有对象的父对象。它的功能是把对应的字符串解析成JS代码并运行；

2024-09-07 12:04:21 663

原创 JavaScript基础面试题：（第二天）

作用域（scope）作用域是指程序源代码中定义变量的区域，简单来说，一段程序代码中所用到的变量并不总是有效的，而限定这个变量的可用性的代码范围就是这个变量的作用域。全局作用域全局作用域是最外围的一个作用域。根据 ECMAScript 实现所在的宿主环境不同，表示全局作用域的对象也不一样。在浏览器中，全局作用域就是window对象，node则是global对象。局部作用域和全局作用域相反，局部作用域一般只在固定的代码片段内可访问到，最常见的是函数内部。块级作用域。

2024-09-06 08:59:54 486

原创 JavaScript基础面试题：（第一天）

方法描述charAt()返回在指定位置的字符。返回在指定的位置的字符的 Unicode 编码。concat()连接两个或更多字符串，并返回新的字符串。将 Unicode 编码转为字符。indexOf()返回某个指定的字符串值在字符串中首次出现的位置。includes()查找字符串中是否包含指定的子字符串。从后向前搜索字符串，并从起始位置（0）开始计算返回字符串最后出现的位置。search()查找与正则表达式相匹配的值。replace（）

2024-09-05 12:17:15 511

原创 Vue笔记总结（Xmind格式）：第七天

1.路由的本质就是一种对应关系，比如说我们在url地址中输入我们要访问的url地址之后，浏览器要去请求这个url地址对应的资源。那么url地址和真实的资源之间就有一种对应的关系(映射关系)，就是路由,比如生活中的路由。2.路由的优点：1.整体不刷新页面，用户体验更好2.数据传递容易, 开发效率高3.路由的三个对象：路由中有三个基本的概念 route, routes, router。

2024-09-04 09:02:34 724

原创 Vue笔记总结（Xmind格式）：第六天

2.局部注册1.局部指令，需要定义在directives 的选项用法和全局用法一样2.局部指令只能在当前组件里面使用3.当全局指令和局部指令同名时以局部指令为准1.全局注册main.js定义处修改一下。

2024-09-03 09:04:20 970

原创 HTML+CSS面试题总结：（第三天）

粘性定位(而sticky相当于加了一个滚动事件的处理，当页面滚动到相对应的元素上，就会变成固定定位的效果。生成绝对定位的元素，距离最近已经定位的父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。生成相对定位的元素，相对于其正常位置进行定位。因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。没有定位，元素出现在正常的流中。

2024-09-02 08:55:04 564

原创 Vue笔记总结（Xmind格式）：第五天

框架内置函数，随着组件的生命周期阶段，自动执行作用: 特定的时间点，执行特定的操作场景: 组件创建完毕后，可以在created 生命周期函数中发起Ajax 请求，从而初始化 data 数据分类: 4大阶段8个方法创建挂载更新销毁。

2024-09-01 09:22:01 938

原创 HTML+CSS面试题总结：（第二天）

• 设置块状格式化上下文元素（ float/position:absolute等）,或设置其中一个元素的margin。块级元素的上外边距（ margin-top ）与下外边距（ margin-bottom ）有时会合并为单个外边距，流式布局：你看到的页面，元素的大小会变化而位置不会变化——这就导致如果屏幕太大或者太小都会导致元素无法正常显示。在这种盒模型下，我们所说的元素的width ，包含了 content + padding + border。（ 1 ）相邻兄弟元素 margin 合并。

2024-08-31 10:35:11 745

原创 HTML+CSS面试题总结：（第一天）

2.src：source的所写，表示的是对资源的引用，它指向的内容会嵌入到当前标签所在的位置。由于src的内容是页面必不可少的一部分，因此浏览器在解析src时会停下来对后续文档的处理，直到src的内容加载完毕。1.href：Hypertext Reference的缩写，超文本引用，它指向一些网络资源，建立和当前元素或者说是本文档的链接关系。在加载它的时候，不会停止对当前文档的处理，浏览器会继续往下走。1、Doctype描述了html文档的类型，对不同的Doctype类型，浏览器会使用不同的方法来解析。

2024-08-31 08:59:52 801

原创 Vue笔记总结（Xmind格式）：第四天

2024-08-30 09:08:24 451

JavaScript高阶第二天.xmind

JavaScript高阶笔记总结：目前学到的this指向： 1.普通函数的this指向 window 2.构造函数this指向实例化对象 3.事件中的this指向事件源 4.定时器中的this指向window 5.立即执行函数中的this指向window 6.对象中的this指向对象本身 7.原型对象中的this指向实例化对象改变this指向的方法： 1.call():参数以逗号分隔，会立即调用函数执行 2.apply():参数以数组形式传递，会立即调用函数执行 3.bind():参数以逗号分隔，需要手动调用 4.call()的使用场景：数据类型判断 Object.prototype.toString.call(); 5.apply()的使用场景：求最值 Math.max() 传入参数的最大值 6.bind()的使用场景： bind()不会立即调用函数执行，一般用于改变定时器中的this指向判断数据类型的方法： 1.typeof 2.instanceof

2024-08-11

JavaScript高阶第一天.xmind

js高阶知识总结：理解Object： 1.返回一个由一个给定对象的自身可枚举属性组成的数组：Object.keys(对象名) 2.in 判断属性是否存在："属性名" in 对象名 3.delete 删除属性 4.返回一个由指定对象的所有自身属性的属性名：Object.getOwnPropertyNames(对象名) 属性的特征：访问器属性：get(访问), set(修改) 定义属性特征： 1.对象中的属性默认可修改，可枚举，可配置 2.是否可枚举：enumerable: true 3.是否可修改：writable: false 4.是否可配置：configurable: false 定义多个属性特征： 1.获取属性的特征信息：Object.getOwnPropertyDescriptor(对象名, "属性名") 2.获取所有属性特征：Object.getOwnPropertyDescriptors(对象名) 对象原型： 1.每个实例化对象都可以访问其构造函数原型上的属性和方法

2024-08-09

HTML5+CSS3第五天.xmind

HTML5+CSS3知识总结： canvas坐标：画图的基本步骤： 1.创建画布 2.获取画布 3.开始路径规划 4.规定画笔颜色 5.规定画笔粗细 6.开始作画 7.路径闭合 8.绘制描边 9.颜色填充将图片画到画布上： 1.创建img DOM对象 2.等待图片加载完毕后再将图片画到画布上 3.使用drawImage(img,x,y) Location对象： 1.返回完整的url：href 2.返回从 # 开始的 url ：hash 3.返回从问号(?) 开始的 URL（查询部分）：search 4.assign() 加载新的文档。跟href一样，可以跳转页面 5.replace() 用新的文档替换当前文档。替换当前页面，不记录历史，不可以后退 6.reload() 重新加载当前文档。 Navigator对象： 1.navigator.u

2024-08-08

HTML5+CSS3第四天.xmind

HTML5+CSS3知识总结：媒体查询： 1.媒体查询格式：@media 设备类型 and 设备特性 2.screen：设置屏幕 3.max-width(最大宽度),min-width(最小宽度) 4.可以通过媒体查询引入不同的css样式移动端布局方式： 1.静态布局 2.流失布局 3.自适应布局 4.响应式布局单位： 1.px 像素单位 2.em 相对单位：相对于父元素的字体大小的倍数 3.rem 相对单位：root 根元素的字体大小 rem可以结合媒体查询做移动端的适配

2024-08-06

HTML5+CSS3第三天.xmind

HTML5+CSS3知识总结：过渡 transition: 过渡属性过渡时间运动曲线何时开始 2D变形transform ： 1.平移：translate(单位px) 2.缩放：scale(默认1，大于1放大，小于1缩小) 3.旋转：rotate(单位deg) 4.倾斜：skew(单位deg) 3D变形transform： 1.rotateX:沿着X轴旋转 2.rotateY:沿着Y轴旋转 3.rotateZ:沿着Z轴旋转 4.backface-visibility: hidden:背部不可见 5.transform-style: preserve-3d：保留子元素3d位置 6.perspective：视距(数值越大距离屏幕越近) 动画： 1.animation: 动画名称动画时间运动曲线何时开始播放次数是否反方向; 2.运动曲线：ease(先快后慢) linear(匀速) 3.无限循环：infinite 4.规定动画:@keyframes 动画名称

2024-08-06

HTML5+CSS3第二天.xmind

第二天HTML5+CSS3：新增选择器，CSS新属性样式等更详细的笔记总结，包含源代码图片实例。

2024-08-02

HTML5+CSS3笔记（Xmind格式）：第一天

1.新增语义化标签： - header：定义文档的页眉,用来表示页面的头部。 - nav：定义导航链接的部分nav 元素代表页面中的导航，其中的导航元素链接到其他页面或当前页面的其他部分。 - main：主体信息 - aside : 侧边栏 - article：article元素表示文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。它可以是一篇博客或报纸中的文章、一篇论坛帖子、一段用户评论或独立的插件，或其他任何独立的内容。 - section：定义文档中的节（section、区段） - footer：定义文档或节的页脚 - datalist：标签定义选项列表。请与 input 元素配合使用该元素，其中input的list属性值必须和datalist的id值一致。（修改后要刷新页面） - figure元素：该元素用于表示一块独立的图片区域，元素内部可以包含一个或多个<img>元素。另外，该元素还可以包含一个<figcaption>元素，用于定义该图盘区域的标题。 - figcaption元素：该元素通常放在<figure>内部，用于定义图片区域的标题。

2024-08-02

JavaScript笔记总结（Xmind格式）：第十天

js知识总结：定时器： 1.超时定时器（setTimeout） 2.间歇定时器（setInterval） 3.定时器ID：通过声明变量接收定时器 4.清除定时器：clearInterval() 定时器中的this指向window 定时器属于异步操作：异步代码会等同步代码执行完毕之后再执行匀速动画:物体的速度固定（匀速运动）缓动动画:物体速度逐渐变慢（先快后慢运动）

2024-07-30

JavaScript第八天.xmind

DOM事件：事件三要素: 1.事件源（给谁绑定事件） 2.事件类型（绑定一个什么事件） 3.事件处理程序（绑定事件后要干什么）事件对象： 1.事件对象 event（e） 2.事件触发者 e.target 3.事件触发类型 e.type 4.阻止默认事件 e.preventDefault 5.e.keyCode键码 this指向： 1.普通函数 this指向window 2.构造函数 this指向实例化对象 3.对象方法 this指向对象本身 4.事件中的 this指向事件的绑定者鼠标事件：鼠标进入事件:mouseenter,mouseover 鼠标离开时触发:mouseout,mouseleave 鼠标移动事件:mousemove 鼠标按下事件:mousedown 鼠标弹起事件:mouseup 鼠标双击事件:dblclick 鼠标滚轮事件:mosuewheel

2024-07-29

JavaScript第九天.xmind

js知识总结 MouseEvent属性： 1.clientX，clientY(点击位置距离当前body可视区域的x，y) 2.pageX，pageY(对于整个页面来说，包括被卷去的body部分的长度) 3.screenX，screenY(点击位置距离当前电脑屏幕的x，y坐标) 4.offsetX，offsetY(鼠标相对于事件源元素的x，y坐标) 元素的offset属性： 1.offsetTop: 元素相对父元素上边的偏移。(只读) 2.offsetLeft：元素相对父元素左边的偏移。(只读) 3.offsetWidth：自身包括padding 、边框、内容区的宽度。 4.offsetHeight：自身包括padding、边框、内容区的高度。 5.offsetParent：作为偏移参照点的父级元素。元素的client属性： 1.clientHeight（clientWidth）:内容可视区域的高度/宽度 2.clientLeft,clientTop:这两个返回的是元素周围边框的厚度

2024-07-29

CSS笔记总结（Xmind格式）：第一天

css知识总结： 1.css使用方式：行内样式：直接在html标签中添加style属性内部样式表：在文件内部添加的样式外部样式：单独的css样式文件，通过link标签引入使用@import导入的外部样式：会在html加载完成之后才开始使用，且必须在style最上方使用 2.字体样式: 字体大小font-size: 默认为16px 最小为10px 字体样式font-family: 默认字体微软雅黑字体必须是当前主机中下载过的字体宽度font-weight: 100最细，900最粗字体风格font-style: oblique倾斜 3.选择器：标签选择器：div 类名选择器: .box1 id选择器: #box2 通配符选择器:* 清除页面的默认样式

2024-07-28

HTML笔记总结（Xmind格式）：第二天

html笔记总结：列表分为三种：1.无序列表，2.有序列表，3.自定义列表无序列表的特点： 1.文本没有特殊样式 2.有序列表样式默认小黑点 3.无序列表前面有空白的缝隙 4.type可以改变无序列表前面小圆点的样式有序列表的特点： 1.type可以改变有序列表前面序号的样式（1 A a i I） 2.start可以指定序号从几开始排列 table表格特点: 1.border属性定义边框线的粗细程度 2.cellspacing属性定义单元格与单元格之间的空白缝隙默认值2 3.cellpadding属性定义单元格内容到单元格边框线之间的距离默认值1 4.align属性设置表格在页面中的位置 5.width,height两个属性可以设置表格的宽和高 table表格结构： 1.caption标签定义表格标题 2.thead标签定义表头 3.th标签定义表头内容 4.tbody标签定义表格主体 5.td标签定义表格主体内容 6.tf

2024-07-28

JavaScript笔记总结（Xmind格式）：第七天

DOM:document object model 文档对象模型获取DOM节点（获取的元素都属于DOM对象）： 1.根据ID获取元素：document.getElementById 2.根据类名获取元素：document.getElementsByClassName 3.根据标签名获取元素：document.getElementsByTagName 4.获取特殊节点： ①获取html：document.documentElement ②获取body：document.body ③获取title：document.title 修改DOM节点的内容： 1.innerHTML可以识别标签 2.innetText 不可以识别标签修改css样式： 1.元素.style.样式名 = '样式值' 2.多个单词时第二个单词的首字母要大写

2024-07-25

JavaScript笔记总结（Xmind格式）：第六天

第六天的详细笔记总结

2024-07-24

JavaScript笔记总结（Xmind格式）：第五天

Xmind笔记总结，第五天

2024-07-23

网站静态页面制作：成长守护平台项目

成长守护平台项目源码，整个项目有五个网页组成：首页，成长守护，星星守护，守护共创，帮助。里面有HTML源代码，CSS源代码，以及图片等资源。五个页面共用的头部导航栏和页面底部模块都已放在common.css样式文件中，每个页面只需要使用link标签引入common.css样式即可。

2024-07-20

HTML笔记总结（Xmind格式）：第一天

以树状图的形式展现更详细的知识点！

2024-07-22

JavaScript笔记总结(Xmind格式)：第四天

更详细更直观的总结，内含源码图片！

2024-07-22

第三天JavaScript笔记总结

2024-07-19

第二天JavaScript笔记总结

2024-07-19

Vue第七天.xmind

路由的概念 1.路由的本质就是一种对应关系，比如说我们在url地址中输入我们要访问的url地址之后，浏览器要去请求这个url地址对应的资源。那么url地址和真实的资源之间就有一种对应的关系(映射关系)，就是路由,比如生活中的路由。 2.路由的优点： 1.整体不刷新页面，用户体验更好 2.数据传递容易, 开发效率高 3.路由的三个对象：路由中有三个基本的概念 route, routes, router vue-router的使用步骤 1.下载vue-router模块到当前工程 2.在main.js中引入VueRouter函数 3.添加到Vue.use()身上 – 注册全局RouterLink和RouterView组件 4.创建路由规则数组 – 路径和组件名对应关系 5.用规则生成路由对象 6.把路由对象注入到new Vue实例中 7.用router-view作为挂载点, 切换不同的路由页面 vue路由-导航 1.声明式导航 1.基础使用 1.vue-router提供了一个全局组件 router-link 2.router-link实质上最终

2024-09-03

Vue第六天.xmind

动态组件 3.组件中name属性的作用递归组件:一个组件要用自己的时候，可以通过自己的名字来使用自己。 2.组件缓存组件切换会导致组件被频繁销毁和重新创建, 所以性能不高,Vue内置的keep-alive组件包起来要频繁切换的组件 1.动态组件切换 1.多个组件使用同一个挂载点，并动态切换，这就是动态组件。 2.使用:is用于动态组件且基于 DOM 内模板的限制解析来工作。插槽 1.匿名插槽 1.组件内用<slot></slot>占位 2.使用组件时夹着的地方, 传入标签替换slot 2.具名插槽 1.slot的name属性起插槽名 2.使用组件时, template配合,使用v-slot进行绑定插槽的名称 3.v-slot:可以简化成#使用 4.v-bind可以省略成: v-on: 可以省略成@ v-slot: 可以简化成# 3.作用域插槽 1.子组件, 在slot上绑定属性和子组件内的值。 2.使用组件, 传入自定义标签, 用template和v-slot="scope" (自定义变量名)。 3.scope变量名自动绑定slot上所有属性和

2024-09-02

Vue第五天.xmind

2024-08-31

Vue第四天.xmind

vue知识总结监听器的基本使用： 1.作用：允许你响应数据的变化并执行异步操作或DOM更新。 2.通过watch属性来定义监听器 3.监听引用数据类型时，需要使用深度监听deep:true 组件的基本使用： 1.作用：封装可重用的代码，提高开发效率用 2.组件可以通过 Vue.component 全局注册 3.也可以使用 Vue 实例的 components 选项局部注册 4.使用组件：在父组件的模板中通过其标签名来引用它。 5.组件的选项：组件可以包含多个选项，如 data、computed、methods、props、events 等组件之间的通讯： 1.Props：用于父组件向子组件传递数据。 2.自定义事件：子组件可以通过 $emit 触发事件，父组件可以监听这些事件来执行操作。 3.Vuex：对于大型应用，Vuex 是一个状态管理模式和库，用于集中管理所有组件的公共状态。 4.插槽：Vue 允许你将父组件模板中的内容分发到子组件的模板中。这通过 <slot> 元素实现。

2024-08-31

Vue第三天.xmind

vue知识总结响应更新： 1.v-for高效更新： ①当v-for遍历的目标结构改变, Vue触发v-for的更新 ②数组非变更方法, 返回新数组, 就不会导致v-for更新, 可采用覆盖数组或this.$set() 2.v-for就地更新：v-for 的默认行为会尝试原地修改元素而不是移动它们 3.动态响应数据处理（数组、对象）： ①数组：Vue.set(data,index,newvalue); ②对象：vm.$set(data,index,newvalue); 4.会触发v-for更新的方法： - push() - pop() - shift() - unshift() - splice() - sort() - reverse() 5.不会触发v-for更新的方法： - slice() - filter() - c

2024-08-29

Vue第二天.xmind

vue知识总结：创建vue脚手架： 1.安装Node.js：Vue CLI作为一个npm包，需要Node.js来安装和运行。 2.安装Vue CLI：cmd指令 npm install -g @vue/cli 3.创建Vue项目：vue create 项目名 4.启动服务器：npm run serve Vue脚手架生成的主要项目文件： 1.node_modules # 项目依赖的第三方包 2.public # 静态文件目录 3.src # 业务文件夹 4.assets # 静态资源 5.components # 组件目录 6.App.vue # 整个应用的根组件 7.main.js # 入口js文件 8.gitignore # git提交忽略配置 9.babel.config.js # js编译器，兼容低版本的浏览器 10.jsconfig.json # 更改默认的webpack配置文件 11.package.json # 依赖包列表 12

2024-08-27

Vue第一天.xmind

vue知识总结： vue的优点： 1.体积小 2.更高的运行效率 3.双向数据绑定 4.生态丰富，学习成本低 vue指令： 1.指令：带有v-前缀的特殊属性 2.v-text：改变标签的文本 3.v-html：改变html标签，用来接收富文本 4.v-cloak：防止差值表达式出现 5.v-pre：跳过编译过程，直接展示原始标签 6.v-once:只渲染元素和组件一次 v-model基本使用： 1.v-model的数据双向绑定 2.视图发生变化，数据也跟着变化事件的基本使用： 1.简写形式 v-on可以简写为@ 2.当不传递参数的时候加不加括号都一样 3.传递参数时必须加括号事件修饰符： 1.stop:阻止事件冒泡 2.prevent:阻止默认行为 3.capture:事件捕获 4.修饰符可以串联使用按键修饰符 1.enter：回车键 2.tab：Tab 键 3.delete（捕获“Del

2024-08-26

深铭易购官网首页.zip

深铭易购官网首页是一个用到了JavaScript制作的页面，一个典型的商城网站的页面，非常适合刚学完JavaScript的小伙伴来制作。该资源包含了所有html，css，js全部源码，以及全部图片资源。还有网页用到的矢量图标。里面会有少量的用到了HTMl5+CSS3的知识，感兴趣的可以提前了解一下，看不懂的也可以不用制作。对了，还有一个swiper插件的一个使用，就是轮播图，当然插件也已经放在了压缩包里，可以直接使用。

2024-08-25

叮咚买菜官网首页.zip

HTML5+CSS3及JavaScript项目实战：叮咚买菜官网首页动态网页制作。包含html，css，js全部源码，以及全部图片资源。该项目用到了CSS3的动画及过度效果，并配合着JavaScript实现鼠标的移入移出，以及页面滚动导航栏的淡入淡出的效果。叮咚买菜官网首页的制作不仅用到了最基础的html+css，还用到了JavaScript配合着HTML5+CSS3的动态效果，是一个综合能力较强的一个网页制作。

2024-08-25

ES6第四天.xmind

node的模块化： 1.CommonJS 规范：Node.js 遵循 CommonJS 模块规范，该规范定义了如何在服务器环境中实现模块化，包括如何定义模块、如何引入和使用模块。 2.模块的定义：每个文件都是一个模块，模块内部定义的变量和函数默认情况下是私有的，即它们只在模块内部可用。 3.模块的导出：使用 module.exports 或 exports 对象将模块中的变量或函数导出 4.模块的引入：使用 require() 函数可以引入 Node.js 中的模块。 5.模块缓存：Node.js 会缓存引入的模块，当多次引入同一个模块会直接返回缓存的模块对象 6.模块的作用域：每个模块都有自己的作用域，这意味着在一个模块中定义的变量或函数不会影响到其他模块。 7.module 对象：每个模块都有一个内置的 module 对象，它包含了当前模块的信息，如 module.exports、module.id、module.filename 等。 cookie的基本使用： 1. 创建Cookie： ①通过设置d

2024-08-22

ES6第三天.xmind

ES6知识总结： Promise的使用: 1.使用 new Promise() 构造函数来创建一个 promise 对象 2.接受两个函数作为参数：resolve 和 reject ①resolve 函数在异步操作成功完成时调用，并将 promise 的状态从 "pending" 变为 "fulfilled"，同时将操作的结果作为参数传递出去。 ②reject 函数在异步操作失败时被调用，并将 promise 的状态从 "pending" 变为 "rejected"，同时将错误作为参数传递出去。 3.处理 Promise： ①.then()：用于处理 promise 成功的情况 ②.catch()：用于处理 promise 失败的情况 ③.finally()：无论 promise 成功还是失败都会执行解决回调地狱：链式调用：由于 .then() 和 .catch() 方法都返回 promise 对象，所以你可以链式地调用它们，这样可以很容易地处理多个异步操作 asnyc与awa

2024-08-21

ES6第二天.xmind

ES6知识总结 Proxy（代理）： 1.作用：实现数据的私有化处理 2.target 目标对象 handler处理函数 3.处理函数中有两个方法：get,set 4.读取数据会触发get方法，写入数据会触发set方法 Reflect（反射） 1.作用：用于拦截并操作JavaScript对象的方法 2.提供与Object内置方法相同功能的方法 3.提供更安全的操作 4.作为Proxy的默认操作 ES6字符串的操作方法： 1.字符串的识别： ①includes()：返回布尔值，判断是否找到参数字符串。 ②startsWith()：返回布尔值，判断参数字符串是否在原字符串的头部。 ③endsWith()：返回布尔值，判断参数字符串是否在原字符串的尾部。 2，字符串重复：repeat()：返回新的字符串，表示将字符串重复指定次数返回。 3.字符串补全： ①padStart(targetLength [, padString])：返回新的字

2024-08-20

ES6第一天.xmind

新增语法： 1.let声明变量的特点： ①let 没有变量提升 ②在同一作用域下let的变量不能重复声明 ③let声明的变量存在块级作用域 2.const声明常量的特点： ①声明常量的时候必须进行赋值 ②基本数据的常量一旦赋值不能被修改，引用数据类型的常量可以被修改 ③同一作用域下不能同名，具有块级作用域，不会被声明提升解构： 1.解构分为两个部分： ①解构源：=右边的部分 ②解构的目标：=左边的部分 2.解构的作用： ①一一对应进行赋值，可以忽略某个值 ②通过剩余运算符可以把多个元素合并到一个变量中 3.解构可以有默认值对象解构（按需解构）： 1.语法格式 let {属性名} = 对象名； 2.可以通过扩展运算符给对象存储属性名和值 Symbol类型： 1.Symbol 是一个基本数据类型不能new 2.Symbol 是一个独一无二的值 Ma

2024-08-19

Ajax第二天.xmind

ajax知识总结： ajxa默认属于异步操作：可以通过open方法，设置false改为同步操作 ajax实现局部更新的基本步骤： 1.创建 XMLHttpRequest 对象：这是 AJAX 的核心，用于与服务器交换数据 2.配置请求：设置请求的方法（GET 或 POST）、URL 以及是否需要异步处理等 3.发送请求：通过 XMLHttpRequest 对象的 send() 方法发送请求到服务器。 4.处理响应：当请求被服务器处理后，服务器会返回响应。通过监听 XMLHttpRequest 对象的 onreadystatechange 事件或 onload 事件（现代浏览器推荐使用），可以获取到服务器的响应数据，并据此更新页面的指定部分。跨域： 1.跨域是违背了浏览器的同源策略，同源策略是浏览器的一种安全策略 2.什么是同源策略？协议域名端口号只要其中有一个不一样就违背了同源策略就会产生跨域 3.解决跨域：生产环境一般跨域都是后台解决，前端代码要放到服务器上，开发环境可以通过jsonp解决跨域

2024-08-19

Ajax第一天.xmind

ajax知识总结：网络的基本知识： 1.物理层：源设备到目的设备底层传输就是比特流 2.数据链路层进行电信号的处理进行数据的分组 3.网路层进行数据包的传递进行不同网络的选择 4.传输层：数据包的传输建立连接保证数据不丢失 5.会话层：建立连接保持连接关闭连接 6.表示层处理数据的格式和编码方式 7.应用层：直接服务用户直接为用户提供网络服务 HTTP协议： 1.http：超文本传输协议 2.https:HTTP+SSL/TLS，通过 SSL证书来验证服务器的身份，并为浏览器和服务器之间的通信进行加密 JSON： 1.是一种轻量级的数据交换格式 2.JSON的语法格式有：对象，字符串，数组 3.JSON对象的方法： ①JSON.parse(str)将JSON格式的字符串解析成一个JavaScript的对象 ②JSON.stringify(obj)将JavaScript对象解析成JSON格式的字符串 Ajax的作用： 1

2024-08-16

CSS第五天.xmind

css知识总结：元素的显示与隐藏： 1.通过display隐藏元素不保留位置 2.通过visibility 隐藏元素保留位置 3.overflow 溢出隐藏鼠标样式cursor： 1.defauly小白 2.pointer小手 3.move移动 4.text文本 5.not-allowed禁止文字的溢出与隐藏： 1.强制文本在一行显示 white-space: nowrap; 2.将溢出部分隐藏 overflow: hidden; 3.将超出的文本使用省略号代替text-overflow: ellipsis; 块级格式化上下文（BFC）： 1.创建BFC ①html根元素 ②设置浮动 ③设置定位 ④设置display ⑤设置overflow ⑥弹性布局 flex 2.利用BFC解决问题 ①解决外边距的塌陷问题(垂直塌陷) ②利用BFC解决包

2024-08-13

CSS第四天.xmind

css知识总结：浮动float： 1.left向左浮动，左对齐 2.right向右浮动，右对齐浮动特性： 1.浮动会脱离标准流，不占位置 2.当子元素全部浮动之后，父盒子会出现高度为0的情况 3.解决父盒子为0的方法： ①给父盒子设置高度 ②使用overflow：hidden溢出隐藏 ③添加一个额外的盒子 ④使用伪元素after 设置列表的样式： 1.list-style:none去除小黑点的样式 2.list-style-image将小黑点设置为图片 3.list-style-position改变小黑点的位置 position定位属性： 1.static静态定位 2.relative相对定位（根据盒子的左上角来进行定位，根据自身原本的位置进行移动，保留原来的位置，不脱离文档流） 3.absolute绝对定位（根据已有定位的父元素进行定位，不保留原来的位置，脱离文档流） 4.子绝父相：当某个元素需要使用绝对定位的时候

2024-08-13

CSS第三天.xmind

css知识：边框线： 1.border-width:边框的粗细 2.border-style:边框线的样式(solid实线,double双实线,dotted点线，dashed虚线) 3.border-color:边框线的颜色 4.简写形式：border:粗细样式颜色 5.单独指定每个边框线的样式：border-top(left,right,bottom) 边框圆角： 1.border-radius：值可以是固定的也可以是百分比（100%为圆） 2.不设置边框也可以设置边框圆角，它们两个之间没有直接的联系 3.可以单独指定每个边框的圆角：border-radius:上右下左内边距： 1.边框线到内容之间的距离 2.内边距会改变盒子的大小 3.盒子的大小=内容+内边距+边框线 4.简写形式：padding:上右下左 5.改变内容在盒子中的位置 6.在不改变盒子大小的前提下，只能改变内容的大小外边距： 1.盒子与盒子之间的距离 2.不

2024-08-13

CSS第二天.xmind

css知识总结：复合选择器： 1.交集选择器：在一个选择器的基础上，再增加一个选择器来增加条件（中间不能有任何符号包括空格） 2.并集选择器：多个选择器之间用逗号隔开，表示同时选择多个标签使用样式 3.后代选择器：使用空格分隔 4.子元素选择器：使用>分割标签显示模式的区别： 1.块级元素： ①默认大小都是一整行 ②可以设置宽度高度内边距外边距 ③块级元素可以容纳任意的内容或标签 2.行内元素： ①默认大小就是内容大小 ②不可以设置宽度高度内边距外边距 ③内容只能容纳文本，图片，任意的行内元素 3.行内块元素： ①默认大小就是内容大小 ②可以设置宽度高度内边距外边距 ③块级元素可以容纳任意的内容或标签设置标签的显示模式： 1.display:block块级元素 2.display:inline行内元素 3.display:inline

2024-08-12

JavaScript高阶第三天.xmind

js高阶笔记总结：严格模式： 1.开启严格模式："use strict" 2.不使用var关键字声明会报错 3.严格模式下普通函数的this指向undefined 高阶函数：满足其中之一即高阶函数： 1.函数作为参数 2.函数作为返回值闭包： 1.闭包的三个特性： ①函数嵌套函数 ②函数内部访问外部函数的参数或变量 ③可以使函数中的变量长期驻扎在内存中 2.闭包的好处： 1.使函数内部变量长期驻扎在内存中 2.避免全局变量污染 3.闭包的坏处： 1.内存泄漏（程序中不再用到的内存，没有及时释放，就叫内存泄漏）递归： 1.函数内部自己调用自己，这个函数就叫递归函数 2.递归函数的作用和循环效果一样，由于递归很容易发生“栈溢出”错误，所以必须要加退出条件return 拷贝： 1.浅拷贝：Object.assign() 2.深拷贝： ①将对象转为字

2024-08-12

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人