
前端知识
Alive_tree
实事求是,不争论,发展是硬道理,摸着石头过河,韬光养晦与有所作为。
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Array.some()方法
some()方法用于检测数组中的元素是否满足指定的条件(函数提供)some()方法会依次执行数组中的每一个元素如果有一个元素满足条件、则表达式返回true,剩余的元素不会再进行检测如果没有满足条件的元素,则返回false注意:some不会对空数组进行检测,也不会改变原始数组语法array.some(function(currentValue,index,arr),thisValue)例子/* * 是否显示操作栏 * @param { Array } handle原创 2020-12-15 14:43:24 · 765 阅读 · 0 评论 -
图解迭代、遍历、枚举、递归、循环
计算机科学领域有几个概念,乍一听很相似,但实际上差别非常大,它们是:迭代、遍历、枚举、递归、循环。这些概念,对于写码为生的人而言,大部分都应该不陌生。但如果让谁确切地说出它们的含义,恐怕还真没有几个能够全都说对的。时间关系,本文就简单地对这些概念做一番梳理,供大家参考。1. 迭代(iteration)迭代,是一个重复的过程,目的是为了输出一系列值(可能是无穷序列)。每次重复的过程也叫一次“迭代”,一次迭代的结果,可以作为下一次迭代的起点。2.遍历遍历,一般是指树形数据结构的操作,比如树遍历,也转载 2020-10-27 09:38:30 · 3588 阅读 · 0 评论 -
vue用clipboard实现复制按钮
1、使用情景如图我要在table里面加一个能够实现复制列表项内容的按钮,这时候首先想到了clipboard插件。2、下载npm install clipboard --save3、使用1、引用在当前页面引入下载的clicpboard插件 import Clipboard from 'clipboard';2、html代码<el-table-column label="secretKey" > <template slot-scope="{ro原创 2020-08-14 10:32:48 · 582 阅读 · 0 评论 -
Vue+element使用@keyup.enter不起作用
今天在写登录功能的时候,在用Vue的@key.enter的时候由于使用elementUI组件,@keyup.enter不起作用,经排查,发现需要这样@keyup.enter.native=“login”代码<el-form ref="loginForm" :model="loginForm" :rules="myRules" @keyup.enter.native="login"> <el-form-item prop="account">原创 2020-08-14 09:58:02 · 2956 阅读 · 0 评论 -
解决Vuex页面刷新数据消失的问题
vuex可以进行全局的状态管理,但刷新后的数据会消失,每次还要手动存在本地缓存里很不方便,这不是我们想要的效果,怎么解决呢,我们可以结合本地存储做到数据持久化,也可以通过插件Vuex-presistedstate。方法一 利用H5的本地存储vuex的state在localStorage或者sessionStorage或者其他存储方式中取值,在mutations,定义的方法中对Vuex的状态操作的同时也对存储也做相应的操作示例代码store/index.jsimport Vue from 'vue'原创 2020-08-11 14:35:24 · 1273 阅读 · 0 评论 -
ES6核心特性
前言ES6 虽提供了许多新特性,但我们实际工作中用到频率较高并不多,根据二八法则,我们应该用百分之八十的精力和时间,好好专研这百分之二十核心特性,将会收到事半功倍的奇效!写文章不容易,请大家多多支持与关注!开发环境配置这部分着重介绍:babel 编译ES6语法,如何用webpack实现模块化。1.babel为啥需要babel?ES6 提供了许多新特性,但并不是所有的浏览器都能够完美支持。下图是各个浏览器对ES6兼容性一览表(以export为例)由上图可知,有些浏览器对于ES6并不是很友好,转载 2020-08-06 10:22:34 · 320 阅读 · 0 评论 -
什么是“”中“”后台
揭秘“中台”中台的定义“中台”是企业级的逻辑概念(技术架构),为业务提供公共服务的聚合全流程平台,实现数据复用,提高服务可用性和业务的响应能力。中台作用易用性:数据共用,复用,多用扩展性:避免重复造轮子、缩短研发周期(最主要目的)独立性:模块化服务->积木化服务->不同流程对应不同功能需要拆分 构建就叫积木化服务企业如何落地思维转变、沟通提效采用云平台、专注于业务层、数据服务层量力而行、水到渠成对于前端怎么办了解行业前景,前几年一直很火的移动端APP、微信小程序原创 2020-08-05 11:16:28 · 6144 阅读 · 0 评论 -
npm run dev 的时候报错 code ELIFECYCLE
在执行npm run dev 的时候命令行报错 code ELIFECYCLE然后百度了一下说没有node modules的原因,才发现执行npm run dev之前没有执行npm install操作,所以使用命令行进入到项目文件中,执行npm install重新拉取即可。...原创 2020-02-12 14:53:49 · 1108 阅读 · 2 评论 -
执行 npm install的时候报错 :code ENOENT
下载云端的代码在本地执行的时候,输入npm install 报错npm ERR! path D:\ShopApp\node_modules\fsevents\node_modules\abbrevnpm ERR! code ENOENTnpm ERR! errno -4058npm ERR! syscall accessnpm ERR! enoent ENOENT: no such f...原创 2020-02-12 14:46:43 · 7582 阅读 · 1 评论 -
Windows环境下安装Ruby教程
安装背景:SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。SASS是Ruby语言写的,但是两者的语法没有关系。不懂Ruby,照样使用。只是必须先安装Ruby,然后再安装SASS。然后我就安装了Ruby过程如下:首先打开Ruby的下载地址https://rubyinstaller.org/downloads/如果您不知道要安装...原创 2019-11-13 10:02:24 · 8910 阅读 · 9 评论 -
VS code 设置多行注释快捷键
刚开始使用 VS code 很多快捷键都不太适应,想着自己自定义编辑器的快捷键,于是就写了这个。以多行注释为例,多行注释又成为块注释我们想要修改自己的多行注释的快捷键的时候要先找到 步骤1、 点击文件 -->首选项–> 键盘快捷方式2、 在搜索框中输入comment3、 选中要更改的快捷键名字,比如我今天更改的是多行注释,点击切换块注释行右键–>更改键绑定–>...原创 2019-11-06 19:12:22 · 47385 阅读 · 2 评论 -
暂停性死区理解
暂时性死区只要块级作用域存在let命令,它所声明的变量就“绑定这个区域”,不受外部影响,var temp = 123; if(true){ console.log(temp); let temp; }在代码块内,使用let声明变量之前,该变量都是不可用的,在语法上称为暂时性死区。实例:注:ES6规定暂时性死区和let const语句不出现变量提升,主要...原创 2019-10-11 11:25:07 · 525 阅读 · 0 评论 -
浏览器的组成和运行机制
浏览器的组成浏览器由7部分组成,分别是:用户界面:包括浏览器中可见的地址输入框,浏览器前进和返回按钮,打开书签,打开历史记录等网络:网络功能模块则是浏览器开启网络线程发送请求或下载资源文件的模块,例如dom树解析过程中请求静态资源,首先是浏览器中的网络模块发起的浏览器引擎:浏览器可以在用户界面和渲染引擎之间传送指令或在客户端本地缓存中读写数据等,是浏览器各部分之间交互通信的核心渲染引擎:...原创 2019-09-30 11:41:06 · 655 阅读 · 0 评论 -
闭包
闭包是指有权访问另一个函数作用域中的变量的函数。创建闭包的常见方式,就是在一个函数内部创建另一个函数。有关如何创建作用域链以及作用域链有什么作用的细节,对彻底理解闭包至关重要。当某个函数被调用时,会创建一个执行环境以及响应的作用域链,然后使用argument 和其他命名参数的值来初始化函数的活动对象,但在作用域链中,外部的函数的活动对象始终处于第二位,外部函数的外部函数的活动对象处于第三位…...原创 2019-09-19 15:42:18 · 264 阅读 · 0 评论 -
输入npm install 之后都干了啥
npm是Node的模块管理工具正因为有了npm我们只要执行一行命令,就可以安装别人写好的模块npm install1、 从npm install说起Npm install 命令用来安装模块到node_module目录中在安装之前,npm install会先检查,node_module目录之中是不是已经存在指定的模块,如果存在,就不再进行安装,即使远程仓库已经有了新版本,也是如此如果你...原创 2019-09-19 10:52:04 · 8786 阅读 · 0 评论 -
layui文件上传按钮不起作用(动态添加的元素)
背景:一个下拉框选择不同的下拉框展示不同的页面不同的页面都有文件上传按钮选择展示不同的页面,页面的文件上传按钮不起作用查资料:动态添加的元素没有办法渲染layui.upload.render();分析:1、页面在选择前,JS里的layui.upload.render()已经执行了2、layui.upload.render()执行但是并找不到#file_choose元素,因为页面还...原创 2019-09-11 16:57:30 · 11061 阅读 · 2 评论 -
JS把时间戳转换为日期格式
新的项目,后台不进行时间戳处理,就有两个问题1、 前端页面也不可以直接把时间戳渲染成日期格式的 所以就需要转换一下2、 用的Echarts 时间作为横坐标也不可以转换成用户能看懂的日期格式因此需要转一下1、 列表框内时间戳转换为日期格式<td>{{x.alarmTime | date:'yyyy-MM-dd HH:mm:ss'}}</td>这个是如果是日期格式就...原创 2019-09-11 11:52:25 · 2213 阅读 · 0 评论 -
前端学习周记
像礼花在黑暗的空中绽放,落下夏天和它的盛事隐没了风一天天送来更深远的凉意夏天好像要过去了,这周在前端的学习仍然是查漏补缺,主要包括一下方面1、继承让子类拥有父类的属性或者方法原型链继承经典继承组合继承原型式继承寄生式继承2、变量在内存中的存储方式基本类型变量在栈内存中,先进后出引用类型变量存储在堆中,无序存储,按引用值或获取3、程序的编译过程程序的编译过程就是将用...原创 2019-08-06 09:32:58 · 3872 阅读 · 0 评论 -
2019前端展望
千锋小编认为过去的5年是前端工程化快速发展的过程,前端生产力得到了极大的发展,框架和工程化工具层出不穷。而近两年前端的发展日益减缓,甚至在大家看来,现阶段前端的发展只是在原有格局的基础上小范围进行升级。前端未来的发展方向究竟是怎样的?前端将逐渐侵占client端的市场,web或许会借助于sw演变成c/s架构:这里不是指weex、rn之类,而是藉由serviceworker、小程序等带来的cli...转载 2018-12-22 11:06:47 · 773 阅读 · 0 评论 -
http头部信息详解
每个http请求和响应都会带有相应的头部信息,其中有的对我们有用有的没用,其中xhr也提供操作请求头部和响应头部信息的方法。’Accept 浏览器能够处理的内容类型Accept-Charset:浏览器能显示的字体类型Accept-Encoding:浏览器能够处理的压缩编码Accept-Language:浏览器当前设置的语言Connection:浏览器与服务器之间的链接类型Cookie:...原创 2019-01-17 10:25:04 · 1860 阅读 · 0 评论 -
http与https区别详解
http与https的传输区别 超文本传输协议HTTP协议被用于在Web浏览器和网站服务器之间传递信息,HTTP协议以明文方式发送内容,不提供任何方式的数据加密,如果攻击者截取了Web浏览器和网站服务器之间的传输报文,就可以直接读懂其中的信息,因此,HTTP协议不适合传输一些敏感信息,比如:信用卡号、密码等支付信息。 为了解决HTTP协议的这一缺陷,需要使用另一种协议:安全套接字层超文本传输...翻译 2019-01-17 10:33:10 · 256 阅读 · 0 评论 -
十分钟理解透http常见面试题
1、简述什么是http请求http是计算网络通信的规则http是一种无状态的协议2、简述http请求的7个步骤1、 建立TCP连接2、 Web浏览器发送请命令3、 Web浏览器发送请求头信息4、 Web服务器应答,(应答第一部分是协议的版本号和应答状态码)5、 Web服务器向浏览器发送应答头信息(发送被请求的文档和自己的数据)6、 Web服务器向浏览器发送数据(发送头信息后,会发...原创 2019-01-18 08:49:47 · 1463 阅读 · 0 评论 -
Ajax学习小结
ajax是Asynchronous JavaScript xml 的缩写。Ajax是无需刷新页面就能从服务器获取数据的一种方法,(也就是不点击顶部的刷新按钮而进行局部页面的重绘)负责Ajax运作的核心对象是XMLHttpRequest对象XHR对象是由微软最早在IE5中引入,用于通过javascript从服务器获取XML数据同源策略是对xml的一个主要约束,它为通信设置了“相同的域...原创 2019-01-14 09:30:08 · 310 阅读 · 2 评论 -
XHR对象详解
XHR是指XMLHttpRequest对象的缩写。是通过自己创建的用来承接ajax请求服务器返回数据的一个对象。IE5是第一款引入XHR对象的浏览器,在IE5中XHR对象是通过MSXML库中的一个ActiveX对象实现的。 在理解xhr的用法的时候,我们可以参照xhr的原生写法这样更好理解,下面是AJAX请求的原生写法: var xhr = new XMLHt...原创 2019-01-14 15:15:52 · 3180 阅读 · 0 评论 -
Angular中的事件指令ng-mouseenter 和 ng-mouseleave
Angular中的事件指令ng-mouseenter 和 ng-mouseleave指令 是我们用来扩展浏览器能力的技术之一,在DOM编译期间和HTML关联着的指令会被检测到,这就是指令指定改变DOM或者指定DOM行为的基础。AngularJS中有一套完整的,可扩展的,用来帮助web应用开发的指令集,它使得HTML可以成为 “特定领域语言(DSL)”, 增加了额外的标签或者属性来实现了更加强大...原创 2019-02-18 11:22:22 · 3706 阅读 · 0 评论 -
用layui上传图标
今天写了一个上传用户图标的功能,可以预展示选择要上传的图标,给导入前增加了函数处理,很好玩。把代码分享一下,其实很简单。功能如下图代码如下:Html代码<div style="margin-top: 20px;" > <label class="layui-form-label">产品图标:</label> <div...原创 2019-02-18 14:46:07 · 1140 阅读 · 0 评论 -
用运算符!!与&&用法
最近看一大佬的插件代码,虐的本渣泪两行,原来日常简单的运算符也有四两拨千斤的作用,今天就讲讲我看到的这两个运算符!一、首先看看逻辑非运算符!!!运算符可以将变量取反转换成boolean型,像0、undefined这种名义上为否的变量取反都为true,其余的用!为false !0 = true; !undefined = true; !'' = true; ...原创 2019-02-23 15:17:24 · 5213 阅读 · 2 评论 -
基于Ws的WebSocket通信实例解析
WebSocket的目标是在一个单独的持久链接上提供全双工、双向通信。在JS建立webSocket之后,会有一个http发送到浏览器以发起链接,在取得服务器响应后,建立的连接会使用http升级从http协议交换为WebSocket协议,也就是说,使用标准的Http协议无法实现WebSockts,只有支持这种协议的专门服务器才能正常工作。WebSockets使用了自定义的协议,所以URL的模式也略...原创 2019-02-25 17:21:29 · 3030 阅读 · 0 评论 -
Try-catch语句解析
Try-catch语句解析1、try-catch基本语句任何具有影响力的web应用程序都具有一套特殊的错误处理程序,我们把可能会抛出错误的代码都放在try语句中,而把哪些用于错误除了的代码放在catch代码块中作为JavaScript中处理异常的一种标准方式,基本的语法如下,与java中的语法完全相同try{ //可能会导致错误的代码 }catch(error){...原创 2019-02-27 08:49:51 · 1140 阅读 · 0 评论 -
JS生成GUID方法
全局唯一标识(GUID)是一种由算法生成的二进制长度为128位的数字标识符,GUID主要用于拥有多个节点,多台计算机的网络或系统中。在理想情况下任何计算几何计算机群都不会生成两个相同的GUID,GUID的总数为2^128个,理论上是很难会两个相同。GUID 的格式为“xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx”,其中每个 x 是 0-9 或 a-f 范围内的一个十六进...原创 2019-02-27 08:50:15 · 16136 阅读 · 0 评论 -
js通过a标签下载文件
最近在写文件下载,发现前端实现下载功能是依赖于浏览器特性,而非JS特性。1、在页面直接点击某个元素,然后另存为,弹出下载提示框2、直接输入网址,确定,弹出下载提示框3、点击页面的链接(a标签),弹出下载提示框4、点击下载按钮,实现文件下载H5给a标签新增了download,利用这个属性可以便捷的实现 下载已有的文件功能,而不需要任何插件 <div> <a h...原创 2019-05-30 09:42:28 · 8679 阅读 · 0 评论 -
webstorm提示String templates are not supported by current....
最近在写node的时候,随手用了前端常用的编辑器webstorm,但是在编码过程中,编辑页面出现了大量的红线,很影响美观。鼠标浮在红线上,信息提示:String templates are not supported by current javaScript version经过查询相关资料发现是因为我的webstrom中的js版本太低,接下来就要更改webstorm中的Javascript的...原创 2019-06-21 15:43:48 · 761 阅读 · 0 评论 -
2018前端值得关注的几个趋势
1.前言2017悄然过去,2018已经来到。人在进步,技术在发展。2018年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。下面就我个人的判断进行一个预测判断,希望能对大家起到一个参考作用!下面提及的技术,只是建议大家关注,也不是建议大家全部的都要学,而是建议大家按需学,自己觉得哪些需要学,对哪些有兴趣就学哪些!如果大家有什么工具,框架,库觉得可以推荐的,欢迎在评论区提点,让大家相...转载 2018-12-21 14:27:56 · 263 阅读 · 0 评论