04 2020 档案
摘要:Photoshop界面设置 一.新建设置 Ctrl + n 二.移动工具设置 自动选择去掉,然后选择图层 三.视图设置 添加只能参考线 添加标尺 保留4大视图选项 设置单位为像素 新建一个工作区 Photoshop基本操作 一. 简单工具操作 选择工具 在选中模式下,按住Shift为增加选区,按住A
阅读全文
摘要:项目需求分析 这个环节是由项目经理完成,项目经理首先和客户进行交流,了解客户的需求,然后分析项目的可行性,如果项目可以被实现,项目经理写出项目需求文档交给设计师完成后续的开发。 页面设计 这个环节主要是UI设计师参与,UI设计师根据产品需求分析文档,对产品的整体美术风格、交互设计、界面结构、操作流程
阅读全文
摘要:二进制与十进制之间的转换 十进制转二进制 方法为:十进制数除2取余法,即十进制数除2,余数为权位上的数,得到的商值继续除2,依此步骤继续向下运算直到商为0为止。 二进制转十进制 方法为:把二进制数按权展开、相加即得十进制数。 八进制转成二进制 方法为:八进制数通过除2取余法,得到二进制数,对每个八进
阅读全文
摘要:网页布局的核心 就是用css 来摆放盒子位置 PC端布局:css 提供了 3种机制来设置盒子的摆放位置, 分别是普通流、浮动和定位。其中:1.普通流(标准流):累积盒子。自上而下 就用块级。 从左到右就用行内.2.浮动: 让盒子从普通流中浮动起来 -- 让多个盒子(div)水平排列成一行.3.定位:
阅读全文
摘要:这些this的指向,是当我们调用函数的时候确定的。调用方式的不同决定了this的指向不同一般指向我们的调用者。普通函数调用 window。定时器函数 window。立即执行函数 window。构造的函数调用 实例对象、原型对象里面的方法也指向实例对象。对象方法调用 该方法所属对象。事件绑定方法 绑定
阅读全文
摘要:前端是最贴近用户的程序员,比后端、数据库、产品经理、运营、安全都近。1、实现界面交互2、提升用户体验3、有了Node.js,前端可以实现服务端的一些事情前端是最贴近用户的程序员,前端的能力就是能让产品从 90分进化到 100 分,甚至更好,参与项目,快速高质量完成实现效果图,精确到1px;与团队成员
阅读全文
摘要:注意:用心找自己做的项目中自己感觉最拿出来手的(复杂度最高,用的技术最多的项目),描述的时候尽可能往里面添加一些技术名词布局我们用html5+css3我们会用reset.css重置浏览器的默认样式JS框架的话我们选用的是jQuery(也可能是Zepto)我们用版本控制工具git来协同开发我们会基于g
阅读全文
摘要:HTTP协议通常承载与 TCP协议之上,在HTTP和TCP之间添加一个安全协议层(SSL或TSL),这个时候,就成了我们常说的HTTPS 默认HTTP的端口号为80,HTTPS的端口号为443 因为网络请求需要中间有很多的服务器路由的转发,中间的节点都可能篡改信息,而如果使用HTTPS,密钥在你和终
阅读全文
摘要:尽量使用css3动画,开启硬件加速 适当使用touch时间代替click时间 避免使用css3渐变阴影效果 可以用transform: translateZ(0) 来开启硬件加速 不滥用float。float在渲染时计算量比较大,尽量减少使用 不滥用web字体。web字体需要下载,解析,重绘当前页面
阅读全文
摘要:当页面滚动的时间被触发 -——> 执行加载图片操作 -——> 判断图片是否在可视区域内 -——> 在,则动态将data-src的值赋予该图片。
阅读全文
摘要:100 Continue 继续,一般在发送post请求时,已发送了http header之后服务端将返回此信息,表示确认,之后发送具体参数信息 200 OK 正常返回信息 201 Created 请求成功并且服务器创建了新的资源 202 Accepted 服务器已接受请求,但尚未处理 301 Mov
阅读全文
摘要:1、首先是定义 进程: 是执行中一段程序,即一旦程序被载入到内存中并准备执行,它就是一个进程。进程是表示资源分配的的基本概念,又是调度运行的基本单位,是系统中的并发执行的单位。 线程: 单个进程中执行中每个任务就是一个线程。线程是进程中执行运算的最小单位。 2、一个线程只能属于一个进程,但是一个进程
阅读全文
摘要:大致可以分为如下7步: 输入网址; 发送到DNS服务器,并获取域名对应的web服务器对应的ip地址; 与web服务器建立TCP连接; 浏览器向web服务器发送http请求; web服务器响应请求,并返回指定url的数据(或错误信息,或重定向的新的url地址); 浏览器下载web服务器返回的数据及解析
阅读全文
摘要:1.压缩 css, js, 图片 2.减少 http 请求次数, 合并 css、js 、合并图片(雪碧图) 3.使用 CDN 4.减少 dom 元素数量 5.图片懒加载 6.静态资源另外用无 cookie 的域名 7.减少 dom 的访问(缓存 dom) 8.巧用事件委托 9.样式表置顶、脚本置低
阅读全文
摘要:主要分成两部分:渲染引擎(layout engineer或Rendering Engine)和JS引擎。 渲染引擎:负责取得网页的内容(HTML、XML、图像等等)、整理讯息(例如加入CSS等),以及计算网页的显示方式,然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同,所以渲
阅读全文
摘要:Vue 3.0 的目标是让 Vue 核心变得更小、更快、更强大,因此 Vue 3.0 增加以下这些新特性: (1)监测机制的改变3.0 将带来基于代理 Proxy 的 observer 实现,提供全语言覆盖的反应性跟踪。这消除了 Vue 2 当中基于 Object.defineProperty 的实
阅读全文
摘要:(1)代码层面的优化 v-if 和 v-show 区分使用场景 computed 和 watch 区分使用场景 v-for 遍历必须为 item 添加 key,且避免同时使用 v-if 图片资源懒加载 路由懒加载 当打包构建项目时,JavaScript包会变的非常打,影响页面加载。如果我们能把不同路
阅读全文
摘要:key 是为 Vue 中 vnode 的唯一标记,通过这个 key,我们的 diff 操作可以更准确、更快速。 Vue 的 diff 过程可以概括为: oldCh 和 newCh 各有两个头尾的变量 oldStartIndex、oldEndIndex 和 newStartIndex、newEndIn
阅读全文
摘要:虚拟 DOM 的实现原理主要包括以下 3 部分: 用 JavaScript 对象模拟真实 DOM 树,对真实 DOM 进行抽象; diff 算法 — 比较两棵虚拟 DOM 树的差异; pach 算法 — 将两个虚拟 DOM 对象的差异应用到真正的 DOM 树。
阅读全文
摘要:什么是虚拟dom用js模拟一颗dom树,放在浏览器内存中.当你要变更时,虚拟dom使用diff算法进行新旧虚拟dom的比较,将变更放到变更队列中, 反应到实际的dom树,减少了dom操作. 虚拟DOM将DOM树转换成一个JS对象树,diff算法逐层比较,删除,添加操作,但是,如果有多个相同的元素,可
阅读全文
摘要:受现代 JavaScript 的限制 ,Vue 无法检测到对象属性的添加或删除。由于 Vue 会在初始化实例时对属性执行 getter/setter 转化,所以属性必须在 data 对象上存在才能让 Vue 将它转换为响应式的。 但是 Vue 提供了 Vue.set (object, propert
阅读全文
摘要:Vue 数据双向绑定主要是指: 数据变化更新视图 视图变化更新数据。 即: 输入框内容变化时,Data 中的数据同步变化。即 View => Data 的变化。 Data 中的数据变化时,文本节点的内容同步变化。即 Data => View 的变化。 其中,View 变化更新 Data ,可以通过事
阅读全文
摘要:如果被问到 Vue 怎么实现数据双向绑定,大家肯定都会回答 通过 Object.defineProperty() 对数据进行劫持,但是 Object.defineProperty() 只能对属性进行数据劫持,不能对整个对象进行劫持。同理无法对数组进行劫持,但是我们在使用 Vue 框架中都知道,Vue
阅读全文
摘要:这个router有两种模式:hash模式(默认)、history模式(需配置mode: 'history') 然后,我们来研究下两者的原理: 我们先来认识下这位朋友#,这个#就是hash符号,中文名哈希符或锚点,当然这在我们前端领域姑且这么称呼。 然后哈希符后面的值,我们称之为哈希值。OK,接下来我
阅读全文
摘要:实际上存在三种模式: Hash: 使用URL的hash值来作为路由。支持所有浏览器。 History: 以来HTML5 History API 和服务器配置。参考官网中HTML5 History模式 Abstract: 支持所有javascript运行模式。如果发现没有浏览器的API,路由会自动强制
阅读全文
摘要:先说下基本概念: ssr 的全称是 server side render,服务端渲染,vue ssr 的意思就是在服务端进行 vue 的渲染,直接对前端返回带有数据,并且是渲染好的HTML页面; 而不是返回一个空的HTML页面,再由vue 通过异步请求来获取数据,再重新补充到页面中。 这么做的最主要
阅读全文
摘要:父子通信 (1)父组件向子组件传值props <button-counter :title="send"></button-counter> Vue.component('button-counter', { props: ['title'], data: function() { return {
阅读全文
摘要:我们在 vue 项目中主要使用 v-model 指令在表单 input、textarea、select 等元素上创建双向数据绑定,我们知道 v-model 本质上不过是语法糖,v-model 在内部为不同的输入元素使用不同的属性并抛出不同的事件: text 和 textarea 元素使用 value
阅读全文
摘要:如果两个实例引用同一个对象,当其中一个实例的属性发生改变时,另一个实例属性也随之改变,对象没有自己的作用域,只有当两个实例拥有自己的作用域时,才不会相互干扰。 这是因为JavaScript的特性所导致,在component中,data必须以函数的形式存在,不可以是对象 组件中的data写成一个函数,
阅读全文
摘要:在做电商有关的项目中,当我们第一次进入列表页需要请求一下数据,当我从列表页进入详情页,详情页不缓存也需要请求下数据,然后返回列表页,这时候我们使用keep-alive来缓存组件,防止二次渲染,这样会大大的节省性能。 keep-alive 是 Vue 内置的一个组件,可以使被包含的组件保留状态,避免重
阅读全文
摘要:比如有父组件 Parent 和子组件 Child,如果父组件监听到子组件挂载 mounted 就做一些逻辑处理,可以通过以下写法实现: // Parent.vue <Child @mounted="doSomething"/> // Child.vue mounted() { this.$emit(
阅读全文
摘要:https://www.cnblogs.com/thinheader/p/9462125.html 参考连接 Vue 的父组件和子组件生命周期钩子函数执行顺序可以归类为以下 4 部分: 加载渲染过程 父beforeCreate->父created->父beforeMount->子beforeCrea
阅读全文
摘要:生命周期是什么? Vue 实例有一个完整的生命周期,也就是从 开始创建、初始化数据、编译模版、挂载 Dom -> 渲染、更新 -> 渲染、卸载等一系列过程,我们称这是 Vue 的生命周期。 各个生命周期的作用 生命周期描述 beforeCreate 组件实例被创建之初,组件的属性生效之前 creat
阅读全文
摘要:由于 JavaScript 的限制,Vue 不能检测到以下数组的变动: 当你利用索引直接设置一个数组项时,例如: vm.items[indexOfItem] = newValue 当你修改数组的长度时,例如: vm.items.length = newLength 为了解决第一个问题,Vue 提供了
阅读全文
摘要:computed: 是计算属性,依赖其它属性值,并且 computed 的值有缓存,只有它依赖的属性值发生改变,下一次获取 computed 的值时才会重新计算 computed 的值; watch: 更多的是「观察」的作用,类似于某些数据的监听回调 ,每当监听的数据变化时都会执行回调进行后续操作;
阅读全文
摘要:数据从父级组件传递给子组件,只能单向绑定。 子组件内部不能直接修改从父级传递过来的数据。 所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定:父级 prop 的更新会向下流动到子组件中,但是反过来则不行。 这样会防止从子组件意外改变父级组件的状态,从而导致你的应用的数据流向难以理解
阅读全文
摘要:Class 可以通过对象语法和数组语法进行动态绑定: 对象语法: <div v-bind:class="{ active: isActive, 'text-danger': hasError }"></div> data: { isActive: true, hasError: false } 数组
阅读全文
摘要:SPA( single-page application )仅在 Web 页面初始化时加载相应的 HTML、JavaScript 和 CSS。 一旦页> 面加载完成,SPA 不会因为用户的操作而进行页面的重新加载或跳转; 取而代之的是利用路由机制实现 > HTML 内容的变换,UI 与用户的交互,避
阅读全文
摘要:Vuex 是一个专为 Vue.js 应用程序开发的状态(全局数据)管理模式。每一个 Vuex 应用的核心就是 store(仓库)。“store” 基本上就是一个容器,它包含着你的应用中大部分的状态 ( state )。 (1)Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态
阅读全文
摘要:v-if 是真正的条件渲染,会控制这个 DOM 节点的存在与否。因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建;也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。 v-show 就简单得多——不管初始条件是什么,元素总是会被渲染
阅读全文
摘要:MVVM分为Model、View、ViewModel三者。 Model 代表数据模型,数据和业务逻辑都在Model层中定义; View 代表UI视图,负责数据的展示; ViewModel 负责监听 Model 中数据的改变并且控制视图的更新,处理用户交互操作; Model 和 View 并无直接关联
阅读全文
摘要:我们都知道,JS代码的执行顺序总是与代码先后顺序有所差异,当先抛开异步问题你会发现就算是同步代码,它的执行也与你的预期不一致,比如: function f1() { console.log('听风是风'); }; f1(); //echo function f1() { console.log('e
阅读全文
摘要:这东西是真的很难理解,下面这个简单的图希望能够帮到你 1. 对象中是没有prototype属性的 。 var obj = {} console.log(obj.prototype) // undefined 2.函数中是没有__proto__属性的。 var obj2 = function(){}
阅读全文
摘要:垃圾回收机制 1.js中的内存回收 在js中,垃圾回收器每隔一段时间就会找出那些不再使用的数据,并释放其所占用的内存空间。 以全局变量和局部变量来说,函数中的局部变量在函数执行结束后这些变量已经不再被需要,所以垃圾回收器会识别并释放它们。 而对于全局变量,垃圾回收器很难判断这些变量什么时候才不被需要
阅读全文
摘要:1. 闭包是指有权访问另一个函数作用域中的变量的函数,创建闭包常见方式,就是在一个函数的内部创建另一个函数。 2. 使用闭包主要为了设计私有的方法和变量,闭包的优点是可以避免变量的污染,缺点是闭包会常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。 在js中,函数即闭包,只有函数才会产生作用域
阅读全文
摘要:概念:同源策略是客户端脚本(尤其是Netscape Navigator2.0,其目的是防止某个文档或脚本从多个不同源装载。这里的同源策略指的是: 协议,域名,端口 相同,同源策略是一种安全协议。指一段脚本只能读取来自同一来源的窗口和文档的属性。
阅读全文
摘要:1. 创建ajax对象var xhr = new XMLHttpRequest(); 2.告诉Ajax对象要向哪发送请求,以什么方式发送 //请求方式 请求地址xhr.open('get', 'http://localhost:3000/data.json'); 3. 发送请求xhr.send();
阅读全文
摘要:document.write只能重绘整个页面,innerHTML可以重绘页面的一部分。 1. ducument.write使用举例html文档: <!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/h
阅读全文
摘要:1., JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。(为了和其他语言进行交互)2. 数据格式简单, 易于读写, 占用带宽小{'age':'12', 'name':'back'}
阅读全文
摘要:new操作符的作用如下: 1.创建一个空对象2.由this变量引用该对象3.该对象继承该函数的原型4.把属性和方法加入到this引用的对象中5.新创建的对象由this引用,最后隐式地返回this。过程如下: var fn = function () { }; var fnObj = new fn()
阅读全文

浙公网安备 33010602011771号