01 2023 档案
摘要:可选链(Optional chaining) 可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。 ?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空nullish(null 或者undefined)的情况下不会引起错误,该表达式短路返
阅读全文
摘要:1 模块化概念 1.1 什么是模块化 模块化: 将一个大的js文件拆分成一个个小的js文件,最终通过某种语法组合在一起 模块:一个js文件就是一个模块,只针对js文件处理 特点:模块的内部数据/实现是私有的, 只是向外部暴露一些接口(方法/数据)与外部其它模块通信 1.2 模块化发展历史 使用命名函
阅读全文
摘要:import函数的参数,指定所要加载的模块的位置。 import命令能够接受什么参数,import()函数就能接受什么参数,两者区别主要是后者为动态加载 import()返回一个 Promise 对象。 它是运行时执行,也就是说,什么时候运行到这一句,就会加载指定的模块 <!DOCTYPE html
阅读全文
摘要:1. Promise功能 回调函数嵌套回调函数被称作回调地狱,代码层层嵌套,环环相扣,很明显,逻辑稍微复杂一些,这样的程序就会变得难以维护。代码臃肿,可读性差,耦合度过高。 对于这种情况,程序员们想了很多解决方案(比如将代码模块化),但流程控制上,还是大量嵌套。 ES2015的标准里,Promise
阅读全文
摘要:1 类的由来 JavaScript 语言中,生成实例对象的传统方法是通过构造函数 function Person(name, age) { this.name = name; this.age = age; } Person.prototype = { course: "html5", do() {
阅读全文
摘要:1 什么是Generator Generator 函数是 ES6 提供的一种异步编程解决方案,内部封装了很多的状态,被称作状态机 生成器 执行Generator会返回一个迭代器对象(iterator),使用iterator来遍历出Generator内部的状态 形式上,Generator 函数是一个普
阅读全文
摘要:1 什么是iterator JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Map和Set。这样就有了四种数据集合,用户还可以组合使用它们,定义自己的数据结构,比如数组的成员是Map,Map的成员是对象。这样就需要一种统一的接口机制
阅读全文
摘要:1 Set 1.1 什么是Set ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。 Set本身是一个构造函数,用来生成 Set 数据结构。 Set函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化 let st = ne
阅读全文
摘要:1 Symbol 1.1 什么是Symbol ES5 的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法,新方法的名字就有可能与现有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是
阅读全文
摘要:1 对象的简写 ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁。 // 1.属性的简写 let [name, age, sex] = ["xiaowang", 20, "女"]; let p1 = { name: name, age: age, sex: se
阅读全文
摘要:指数运算符 在Math中提供了 pow的方法 用来计算一个值的n次方 ES11 提出了新的方法求一个值的n次方 那就是 ** 操作符 //求 一个数字的 n次方 是一个很大的需求 console.log(Math.pow(3, 3)); console.log(Math.pow(30, 7)); /
阅读全文
摘要:1 函数参数默认值 1.1 ES5默认参数 ES6 之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 function fn1(a, b) { // b = b || "world"; if (typeof b "undefined") { b = "world"; } console.l
阅读全文
摘要:1 扩展运算符 1.1什么是扩展运算符 扩展运算符(spread)是三个点(...)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列,目前也可以用来展开数组。 let arr = [1, 2, 3]; console.log(...arr); console.log([1,2,.
阅读全文
摘要:1. 模版字符串 传统的 JavaScript 语言,输出模板通常要拼接字符串 // 原始方法做模版 let data = { message: { title: "今天天气真的很好", todo: "打台球", time: "时间2020.3.25" } } let oOuter = docume
阅读全文
摘要:1. 什么是变量的解构赋值 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。 解构赋值 本质就是赋值,把结构解散重构 然后赋值 其实是一种模式的匹配,关键要掌握一一对应关系。 解构赋值作用就是方便赋值。 //1.请把数组arr1中的值分别赋
阅读全文
摘要:1.1 函数作用域 在ES5中,JS的作用域分为全局作用域和局部作用域。通常是用函数区分的,函数内部属于局部作用域。 //ES6之前只有函数才构成局部作用域 //案例1 { var a = 10; } console.log(a); //案例2 console.log(a); if (true) {
阅读全文
摘要:1.1 JS历史 JavaScript 诞生于 1995 年。NetScape发布NetScape Navigator2浏览器,提供了免费开发工具LiveScript,设计的主要目的是处理以前由服务器端语言负责的一些输入验证操作。在人们普遍使用电话拔号上网的年代,能够在客户端完成一些基本的验证任务绝
阅读全文
摘要:严格模式 理解 除了正常运行模式(混杂模式),ES5添加了第二种运行模式:"严格模式"(strict mode)。 顾名思义,这种模式使得Javascript在更严格的语法条件下运行 目的/作用 严格模式修复了一些导致 JavaScript引擎难以执行优化的缺陷:有时候,相同的代码,严格模式可以比非
阅读全文
摘要:一、什么是LESS 1.1 LESS简介 less是一种动态样式语言,属于css预处理器,它扩展了 CSS 语言, 增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展 LESS 既可以在 客户端 上运行 ,也可以借助Node.js在服务端运行。 动态样式:CSS是一门非程序式语言,需要书
阅读全文
摘要:一、jQuery事件 1.1 常见事件 JavaScript 有一个非常重要的功能,就是事件驱动。当页面完全加载后,用户通过鼠标或键盘触发页面中绑定事件的元素即可触发。 为了使开发者更加方便的绑定事件,jQuery 封装了常用的事件以便节约更多的代码。我们称它为简写事件 方法名触发条件描述 clic
阅读全文
摘要:一、jQuery动画 1.1 jQuery 的显示和隐藏 jQuery 中显示方法为 .show(), 隐藏方法为 .hide() 。在无参数的时候,只是硬性的显示内容和隐藏内容 在 .show() 和 .hide() 方法可以传递一个参数,这个参数以毫秒(1000 毫秒等于 1 秒钟)来控 制速度
阅读全文
摘要:一、jQuery的产生 它的作者是 John Resig ,于2006年创建的一个开源项目 jQuery 是一个 JavaScript 库,它通过封装原生的 JavaScript 函数得到一整套定义好的方法 jQuery 已经集成了 JavaScript 、 CSS 、 DOM 和 Ajax 于一体
阅读全文
摘要:1 数组快速排序 function quickSort(arr) { // 数组长度 var length = arr.length; // 退出条件 // 如果if里面代码只有一行,可以省略大括号 if (length <= 1) return arr; // 基准值下标 var index =
阅读全文
摘要:1. 进程与线程 进程:程序的一次执行, 它占有一片独有的内存空间 线程: 进程内的一个独立单元,CPU的基本调度单位, 是程序执行的一个完整流程 进程与线程 一个进程中一般至少有一个运行的线程: 主线程 一个进程中也可以同时运行多个线程, 我们会说程序是多线程运行的 一个进程内的数据可以供其中的多
阅读全文
摘要:1 面向对象 1.1 对象创建方式 方式一: Object构造函数模式 套路: 先创建空Object对象, 再动态添加属性/方法 适用场景: 起始时不确定对象内部数据 问题: 语句太多 /* 一个人: name:"Tom", age: 12 */ var p = new Object() p = {
阅读全文
摘要:1. 原型链 1.1 函数的prototype属性 每个函数都有一个prototype属性, 它默认指向一个Object空对象(即称为: 原型对象) console.log(Date.prototype, typeof Date.prototype) function fn() {} console
阅读全文
摘要:便于阅读和交流 4.3 如何定义函数? 函数声明 表达式 实例化函数对象 4.4 函数的2种角色 函数: 通过()使用 对象: 通过.使用 ==> 称之为: 函数对象 4.5 如何调用(执行)函数? test() new test() obj.test() test.call/apply(obj)
阅读全文
摘要:事件模型 基本事件模型:也称为DOM0事件模型,是浏览器初期出现的一种比较简单的事件模型,主要通过HTML事件属性,为指定标签绑定事件处理函数。由于这种模型应用比较广泛,获得了所有浏览器的支持,目前依然比较流行。但是这种模型对于HTML文档标签依赖严重,不利于JavaScript独立开发 DOM事件
阅读全文
摘要:节点操作 因为节点关系都是只读的,所以 DOM 提供了一些操作节点的方法 创建节点 使用document对象的createElement方法能够根据参数指定的标签名创建一个新的元素。并返回对新元素的引用 使用creatElement方法创建的新元素不会被自动添加到文档里,需要使用appendChil
阅读全文
摘要:设计大小 offsetWidth和offsetHeight 使用offsetWidth和offsetHeight属性可以获取元素的尺寸(content+padding+border) offsetWidth表示元素在页面中所占用的总宽度,offsetHeight表示元素在页面中所占用的总高度。 of
阅读全文
摘要:DOM0级绑定事件方法 元素 . on+事件名称 = 函数 相当于给一个元素的属性赋值,只能赋一个值,后面如果再赋值就会覆盖前面的值,所以说DOM0级事件只可以绑定一次,如果绑定多次,后面的会把前面的给覆盖了,因为是一个赋值的过程,一个属性只能赋一个值 失去和获取焦点事件 focus 获取焦点事件
阅读全文
摘要:什么是 DOM DOM( Document Object Model,文档对象模型)是W3C制订的一套技术规范,用来描述 Javascript脚本如何与HTML进行交互的Web标准 加载 HTML 页面时, Web浏览器生成一个树型结构,用来表示页面内部结构。DOM 将这种树型结构理解为由节点组成的
阅读全文
摘要:一、什么是BOM 浏览器对象模型(Browser Object Model)。主要用在客户端浏览器的管理。 一直没有被标准化,不过各个主流浏览器都支持BOM,浏览器提供商会按照各自的想法随意去扩展它 它使 javascript 有能力与浏览器进行“对话”。 二、window对象 BOM 的核心对象是
阅读全文
摘要:一 正则表达式概述 1.1 什么是正则表达式 正则表达式本身就是一种语言,这在其他语言中是通用的 正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符串、及这些特定字符串的组合,组成的一个“规则字符串”,这个规则字符串用来表达对字符串的一种过滤逻辑。 正则就是规则,让计算机读懂我们
阅读全文
摘要:获取时间 Date用来处理日期和时间的 // 获取当前的时间 var now = new Date(); console.log(now)//Fri Aug 02 2019 14:20:09 GMT+0800 (伊尔库茨克标准时间) console.log(typeof now)//对象Copy t
阅读全文
摘要:Math对象是JavaScript的内置对象,提供一系列的数学常数和数学方法。Math对象只提供了静态的属性和方法,所以使用时,不需要实例化。 JS对象的分类: 内部对象: js中的内部对象包括Array、Boolean、Date、Function、Global、Math、Number、Object
阅读全文
摘要:基本包装类型 为了方便操作简单数据类型,JavaScript还提供了三个特殊的简单类型类型:String/Number/Boolean 实际上,每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而让我们能够调用一些方法来操作这些数据 var s1 = "some text";
阅读全文
摘要:什么是数组 数组(Array)是有序数据集合 数组中的每个成员被称为元素(Element),每个元素的名称(键)被称为数组下标(index) 数组内不同元素的值可以为不同类型 数组的长度是弹性的、可读写的 在Javascript脚本中数组主要用于临时寄存同类数据,进行高速批量运算。 var arr
阅读全文
摘要:什么是对象 js中,任何值都可以转换为对象,以对象的方式进行使用,如数字对象、布尔值对象、字符串对象、类型对象、函数对象、数组对象等,它们都继承 Object类型对象,拥有共同的基本属性和方法。 此外, JavaScript也允许自定义对象,从狭义的概念来分析,对象(Object)是最基本的数据类型
阅读全文
摘要:函数是一段被封装的代码,可以反复被调用。 在JS中,函数也可以是一个值、一个对像、还可以是一个表达式,因此函数可以赋值、可以运算、可以拥有属性和方法 JavaScript拥有函数式编程的很多特性和风格,灵活使用函数,可以编写出功能大、代码简洁、设计优雅的程序。 //自我介绍 /* var yourG
阅读全文
摘要:什么是语句 ECMA-262 规定了一组流程控制语句。语句定义了 ECMAScript 中的主要语法,语句通常由一个或者多个关键字来完成给定的任务。诸如:判断、循环、退出等。 语句主要分为:声明、分支控制、循环控制、流程控制、异常处理等。 声明语句 声明语句包含三种:声明变量、声明函数和声明标签 /
阅读全文
摘要:运算符是根据特定的规则对操作数执行运算 JS共定义了47个运算符。 逗号操作符 逗号运算符是二元运算符,它能够先执行运算符左侧的操作数,然后再执行右侧的操作数,最后返回右侧操作数的值。 //逗号操作符执行计算总会返回最后一项 var num4 = (4,5,6,7,8); console.log(n
阅读全文
摘要:数据类型-声明变量练习 // 声明一个变量a,值为:3 // 声明一个变量b,值为:null // 声明一个变量c,值为:"Hello!" // 声明一个变量d,值为:true // 声明一个变量e,不赋值 // 声明一个变量f,值为"" var a = 3; var b = null; var c
阅读全文
摘要:JS的引入 <script>标签 向 HTML 页面中插入 JavaScript 的主要方法,就是使用*<script>*元素 按照传统的做法,所有<script>元素都应该放在页面的<head>元素中 但是现在脚本一般都写在 body 元素紧接着关标签之上 浏览器解析HTML文档的时候,将根据文档
阅读全文
摘要:JS历史 JavaScript 诞生于 1995 年。NetSpace发布Netspace Navigator2浏览器,提供了免费开发工具LiveScript,设计的主要目的是处理以前由服务器端语言负责的一些输入验证操作。在人们普遍使用电话拔号上网的年代,能够在客户端完成一些基本的验证任务绝对很不容
阅读全文
摘要:前言 早在2010年,设计人员和开发人员就开始实践“响应网页设计”(RWD): 随着网络设备尺寸千变万化,为了达到相同的体验,通常的做法是剪切不相关的设计。实际上,我们可以让我们的设计更好的适应渲染屏幕。 一、 什么是响应式 响应式网页设计就是一个网站能够兼容多个终端,而不是为每个终端做一个特定的版
阅读全文
摘要:伸缩盒子模型 伸缩盒子模型控制的是父子关系 父元素:伸缩容器 子元素:伸缩项目 主轴:start-end 交叉轴(侧轴) Flex容器 display:flex display:-webkit-box(旧版本) 主轴布局方向 flex容器flex-direction: row row-reverse
阅读全文
摘要:过渡动画 允许 CSS 的属性值在一定时间区间内平滑的过渡,在鼠标点击,鼠标滑过或对元素任何改变中触发,并圆滑地以动画改变css的属性值 CSS3 过渡语法: transition:[ transition-property ] || [ transition-duration ] || [ tra
阅读全文
摘要:背景图原点 background-origin :padding-box; (默认) border-box | padding-box | content-box background-origin是用来决定图片的原始起始位置。 它有三个可选值content-box,padding- box,bor
阅读全文
摘要:圆角边框 CSS3 圆角边框(IE9.0以前版本不支持): border-radius:[ length | % ]{1,4} / [ length | % ]{1,4} border-top-left-radius:5px ; border-top-right-radius:15px; borde
阅读全文
摘要:动态伪类选择器 锚点伪类:link、visited 用户行为伪类:hover、active、focus 目标伪类target(IE9及以上) 属性选择器 选择器描述 E[attr] 有属性att的所有E元素 E[attr='val'] 属性att的值是val的元素 E[attr^='val'] 属性
阅读全文
摘要:音视频历史 大家都有在网页中浏览视频的经历,但在HTML5之前,对视频乃至音频都还没有一个标准 因此在网页中看到的视频,都是通过第三插件的方式嵌入的,可能是QuickTime,也可能是RealPlayer 或者 Flash。浏览器很好的整合了这些插件,你完全意识不到它们的存在 音视频格式 大多数人会
阅读全文
摘要:表单的新属性规范 h5规范允许 当属性名和属性值相等的时候 可以直接书写属性名即可 在js中,h5允许以布尔值的形式控制属性开启或关闭 也就是在js中 给autofocus属性设置值为true(真,打开) 或者是 false(假,关闭) 但是在元素的属性中 不允许使用true或者是false来控制开
阅读全文
摘要:html标签的语义化 语义化标签更具有可读性,便于团队的开发和维护 没有css的情况下,网页也能很好的呈现出内容结构和代码结构 关于SEO,搜索引擎更能理解到网页中各部分之间的关系,更准确更快速搜索信息 header标签 用来定义文档(网页或者是某一个段落)的页眉(头部) 可能包含一些标题元素,也可
阅读全文
摘要:粘连布局 又称作 stick footer布局 如果页面不够长的话 footer粘在视窗的底部 如果页面内容长度超出,footer就会被页面向下推送出去 粘连布局方法1 给inner最小高度是 100% 让footer给margin-top:-50px (自身高度)上去 (main元素和footer
阅读全文
摘要:CSS精灵 精灵图(雪碧图、css sprites): 是一种网页图片的应用处理方式,允许将一个页面中很多零星的小图片包含到一张大图中去,当访问页面的时候,就不会一张张的去请求显示图片 对于当前的网络来说,小于200k的文件加载速度是一样的 通过background-position属性 将图片定位
阅读全文
摘要:定位的概念: 除非专门指定,否则所有框都在普通流中定位。 也就是说,普通流中的元素的位置由元素在 HTML 中的位置决定。 定位的基本思想很简单,它允许你定义元素框相对于其正常位置应该出现的位置,或者相对于父元素甚至浏览器窗口本身的位置 通过使用 position 属性,我们可以选择 4 种不同类型
阅读全文
摘要:浮动的来历 正常页面流: 在css中,是存在流的概念的,正常情况下,页面总是由左至右,由上至下布局,我们把这种情况称作为正常页面流 但是,在很多情况下,正常页面流有很多效果实现不了,所以需要一些手段来破坏流,而浮动(float)就是破坏流的一种手段 浮动的来历: float设计的初始想法仅仅是为了做
阅读全文
摘要:文本颜色的设置(color) color属性: 设置文字颜色(可以继承的) 可以直接设置颜色的名字(开发中很少使用,因为不精确) red green yellow pink blue grey purple orange lightblue lightgreen greenyellow yellow
阅读全文
摘要:盒子模型的概念: 在html中,把每一个元素都当做成一个盒子,拥有盒子的平面外形和空间 盒模型由内容(content)+内边距(padding)+边框(border)+外边距(margin)4部分构成 内容区域:你书写的内容或者子元素能够显示的区域 内边距:撑开内容与边框的距离 边框:元素的边框 外
阅读全文
摘要:后代选择器 后代选择器使用空格间隔开 (A B:在A元素中寻找后代(不一定是儿子)是B的元素) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>后代选择器</title> <style> /* .box li
阅读全文
摘要:什么是选择器 要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。 HTML页面中的元素就是通过CSS选择器进行控制的 id选择器 我们可以给元素设置id属性,然后通过 #+id属性值 的方式来选择这个元素 选择器命名: id就像我们的身份证号,是不允许重
阅读全文
摘要:内联式、 行内引入: 引入方法 直接在html的标签中书写css。这是一种最为原始也是最容易理解的 样式内容书写在html标签的style属性中,多个css样式可以写在一起,使用分号隔开。<标签名 style="具体样式属性: 属性值;">内容</标签名> 样式书写是 样式名:样式值; (注意全部是
阅读全文
摘要:什么是CSS 层叠样式表或级联样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML或XML等文件样式的计算机语言。 CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有
阅读全文
摘要:span元素 没有任何特殊的含义 主要是为了增加额外的结构,方便我们控制样式或者是数据 并且使用要求:在其他语义化标签不适用的情况下再使用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>span</titl
阅读全文
摘要:div元素 整体页面布局当中最重要的 HTML 元素 没有任何具体的含义,主要用于网页的布局,通过一个一个的div将页面划分为不同的部分,之后在针对部分进行开发 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>Title</ti
阅读全文
摘要:01.html的历史 1982年,Tim Berners-Lee 建立 HTML 1993年6月,HTML 由 IETF 工作小組发布草案 1994年10月,W3C 成立, 网络应用发展的标准规范交由 W3C 协会制定及推广 1995年11月,HTML 2.0,2000年6月被宣布已经过时 1996
阅读全文
摘要:01. 网站和网页 网页是构成网站的基本元素,是承载各种网站应用的平台。 通俗地说,网站就是由网页组成的,如果只有域名和虚拟主机而没有制作任何网页的话,客户仍旧无法访问网站。 网页是一个包含HTML标签的纯文本文件,它可以存放在世界某个角落的某一台计算机中,是万维网中的一“页”,是超文本标记语言格式
阅读全文
摘要:基本概念 搜索引擎优化(SearchEngine Optimization,简称SEO),指在了解搜索引擎自然搜索机制的基础之上,对网站进行内部及外部的调整优化,改进网站在搜索引擎中关键字的自然排名,获得更多的展现量,吸引更多目标客户点击访问网站,从而达到互联网营销及品牌建设的目标 SEO可以帮助将
阅读全文
摘要:标签换行写法 <div> <p> 今天的天 <span>真的好啊</span> </p> </div>Copy to clipboardErrorCopied 标签需要关闭 <p> <span>哈哈哈哈哈</span> <em>呵呵呵呵</em> </p>Copy to clipboardError
阅读全文
摘要:table元素的基础元素组成 HTML的 table 元素表示表格数据 — 即通过二维数据表表示的信息 一个可选的 <caption> 元素 一个可选的 <thead> 元素 下列任意一个: 零个或多个 <tbody> 零个或多个 <tr> 零个或多个 <th> 零个或多个 <td> 一个可选的 <
阅读全文
摘要:form元素 为用户创建html表单 表单可以向服务器发送数据 form标签中可以包含很多表单元素 <form action="http://www.baidu.com" method="get">Copy to clipboardErrorCopied action属性: 表单提交的地址 meth
阅读全文
摘要:01. 万维网 www其实是World Wide Web 的缩写,它是一个由许多互相链接的超文本组成的系统,通过互联网访问。在汉语中,www 被翻译成“万维网” 。 www由两部分构成:www客户端和www服务端。www客户端指的是个人设备(电脑、手机等)装的浏览器。www服务端指的是服务器(一台可
阅读全文
摘要:1:iframe的概念以及作用 iframe是嵌入式框架, 是html标签, 还是一个内联元素, iframe 元素会创建包含另外一个文档的内联框架(即行内框架) . 说白了, iframe用来在页面嵌入其他页面. 通常我们使用iframe直接直接在页面嵌套iframe标签指定src就可以了。 <i
阅读全文
摘要:Map1:什么是Map Map类似于对象,但是键名不限于字符串,可以说Object结构提供键值对应,Map提供值值对应,因此采用Map结构会优于传统对象。 const dataMap = new Map() const element = document.querySelector('.node'
阅读全文
摘要:项目结构 之前我有打算基于Webpack4自己写个脚手架用来打包文件,但是那段时间刚好Vue-cli3刚刚发布正式版并且也是基于Webpack4封装的,于是想了一下还决定使用新的Vue-cli3脚手架搭建,最后我将项目分为以下层级 ─api //api接口 ├─assets //项目运行时使用到的图
阅读全文
摘要:一、介绍Generator 函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同 回顾下上文提到的解决异步的手段: 回调函数promise那么,上文我们提到promsie已经是一种比较流行的解决异步方案,那么为什么还出现Generator?甚至async/await呢? 该问题我们
阅读全文
摘要:es6是什么 ECMAScript 6(简称ES6)是于2015年6月正式发布的JavaScript语言的标准,正式名为ECMAScript 2015(ES2015)。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。 es6可以做啥? ES6是一次重大的版本
阅读全文
摘要:function longestCommonPrefix(strs) { // write code here if (strs.length 0 || strs null) { return "" } let maxid = strs[0].length - 1; for (let i = 1;
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
摘要:01.defineProperty /** Object.defineProperty(obj, prop, descriptor) 参数1:obj: 要在其上定义属性的对象。 参数2:prop: 要定义或修改的属性的名称。 参数3:descriptor: 将被定义或修改的属性的描述符(包含数据描述
阅读全文
摘要:hash <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docu
阅读全文
摘要:自定义事件的基本用法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <
阅读全文
摘要:const fs = require('fs') const util = require('util') let readFile = util.promisify(fs.readFile) let isPromise = (x) => { if ((typeof x 'object' && x
阅读全文
摘要:深拷贝 1: // 循环递归法1 function isObject(obj) { return (typeof obj 'object' || typeof obj 'function') && obj !== null } // 迭代递归法:深拷贝对象与数组 function deepClone
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
摘要:发布订阅者 // on是订阅 emit是发布 let e = { _callback: [], on(callback) { // 订阅一件事 当这件事发生的时候 触发对应的函数 // 订阅 就是将函数放到数组中 this._callback.push(callback); }, emit(valu
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
摘要:表单的新属性规范 h5规范允许 当属性名和属性值相等的时候 可以直接书写属性名即可 在js中,h5允许以布尔值的形式控制属性开启或关闭 也就是在js中 给autofocus属性设置值为true(真,打开) 或者是 false(假,关闭) 但是在元素的属性中 不允许使用true或者是false来控制开
阅读全文
摘要:Vue官网对数据操作是这么描述的 能你还没有注意到,Vue 在更新 DOM 时是异步执行的。只要侦听到数据变化,Vue 将开启一个队列,并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发,只会被推入到队列中一次。这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操
阅读全文
摘要:1.减少map文件的输出: module.exports = { outputDir: `${srcFile}`, // 在npm run build时 生成文件的目录 type:string, default:'dist' productionSourceMap: false, // 是否在构建生
阅读全文
摘要:默认端口号是多少: 80 构建项目运行的命令package.json的 每次运行,就会在在项目的根目录生成一个dist文件,如果原来有,就删除重新创建 本地模拟上线/测试 使用nginx模拟生产环境 是一个高性能的HTTP和反向代理web服务器 注意 nginx在自己电脑的时候所在的路径不能用中文
阅读全文
摘要:传统开发多个页面每次访问一个页面都要向浏览器发送请求,然后服务端再响应解析,在这个过程中肯定会存在延迟,但是现在vue、react都是SPA(单页面应用) 。在首次访问的时候会加载所有的资源。 后期前端路由中仿问一个新的界面的时候只是浏览器的路径改变了,没有和服务端交互「所以不存在延迟」,这个对用户
阅读全文
摘要:一、为什么要封装组件(组件化开发) 组件化开发(封装组件)的好处 好处显而易见,可以增加代码的复用性、灵活性,从而提高开发效率。试想如果一个项目中在很多页面都能用到一个弹出框,若在每个页面都去写一套弹出框的结构样式和对应js的逻辑。这样的话,开发效率会大打折扣; 当然现在有很多优秀的组件库.不过我们
阅读全文
摘要:首先在toast文件夹去创建一个index.js文件,在js文件中创建一个对象,将他导出 // index.js const toast = {} export default toast 在main.js中导入这个文件,并且use它 // main.js import toast from 'to
阅读全文
摘要:一、为什么需要路由懒加载 vue在项目打包/构建(一般是npm run build 具体看package.json文件)之后,会生成一个dist文件夹。在dist文件夹里面又有一个js/app.js文件,这里主要存放的是整个项目的业务逻辑代码。随着项目不断的开发迭代,业务逻辑越来越多,app.js文
阅读全文
摘要:知道几个基本的概念 11rem的值永远等于根元素(html)的font-size属性值的大小2浏览器默认的font-size值的大小是16px3下文中rem.js的作用 = flexable.js = 安装的 amfe-flexible4vscode中使用的 作用=px2rem-loader这个插件
阅读全文
摘要:html标签的语义化 语义化标签更具有可读性,便于团队的开发和维护 没有css的情况下,网页也能很好的呈现出内容结构和代码结构 关于SEO,搜索引擎更能理解到网页中各部分之间的关系,更准确更快速搜索信息 header标签 用来定义文档(网页或者是某一个段落)的页眉(头部) 可能包含一些标题元素,也可
阅读全文