关注
分享
前端系列
Zero Ice
编辑&代码艺术
展开
-
时间戳 格式化 -> Invalid Date
原始代码console.log(new Date(value.datetime))转换失败!!!问题解析：中文问题，导致转换失败测试console.log(typeof value.datetime)console.log(new Date(value.datetime))修复+封装function Utils() { }const forma...原创 2020-04-06 14:20:36 · 3316 阅读 · 0 评论 -
new Promise 真实用法
function getImageInfo(src) { return new Promise((resolve, reject) => { wx.getImageInfo({ src, success(res) { const height = res.height * 750 / res.width resolve({...原创 2020-04-06 14:21:06 · 3906 阅读 · 2 评论 -
Vue | 插槽
原创 2019-02-28 21:07:27 · 92 阅读 · 0 评论 -
Vue | 大坑！！！缓存
今天本来想练习一下slot的（用的是模块化引进组件）结果一上来，写完就报错！！然后解决了。但是还是报错！然后我新建了一个文件！结果还是报错，两个文件都是一样的了！！！然后怎样能解决？当然是缓存问题呀！！！delete一下缓存~成功解决原来是Vue有一个缓存机制！！！...原创 2019-02-28 21:01:52 · 1747 阅读 · 0 评论 -
Vue | $root、$parent、$refs
Vue 子组件可以通过 $root 属性访问父组件实例的属性和方法<div id="app"> <root-obj></root-obj></div><script>Vue.component('root-obj', { data() { return { } }, ...原创 2019-02-28 00:02:50 · 617 阅读 · 0 评论 -
Vue | $root
还得注意的就是：先调用子组件里面的created再…原创 2019-02-27 23:58:52 · 425 阅读 · 0 评论 -
Vue | 传参数
// 项目结构├── index.html├── main-view.js //父组件├── desc-view.js //子组件└── app.jsindex.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta na原创 2019-02-27 23:10:19 · 207 阅读 · 0 评论 -
Vue| 父组件里面使用一个子组件
// 项目结构├── index.html├── main-view.js //父组件├── desc-view.js //子组件└── app.jsindex.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta na原创 2019-02-27 19:07:40 · 468 阅读 · 0 评论 -
Vue | 简单模块化
// 项目结构├── index.html├── button-success.js└── app.jsindex.html&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&原创 2019-02-27 17:42:36 · 271 阅读 · 0 评论 -
Express | 前后端连载
安装concurrentlycnpm install concurrently./client/package.jsonpackage.json最后npm run dev原创 2019-03-06 00:22:52 · 158 阅读 · 0 评论 -
node | 大端模式和小端模式
大端模式（Big-endian）高位字节排放在内存的低地址端，低位字节排放在内存的高地址端，即正序排列，高尾端；小端模式（Little-endian）低位字节排放在内存的低地址端，高位字节排放在内存的高地址端，即逆序排列，低尾端；例（无论是小端模式还是大端模式。每个字节内部都是按顺序排列）我们常用的X86结构是小端模式，而KEIL C51则为大端模式。很多的ARM，DSP都为小端模式...原创 2019-07-14 15:47:07 · 1297 阅读 · 0 评论 -
Node | 区别Event Loop
Node.js的Event LoopNode.js也是单线程的Event Loop，但是它的运行机制不同于浏览器环境Node 运行机制：V8引擎解析JavaScript脚本。解析后的代码，调用Node API。libuv库负责Node API的执行。它将不同的任务分配给不同的线程，形成一个EventLoop（事件循环），以异步的方式将任务的执行结果返回给V8引擎。V8引擎再将结果返...原创 2019-03-14 21:43:00 · 122 阅读 · 0 评论 -
Js | Gulp Error: watching app/scss/**/*.scss: watch task has to be a function问题
学习Gulp网站：https://w3ctrain.com/2015/12/22/gulp-for-beginners/?utm_source=tuicool&utm_medium=referralgulpfile.jsvar gulp =require("gulp");var sass = require("gulp-sass");gulp.task('sass',()=>...原创 2019-02-10 02:43:40 · 991 阅读 · 0 评论 -
Vue | 简版购物车
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2019-02-27 14:29:41 · 83 阅读 · 0 评论 -
Vue | 开发版本与生产版本的区别
原创 2019-02-27 12:43:42 · 2374 阅读 · 0 评论 -
jQuery | 效果
关键字用法语法show()显示$(selector).hide(speed,callback);hide()隐藏$(selector).show(speed,callback);toggle()显示/隐藏来回切换$(selector).toggle(speed,callback);注意：speed:“slow”、“fast” 或毫秒hide()...原创 2019-02-23 00:38:10 · 121 阅读 · 0 评论 -
前端 | 网站性能优化
对于网站的性能，在行业内有很多既定的指标，但就以前端 er 而言，我们应该更加关注以下指标：白屏时间首屏时间整页时间DNS 时间CPU 占用率一、网络传输性能优化解浏览器处理用户请求的过程这是 navigation timing 监测指标图，从图中我们可以看出，浏览器在得到用户请求之后，经历了下面这些阶段：重定向→拉取缓存→ DNS 查询→建立 TCP 链接→发起请求→接收...转载 2020-05-03 17:12:14 · 365 阅读 · 0 评论 -
jQuery | HTML结合
获得内容关键字描述text()设置或返回所选元素的文本内容html()设置或返回所选元素的内容（包括 HTML 标记）val()设置或返回表单字段的值获取属性attr() 方法用于获取属性值设置内容$("#btn1").click(function(){ $("#test1").text("Hello world!");});$("#bt...原创 2019-02-23 01:07:40 · 134 阅读 · 0 评论 -
jQuery | 遍历
标签一子标签一子子标签一子子标签二子子子标签一一子子子标签一二子子子标签二一向上遍历 DOM 树parent() 返回被选元素的直接父元素parents() 返回被选元素的所有祖先元素，它一路向上直到文档的根元素 ()parentsUntil() 返回介于两个给定元素之间的所有祖先元素向下遍历 DOM 树children() 返回被选元素的所有直接子元素 存在参数（返回类名为 “...原创 2019-02-23 01:29:39 · 89 阅读 · 0 评论 -
Sass | 语法
可从官网了解：http://sass-lang.com/documentation/file.SASS_REFERENCE.html目录结构：test.scss//变量$blue : #bdc4fd;div { coloe: $blue;}//变量(镶嵌在字符串之中)$side : left;.router { border-#{$side}-radius: 10p...原创 2019-02-11 02:56:21 · 166 阅读 · 0 评论 -
sass | Learning Sass
SASS用法指南原创 2019-02-11 02:06:51 · 109 阅读 · 0 评论 -
Less | Less（Brower版本）
先直接给出源代码index.html&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport&原创 2019-02-15 04:02:20 · 318 阅读 · 0 评论 -
Less | 学习Less(npm版本)
Install Lesscnpm install less -g查看版本(可能还没有假如环境变量，手动加入吧!!!)lessc -vindex.less//变量@nice-blue: rgba(22, 110, 197, 0.2);@light-blue: #c2f2f8;.header { background: @light-blue;}// 混合...原创 2019-02-15 03:42:51 · 1961 阅读 · 0 评论 -
jQuery | Ajax
load() 方法从服务器加载数据，并把返回的数据放入被选元素中index.txt<h1>我是帥哥,你已成功使用Ajax</h1>index.html<script> $(document).ready(function () { $('button').click(()=>{ $('p').load(...原创 2019-02-23 02:38:30 · 167 阅读 · 0 评论 -
Vue | 简单实现Ajax请求
&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content=&原创 2019-02-23 03:07:38 · 1473 阅读 · 0 评论 -
CSS | 重置CSS
重置样式表的目标是减少浏览器在默认行高，边距和标题字体大小等方面的不一致性。重置样式经常出现在CSS框架中，原始的“meyerweb reset”进入Blueprint等等。这里给出的重置样式有意非常通用。body例如，没有为元素设置任何默认颜色或背景。我不特别建议您在自己的项目中以不变的状态使用它。应对其进行调整，编辑，扩展和调整以匹配您的特定重置基线。填写页面，链接等的首选颜色。换句话说，...原创 2019-03-06 00:45:39 · 340 阅读 · 0 评论 -
Js | this关键词
this全局Js | 立即执行函数function(){}()改变this指向Function.prototype.call()Function.prototype.apply()Function.prototype.bind()原创 2019-02-11 01:24:38 · 135 阅读 · 0 评论 -
Js | 原型链
先插播一段代码：怎样去判断是数组？ // 判断数组 let num = [] console.log(typeof num); //Object typeof 无法判断数组 console.log(num instanceof Array); //trueinstanceof// 创建对象的方式主要有以下几种： // 第一...原创 2019-03-01 18:56:40 · 106 阅读 · 0 评论 -
外部样式 & 外部脚本->加载&阻塞
webkit &amp; Gecko就Webkit 和 Gecko 来讲，主要的渲染流程大体一样测试结果：外部样式会阻塞后续脚本执行，直到外部样式加载并解析完毕&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt;原创 2019-03-02 17:03:35 · 700 阅读 · 0 评论 -
HTML5 | Performance
为了得到脚本运行的准确耗时，需要一个高精度时间戳。传统的做法是使用Date对象的getTime方法var start = new Date().getTime();// doSomething()var now = new Date().getTime();var latency = now - start;console.log("任务运行时间：" + latency);传统的缺点...原创 2019-03-02 18:55:38 · 555 阅读 · 0 评论 -
Js | Event Loop
什么是单线程？同一个时间只能做一件事。为什么不能为多线程？假定JavaScript同时有两个线程，一个线程在某个DOM节点上添加内容，另一个线程删除了这个节点，这时浏览器应该以哪个线程为准？存在多线程为了利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JavaScript脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM。所以，这个新标准并没有改变Jav...原创 2019-03-14 20:28:15 · 90 阅读 · 0 评论 -
Js | Event Loop 宏任务&微任务
js任务共分为两种：宏任务(macro-task)和微任务(micro-task)宏任务：包括整体代码script，setTimeout，setInterval微任务：Promise.then(非new Promise)，process.nextTick(node中)事件的执行顺序，是先执行宏任务，然后执行微任务，这个是基础，任务可以有同步任务和异步任务。同步的进入主线程，异步的进入E...原创 2019-03-14 21:06:58 · 415 阅读 · 0 评论 -
Js | null & undefined
var cons = { '0 == false':0==false, '1 == true ':1==true, '"" == false':""==false, 'false == null':false == null, 'null == undefined' : null == undefined, 'false ==...原创 2019-03-17 23:36:54 · 153 阅读 · 0 评论 -
Js | 隐含着的类型转换
var x = new Boolean(false); console.log(x); if(x){ console.log('x : true'); } // 对象类型 var x1 = new Array(); var x2 = new String(); var x3 = new Number(); // 存在一个...原创 2019-03-17 23:51:52 · 106 阅读 · 0 评论 -
Nodejs | 修改Gulp版本号
由于gulp 3.0版本跟gulp4.0版本运行方式存在很大的区别！！！例子请看文章：https://blog.csdn.net/weixin_41593408/article/details/86860079查看本机版本：下载或修改本地的Gulp版本为3.9.1：因此解决这个问题的另外一种办法是：方法二：修改版本：将4.0.0版本修改为3.9.1版本成功解决...原创 2019-02-10 03:34:46 · 1733 阅读 · 0 评论 -
Js | 此时不能使用箭头函数
1、定义字面量方法const calculator = { array: [1, 2, 3], sum: () => { console.log(this === window); // => true return this.array.reduce((result, item) => result + item); }...原创 2019-02-09 23:23:58 · 934 阅读 · 1 评论 -
Js | 面向对象（一）
构造函数构造函数就是一个普通的函数，但是有自己的特征和用法（构造函数名字的第一个字母通常大写）特点函数体内部使用了this关键字，代表了所要生成的对象实例。生成对象的时候，必须使用new命令。new命令new命令的作用，就是执行构造函数构造函数可以带括号，也可以不带括号1、对象名于成员名相同的情况var Name = function () { this.name =...原创 2019-02-09 23:07:01 · 124 阅读 · 0 评论 -
js | new Error()
new error()const x = Error('I was created using a function call!');console.log(x);const y = new Error('I was constructed via the "new" keyword!');console.log(y);原创 2019-02-08 00:21:26 · 24004 阅读 · 0 评论 -
Js | ES6 模板字符串
//模板字符串 let name = "小陈" console.log('你的名字是:'+name); //注意那个不是双引号,而是键盘上{~}符号的那个键 console.log(`你的名字是:${name}`);...原创 2019-02-08 00:58:11 · 435 阅读 · 0 评论 -
Js | 什么是webpack
为什要使用WebPack现今的很多网页其实可以看做是功能丰富的应用，它们拥有着复杂的JavaScript代码和一大堆依赖包。为了简化开发的复杂度，前端社区涌现出了很多好的实践方法模块化，让我们可以把复杂的程序细化为小的文件;类似于TypeScript这种在JavaScript基础上拓展的开发语言：使我们能够实现目前版本的JavaScript不能直接使用的特性，并且之后还能转换为Jav...原创 2019-02-08 14:17:54 · 181 阅读 · 0 评论