田品吕口-方-CSDN博客

原创 Vue 3.0 新特性体验

1、vue简介Vue是一个“用于构建用户应用程序的渐进式框架”。它的设计非常灵活，能够将各个Vue库合并到其他项目中，或者完全使用Vue为复杂项目提供动力。Vue通常被视为更易于理解和易于实现的框架之一。允许支持纯HTML模板，而像React这样的工具使用Javascript定义DOM元素。2、 Vue 3.0中最大的变化（1）Performance：性能更比Vue 2.0强。（2）Tree shaking support：可以将无用模块“剪辑”，仅打包需要的。（3）Composition

2020-06-24 14:16:16 673

原创 vue监听浏览器返回

1、监听返回大家知道在页面中我们可以使用javascript window history，后退到前面页面，但是由于安全原因javascript不允许修改history里已有的url链接，但可以使用pushState方法往history里增加url链接，并且提供popstate事件监测从history栈里弹出url。既然有提供popstate事件监测，那么我们就可以进行监听。```javas...

2019-10-15 15:37:19 3597

原创基于vue的UI框架集锦(移动端+pc端)

本文链接：https://blog.csdn.net/MrLiber/article/details/865916591.Element 饿了么 vue 2.0后台UI框架https://github.com/ElemeFE/element2.iview组件库iView 主要服务于 PC 界面的中后台业务，很优秀的组件库，可惜不适合移动端https://github.com/iview/...

2019-09-13 10:25:32 1702

原创浏览器缓存机制

一、概念：浏览器缓存就是把一个已经请求过的Web资源（如html页面，图片，js，数据等）拷贝一份副本储存在浏览器中。缓存会根据进来的请求保存输出内容的副本。当下一个请求来到的时候，如果是相同的URL，缓存会根据缓存机制决定是直接使用副本响应访问请求，还是向源服务器再次发送请求。二、目的：（1）减少网络带宽消耗当Web缓存副本被使用时，只会产生极小的网络流量，可以有效的降低运营成本。...

2018-11-02 15:10:53 225

原创 vue父子组件之间的通信

1.父组件向子组件传递数据父组件是通过props属性给子组件通信，Prop 是你可以在组件上注册的一些自定义特性。当一个值传递给一个 prop 特性的时候，它就变成了那个组件实例的一个属性。父组件：<parent> <child :child-com="content"></child> //注意这里用驼峰写法哦</parent>...

2018-10-29 10:58:04 210

转载 web前后端分离

(一) 前后端分离的目的和作用做Web开发也可以说是B/S架构开发，B端和S端从技术体系角度而言异构性很大，换而言之就是B端使用的技术和S端使用的技术不适于同一个体系，这样的结果导致实际开发中，很难做到专业分工，如果项目开发过程中管控不到位，这样的问题可能会影响到整个项目的开发质量，因此前后端分离的目的之一就是要做到专业化分工，提高项目的质量和开发效率。随着技术的发展，当下的Web开发形势已经...

2018-10-27 14:28:56 537

转载移动前端开发与web前端开发

基础准备首先我们要有HTML/HTML5、CSS/CSS3基础知识（会简单的切图就可以了），如果能懂点JS那就更好啦。其次我们要清楚一些基本概念，不然出去吹牛逼听不懂别人说的东西或者自己说出来是非常明显的错误就很尴尬啦，为了能自信满满的吹水，我们来了解下面几个基本概念吧。移动端网页开发在移动端表现良好的页面，如新浪网，腾讯新闻网，手机凤凰这些网站页面在移动端也有不错的表现。移动端web...

2018-10-24 17:53:51 554

转载常见HTTP状态码

对网站管理工作者来说有个词不陌生，HTTP状态码，它是用以表示网页服务器HTTP响应状态的3位数字代码。状态码的第一个数字代表了响应的五种状态之一。1XX系列：指定客户端应相应的某些动作，代表请求已被接受，需要继续处理。由于 HTTP/1.0 协议中没有定义任何 1xx 状态码，所以除非在某些试验条件下，服务器禁止向此类客户端发送 1xx 响应。2XX系列：代表请求已成功被服务器接收、理解、并...

2018-10-20 15:39:33 237

转载 Promise 的基础用法

在JavaScript的世界中，所有代码都是单线程执行的。由于这个“缺陷”，导致JavaScript的所有网络操作，浏览器事件，都必须是异步执行。异步执行可以用回调函数实现：function callback() { console.log('Done');}console.log('before setTimeout()');setTimeout(callback, 1000)...

2018-10-20 15:24:20 255

转载 W3C标准及规范

转载：https://blog.csdn.net/Hhy_9288/article/details/78602277概念：W3C标准中文名：万维网联盟，外文名：World Wide Web Consortium万维网联盟标准不是某一个标准，而是一些列标准的集合。网页主要有三部分组成：结构（Structure）、表现（Presentation）、行为（Behavior）。对应的标准也有三方面...

2018-10-17 17:41:19 211

转载 webpack打包工具理解

参考文献引用路径：https://www.webpackjs.com/concepts/概念本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。可...

2018-10-17 17:16:48 672

原创 Javascript原生插件开发

插件需要满足的条件一个可复用的插件需要满足以下条件：1）插件自身的作用域与用户当前的作用域相互独立，也就是插件内部的私有变量不能影响使用者的环境变量；2）插件需具备默认设置参数；3）插件除了具备已实现的基本功能外，需提供部分API，使用者可以通过该API修改插件功能的默认参数，从而实现用户自定义插件效果；4）插件需提供监听入口，及针对指定元素进行监听，使得该元素与插件响应达到插件效果；...

2018-10-16 17:25:14 272

原创 Javacript自定义事件

1、基本原理：事件队列，即将监听程序存到一个数组中，再自定函数执行时，将添加监听数组中每个函数执行一遍。定义一个对象专门用于存储自定义事件，定义一个方法用于注册监听，还有一个方法需要我们主动触发这个注册的监听程序，以及监听的注销。2、观察者模式事件是JavaScript和浏览器交互的主要途径。事件是一种叫做观察者的设计模式，这是一种创建松散耦合代码的技术。观察者模式：由两类对象组成，主体...

2018-10-16 15:51:10 134

原创 JS事件循环机制（event loop）

一前言相信所有学过 JavaScript 都知道它是一门单线程的语言，这也就意味着 JS 无法进行多线程编程，但是 JS 当中却有着无处不在的异步概念。在初期许多人会把异步理解成类似多线程的编程模式，其实他们中有着很大的差别，要完全理解异步，就需要了解 JS 的运行核心——事件循环（event loop）。二 JS引擎的两大特点：单线程和非阻塞单线程JS引擎是基于单线程(Single-...

2018-10-16 14:56:51 384

原创 JavaScript脚本下载中defer和async的原理

无阻塞下载 JavaScript 脚本的方法：（1）使用script标签的 defer、async 属性、；（2）使用动态创建的script元素来下载并执行代码等异步加载等方法；defer和async是script标签的两个属性，用于在不阻塞页面文档解析的前提下，控制脚本的下载和执行。在介绍他们之前，我们有必要先了解一下页面的加载和渲染过程：浏览器通过HTTP协议请求服务器，获取HMT...

2018-10-16 11:22:18 168

原创浏览器页面加载解析渲染机制

一、为什么要了解浏览器加载、解析、渲染这个过程？了解浏览器如何进行加载，我们可以在引用外部样式文件，外部js时，将他们放到合适的位置，使浏览器以最快的速度将文件加载完毕。了解浏览器如何进行解析，我们可以在构建DOM结构，组织css选择器时，选择最优的写法，提高浏览器的解析速率。了解浏览器如何进行渲染，明白渲染的过程，我们在设置元素属性，编写js文件时，可以减少”重绘“”重新布局“的消耗。这...

2018-10-16 10:57:49 911

转载 Web开发最常见的需要注意的安全问题

不是所有 Web 开发者都有安全的概念，甚至可能某些安全漏洞从来都没听说过。这就是这篇科普文章的存在意义，希望 Web 开发者在开发时能依此逐条检查代码中的安全问题。注：服务器运维相关的安全注意事项不在本文之列这篇文章主要包含以下内容：1）前端安全XSS 漏洞CSRF 漏洞2）后端安全SQL 注入漏洞权限控制漏洞SESSION 与 COOKIEIP 地址验证码前言水桶底...

2018-10-15 17:37:40 358

转载前端常见的浏览器兼容性问题及解决方案

一、常见的浏览器内核：常见的浏览器内核可以分四种：Trident、Gecko、Blink、WebkitIE浏览器： Trident内核，也成为IE内核Chrome浏览器： Webkit内核，现在是Blink内核Firefox浏览器： Gecko内核，俗称Firefox内核Safari浏览器： Webkit内核Opera浏览器：最初是自己的Presto内核，后来加入谷歌大军，从Webk...

2018-10-15 15:28:04 520

转载 vue、react、angular三大框架对比

转载自：https://www.cnblogs.com/wulinzi/p/8351300.html首先，我们先了解什么是MVX框架模式？MVX框架模式：MVC+MVP+MVVM1.MVC：Model(模型)+View(视图)+controller(控制器)，主要是基于分层的目的，让彼此的职责分开。View通过Controller来和Model联系，Controller是View和Mode...

2018-10-15 11:20:04 1528

原创 web性能优化方法

探讨web性能优化方法，一直是前端开发者不懈努力的事情，获得总结的方法也很多，看了几位大牛的总结，特此与大家共同分享一下。前端是庞大的，包括 HTML、 CSS、 Javascript、Image 、Flash等等各种各样的资源。前端优化是复杂的，针对方方面面的资源都有不同的方式。那么，前端优化的目的是什么 ?1）用户角度：优化能够让页面加载得更快、对用户的操作响应得更及时，能够给用户提供更为...

2018-10-15 11:00:38 2389

转载 jQuery的事件委托方法bind 、live、delegate、on之间有什么区别？

(1)、bind 【jQuery 1.3之前】定义和用法：主要用于给选择到的元素上绑定特定事件类型的监听函数；语法：bind(type,[data],function(eventObject))；特点：(1)、适用于页面元素静态绑定。只能给调用它的时候已经存在的元素绑定事件，不能给未来新增的元素绑定事件。(2)、当页面加载完的时候，你才可以进行bind()，所以可能产生效率问题。实例如...

2018-10-15 09:56:56 3023

转载 Jquery中$.get()提交和$.post()提交的区别

两种在客户端和服务器端进行请求-响应的常用方法是：GET 和 POST。GET - 从指定的资源请求数据POST - 向指定的资源提交要处理的数据GET 基本上用于从服务器获得（取回）数据。注释：GET 方法可能返回缓存数据。POST 也可用于从服务器获取数据。不过，POST 方法不会缓存数据，并且常用于连同请求一起发送数据。相同点：都是异步请求的方式来获取服务端的数据；异同点：1、...

2018-10-15 09:53:49 572

原创 Jquery学习总结

一、什么是 jQuery ？jQuery是一个JavaScript函数库。jQuery是一个轻量级的"写的少，做的多"的JavaScript库。jQuery库包含以下功能：HTML 元素选取HTML 元素操作CSS 操作HTML 事件函数JavaScript 特效和动画HTML DOM 遍历和修改AJAXUtilities提示：除此之外，Jquery还提供了大量的插件。...

2018-10-15 09:48:18 102

转载 JavaScript 数组(Array)对象用法

1、Array 对象属性constructor 返回对创建此对象的数组函数的引用。length 设置或返回数组中元素的数目。prototype 使您有能力向对象添加属性和方法。2、Array 对象方法concat() 连接两个或更多的数组，并返回结果。join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。pop() 删除并返回数组的最后一个元素。shift()...

2018-10-15 09:37:27 135

原创 Js闭包理解

要理解闭包，首先必须理解Javascript特殊的变量作用域。变量的作用域分类：全局变量和局部变量。特点：1）函数内部可以读取函数外部的全局变量；在函数外部无法读取函数内的局部变量。2）函数内部声明变量的时候，一定要使用var命令。如果不用的话，你实际上声明了一个全局变量！闭包：1、定义和用法：当一个函数的返回值是另外一个函数，而返回的那个函数如果调用了其父函数内部的其它变量，如果返回...

2018-10-13 17:39:15 72

转载浅谈垃圾回收机制方式及内存管理

回收机制方式1、定义和用法：垃圾回收机制(GC:Garbage Collection),执行环境负责管理代码执行过程中使用的内存。2、原理：垃圾收集器会定期（周期性）找出那些不在继续使用的变量，然后释放其内存。但是这个过程不是实时的，因为其开销比较大，所以垃圾回收器会按照固定的时间间隔周期性的执行。3、实例如下：function fn1() { var obj = {name: '...

2018-10-13 17:32:01 670

原创 Javascript 实现继承的几种方式

面向对象的基本特征有：封装、继承、多态。在JavaScript中实现继承的方法：原型链（prototype chaining）构造继承：call()/apply()混合继承(prototype和call()/apply()结合)对象冒充1、原型链继承核心：将父类的实例作为子类的原型缺点：父类新增原型方法/原型属性，子类都能访问到，父类一变其它的都变了。f...

2018-10-13 17:27:47 118

原创 JavaScript常见问题及解决方法

1.JavaScript中如何检测一个变量是一个String类型？typeof(obj) === "string"typeof obj === "string"obj.constructor === String2.请用js去除字符串空格？方法一：使用replace正则匹配的方法去除所有空格: str = str.replace(/\s*/g,"");去除两头空格: str = s...

2018-10-13 17:18:47 597

原创什么是 Bootstrap？

由于第一个项目开发的框架使用的是Bootstrap，故打算先说一下这个框架。Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。移动设备优先：自 Bootstrap 3 起，框架包含了贯穿于整个库的移动设备优先的样式。浏览器支持：所有的主流浏览器都支持 Bootstrap。容易上手：只要您具备 ...

2018-10-13 17:09:47 1188

原创我的感悟

学习软件编程已久，一直在膜拜大神们的技术交流，品诸子百家之言，获益匪浅，往往遇到难题时，看大神们各抒已见，需求最适合自己的解决之道。自己一直心想写博客，可惜要么是借口太忙，要么是被层出不穷的游戏吸引，无法坚持下来整理自己的所学、所思、所感。经过了三年的web开发，时常收到对开发的技术，产品的思维的碰撞，总有点想法，奈何难以下笔，怕自己无法写出龙飞凤舞的文章，所以一直没有行动。最近项目已至收尾阶...

2018-10-13 16:59:51 106