- 博客(430)
- 收藏
- 关注
RSS订阅转载 简单明了区分escape、encodeURI和encodeURIComponent
一、前言讲这3个方法区别的文章太多了，但是大部分写的都很绕。本文试图从实践角度去讲这3个方法。二、escape和它们不是同一类简单来说，escape是对字符串(string)进行编码(而另外两种是对URL)，作用是让它们在所有电脑上可读。编码之后的效果是%XX或者%uXXXX这种形式。其中ASCII字母、数字、@*/+，这几个字符不会被编码，其余的都会。最关键的是，当你需要对URL编码时，请忘记这个方法，这个方法是针对字符串使用的，不适用于URL。事实上，这个方法我还没有在实际...
2020-05-14 16:17:28
266
转载 细说多页面和单页面模式的区别
本篇文章讲述了多页面和单页面模式的区别，大家对多页面和单页面模式的区别不了解的话，那么我们就一起来看看本篇文章吧， 好了废话少说进入正题吧！单页模式打开方式： 1 justep.shell.showpage(); 多页模式打开方式： 1 window.loacation.href = require.tourl(); 三张图告诉你差别再哪里，大家要是还不太了解的话，可以自己多实现两边就很容易掌握了哦！...
2020-05-14 15:41:47
907
转载 npm安装包时 --save 和 --save-dev 的区别
以npm安装vue为例1.npm installvue:会把vue包安装到node_modules目录中； 不会修改package.json文件； 之后运行npm install命令时，不会自动安装vue；2.npm installvue --save:会把vue包安装到node_modules目录中； 会在package.json文件中的dependencies属性下添加vue； 之后运行npm install命令时，会自动安装vue到node_modules目录中；...
2020-05-14 10:45:27
371
转载 package.json的所有配置项及其用法，你都熟悉么
https://www.cnblogs.com/datiangou/p/10172994.html写在前面在前端开发中，npm已经是必不可少的工具了。使用npm，不可避免的就要和package.json打交道。平时package.json用得挺多，但是没有认真看过官方文档。本文结合npm官方文档以及自己平时使用过程中的感悟，谈一谈package.json。官方文档在这里。初始化使用npm init命令就可以初始化一个package.json文件。在初始化的过程中，会叫用户输入name, ve
2020-05-09 16:50:56
400
转载 前端妹子跟我抱怨她们的页面加载很慢的时候，如何在她面前优雅地装逼？
作者：张皓链接：https://www.zhihu.com/question/27085552/answer/35194131来源：知乎著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。看来题主你的目的是装逼，优雅地装逼，要让妹子觉得你很牛逼对不对？要让妹子听你分析完之后就投怀送抱对不对？首先，想装逼就要显得随性、自然，看一眼就知道问题在哪。如果你需要吭吭哧哧的...
2020-04-26 11:12:55
409
转载 聊聊Chrome DevTools中你可能不知道的调试技巧
作者：zollero链接：https://zhuanlan.zhihu.com/p/42059158来源：知乎著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。对于前端开发者来说，Chrome DevTools 绝对是不可或缺的调试工具，我们常用的调试方法包含一些 console等，而 Chrome DevTools 其实很强大，下面来聊聊一些你可能不知道的 deb...
2020-04-26 10:21:26
985
原创 SASS—混合指令 (Mixin Directives)
混合指令（Mixin）用于定义可重复使用的样式，避免了使用无语意的 class，比如.float-left。混合指令可以包含所有的 CSS 规则，绝大部分 Sass 规则，甚至通过参数功能引入变量，输出多样化的样式。9.1. 定义混合指令@mixin(Defining a Mixin:@mixin)混合指令的用法是在@mixin后添加名称与样式，比如名为large-text...
2020-04-24 16:41:35
1143
1
原创 hook钩子介绍
1.useEffect不带第二个参数 // Similar to componentDidMount and componentDidUpdate: useEffect(() => { // Update the document title using the browser API document.title = `You clicked ${count} ...
2020-04-23 16:15:07
294
转载 浅谈什么是前端SEO
SEO简介全称：Search English Optimization，搜索引擎优化。自从有了搜索引擎，SEO便诞生了。 存在的意义：为了提升网页在搜索引擎自然搜索结果中的收录数量以及排序位置而做的优化行为。简言之，就是希望百度等搜索引擎能多多我们收录精心制作后的网站，并且在别人访问时网站能排在前面。 分类：白帽SEO和黑帽SEO。白帽SEO，起到了改良和规范网站设计的作用，使网站对...
2020-04-07 17:57:47
3525
3
原创 hooks学习笔记—hooks的典型案例
清除 effect通常，组件卸载时需要清除 effect 创建的诸如订阅或计时器 ID 等资源。要实现这一点，useEffect函数需返回一个清除函数。也就是说，要想在组件销毁的时候搞一些事情，需要useEffect 末尾返回一个函数，在这个函数里面可以写具体销毁的内容。看下面的例子，在当前页面里面，页面的标题是'测试title'，当切换到其他页面时，页面的标题变成‘前端精读’im...
2020-04-07 14:31:54
1064
转载 hooks踩坑—React Hook xx is called in function xx which is neither a React function component or ...
这个坑，真的很小很小，就被绊倒了，困扰了好几天，网上也没找到关于这个坑的解决办法。源码是这样的：然后报错信息：问题就出现在函数的取名，函数名首字母要大写 我的函数名是slider 改为Slider就不会报错了...
2020-04-07 11:03:17
4027
3
转载 hooks学习笔记—React中的展示与容器组件 Presentational和Container
在学习hooks首先看一下这篇文章，明确一下展示组件和容器组件的概念React中的展示与容器组件 Presentational和Container首先是最重要的一组概念：展示组件与容器组件。同样，在我们提到的，React并不是传统的MVVM框架，它只是在V层，视图层上下功夫。应该对MVVM或MVC都有所了解，那么既然我们的框架现在只有V层的话，在实际开发中应该如何处理数据与视图的关系呢？...
2020-04-03 11:33:58
576
1
转载 (转)终于有人把 Nginx 说清楚了，图文详解！
原文地址：https://baijiahao.baidu.com/s?id=1652608869911988442&wfr=spider&for=pc想必大家一定听说过 Nginx，若没听说过它，那么一定听过它的"同行"Apache 吧！Nginx 的产生Nginx 同 Apache 一样都是一种 Web 服务器。基于 REST 架构风格，以统一资源描述符（Unifor...
2020-04-02 17:22:55
319
原创 H5移动端—移动端布局及适配（rem）
1.rem适配原理首先清除一下默认样式，这个基本上所有写H5的都通用a,input,button { -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}input,button { -webkit-appearance: none; border-radius: 0;}body { margin: 0; -we...
2019-10-20 00:03:01
2827
原创 H5移动端—移动端布局及适配
1.移动端基本环境 viewport视口(可视区窗口) 默认不设置viewport一般可视区宽度在移动端是980 width可视区的宽度(number||device-width) user-scalable是否允许用户缩放(yes||no)iOS10无效(我们放在事件章节解决) initial-scale初...
2019-10-19 15:32:58
1516
原创 前端技巧和工具—excel表格数据转json
突然发现知道一些工具和技巧对提升工作效率有很大作用，记一次excel数据转json。1.问题重现产品提供的文档是这个样子的我需要转成这样的json形式2.如何解决现在说下我是如何解决的首先介绍一个工具，tableconvert简言之就是可以将各种格式的数据互转（eg：excel转成json）。but，我仅仅用这个还不够的，因为产品给的文档不能完全对应这个工具...
2019-10-19 15:10:29
763
原创 ts从入门到进阶—4.2类
6.静态属性类的实例成员。仅当类被实例化的时候才会被初始化的属性。使用this前缀访问 类的静态成员。存在于类本身上面而不是类的实例上。使用类名(Grid)前缀访问，(不管是在类的里面还是外面都是这样访问）class Grid { static origin = {x: 0, y: 0}; calculateDistanceFromOrigin(point: {x: nu...
2019-10-19 15:10:00
385
原创 ts从入门到进阶—4.1类
1.类我们声明一个Greeter类。这个类有3个成员：一个叫做greeting的属性，一个构造函数和一个greet方法。 我们在引用任何一个类成员的时候都用了this。 它表示我们访问的是类的成员。 我们使用new构造了Greeter类的一个实例。 它会调用之前定义的构造函数，创建一个Greeter类型的新对象，并执行构造函数初始化它。class Greeter {...
2019-10-19 15:09:53
655
原创 ts从入门到进阶—3-9接口（二）
5.函数类型## 函数类型接口能够描述 JavaScript 中对象拥有的各种各样的外形。 除了描述带有属性的普通对象外，接口也可以描述函数类型。为了使用接口表示函数类型，我们需要给接口定义一个调用签名。它就像是一个只有参数列表和返回值类型的函数定义。参数列表里的每个参数都需要名字和类型。```typescriptinterface SearchFunc { (source...
2019-10-19 15:09:46
1117
1
原创 ts从入门到进阶—3-9接口（一）
TypeScript的核心原则之一是对值所具有的结构进行类型检查。它有时被称做“鸭式辨型法”或“结构性子类型化”。在TypeScript里，接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。1.接口初探注意事项1）接口定义的字段，传的参数必须有并且符合规定。（也就是接口定义了几个字段，你必须传几个）比如说下面会报错interface config {...
2019-10-19 15:09:40
2333
原创 ts从入门到进阶—3-4var/let/const声明，解构，展开
#变量声明`let`和`const`是JavaScript里相对较新的变量声明方式。`let`在很多方面与`var`是相似的，但是可以帮助大家避免在JavaScript里常见一些问题。`const`是对`let`的一个增强，它能阻止对一个变量再次赋值。因为TypeScript是JavaScript的超集，所以它本身就支持`let`和`const`...
2019-10-19 15:09:34
2438
原创 ts从入门到进阶—3-1基础类型
1.如何安装>以下命令应用于macsudo npm install -g typescript>安装完成之后，执行下面的命令，如果出现版本那么安装成功tsc -v>如何使用。(tsc 文件名)，会生成一个对应的js文件tsc index.ts2.基础类型typescript的数据类型 = JavaScript的数据类型+枚举类型布尔值，数字，...
2019-10-19 15:09:25
485
原创 ts从入门到进阶—1课程介绍
慕课网的git账号和密码： sjj9433@163.com passw mkw1.为什么学习typescript2.内容概述3.axiosjs库的重构4.前端工具运用5.其他
2019-10-19 15:09:15
540
原创 react native基础—4.flex-container和flex-item
1.flex-container（容器的属性）在css中flex布局默认是row（从左向右），在reactnative中是column（从上往下）以下6个属性设置在容器上。 flex-direction flex-wrap flex-flow justify-content align-items align-content ...
2019-10-19 15:09:07
294
原创 react native基础—3.常用样式
1.常用样式2. 文字文字必须写在<Text></Text>标签内，直接写在外面会报错3. 注意ios和安卓的样式有时候会不一样，需要多加注意
2019-09-20 10:39:44
221
原创 react native基础—2.使用样式
在 React Native 中，我们仍然是使用 JavaScript 来写样式。接受名为style的属性，只是按照 JS 的语法要求使用了驼峰命名法，例如将background-color改为backgroundColor。1.样式的三种写法1.style属性是一个普通的 JavaScript 对象2.style属性是一个数组（在数组中位置居后的样式对象比居前的优先级更高...
2019-09-20 10:01:42
372
原创 react native基础—1.windows安装环境
1.搭建windows开发环境具体文档可以看官网，本文只是写注意的点1）node版本必须是大于等于10node -v 查看node的版本 window系统升级node只能到node官网下载window安装包来覆盖之前的node。具体看这篇文章windows下更新Node2）Python 的版本必须为 2.x（不支持 3.x）python 直接查看版本3）JDK 的版本必须是...
2019-09-19 10:43:19
146
原创 react和vue系统性总结
vue项目中的坑1.数组，对象。不能实时变化，必须使用变异方法 2.elementyi scope 样式不能使用 去掉scope就可以了 3.v-show 和 v-if正确使用 4.普通的watch中只能监听到某不对象的变化才会调用，当想监听对象以及对象中属性的变化都调 用函数时，可以使用deep:true 5.echarts的id值必须唯一Reac项目中的坑1.在r...
2019-09-10 10:49:19
257
转载 JavaScript系列—关于JSON.parse(JSON.stringify(obj))实现深拷贝应该注意的坑
JSON.parse(JSON.stringify(obj))我们一般用来深拷贝，其过程说白了 就是利用JSON.stringify 将js对象序列化（JSON字符串），再使用JSON.parse来反序列化(还原)js对象；序列化的作用是存储(对象本身存储的只是一个地址映射，如果断电，对象将不复存在，因此需将对象的内容转换成字符串的形式再保存在磁盘上 )和传输（例如 如果请求的Content-Ty...
2019-08-31 23:40:49
1208
原创 JavaScript系列—class（静态方法和属性、实例属性、私有方法和属性）
1.类的简介JavaScript 语言中，生成实例对象的传统方法是通过构造函数。下面是一个例子。function Point(x, y) { this.x = x; this.y = y;}Point.prototype.toString = function () { return '(' + this.x + ', ' + this.y + ')';};var...
2019-08-20 14:42:24
21959
6
原创 JavaScript系列—JS数据类型、类型转换(二)
1. JS数据类型及相关操作javascript数据类型： Number, String, Boolean, Undefined, Symbol Null Object(obj/[]/{}/null)typeof判断数据类型: "number","string","boolean","undefined","s...
2019-08-18 20:27:44
301
原创 web前端面试题（二）
*this系列*介绍一下原型对象一句话概括就是每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。如下图所示function Person() {}Person.prototype.name = "Nicholas";Person.prototype.age = 29;Person.prototype.job = "So...
2019-08-14 17:13:00
549
1
原创 Redux 入门教程—17异步与 promise
https://github.com/pburtchaell/redux-promise-middleware/blob/master/docs/introduction.mdhttp://es6.ruanyifeng.com/#docs/promisehttp://liubin.org/promises-book/https://segmentfault.com/a/11900000...
2019-08-13 14:56:54
254
原创 Redux 入门教程—15redux-thunk 实践发送 ajax 请求2
一般异步请求有三种情况https://randomuser.me/https://cn.redux.js.org/docs/advanced/AsyncActions.htmlcomponents/User.jsimport React, { Component } from 'react';import { connect } from 'react-redux';...
2019-08-13 14:39:58
219
原创 Redux 入门教程—15redux-thunk 实践发送 ajax 请求
首先安装一个库axios，可以用来发送异步的ajax请求yarn add axios然后导入该库https://randomuser.me/components/User.jsimport React, { Component } from 'react';import { connect } from 'react-redux';import { get_user } ...
2019-08-13 14:11:17
218
原创 Redux 入门教程—14异步和 redux-thunk
我们在项目经常要发送ajax，处理异步等，这个也可以使用中间件第一步：安装第二步： 使用第三步：action代码import { INCREMENT, DECREMENT } from '../constants';export const increment = () => { return dispatch => { setTimeout(...
2019-08-13 11:14:46
360
原创 Redux 入门教程—13redux-logger
现在我们可以使用别人写好的中间件，这节使用一个关于打印日志的中间件redux-logger如何使用？第一步：安装第二步： 使用第三步：检验（点击之后就会打印）...
2019-08-13 10:56:28
2518
原创 Redux 入门教程—12中间件
现在有一个需求，每一次dispatch的时候都会打印一下日志发送到终端我们可以在每一个action中这样打印一下，但是假如有100个action，那写起来就很麻烦现在我们就可以用中间件来实现先学习一下中间件的概念中间件如何写呢？现在我们来试一下吧第一步，引入applyMiddleware第二步，中间件是一个函数这样我们每次触发一个a...
2019-08-13 10:47:19
196
原创 JavaScript系列—函数防抖与函数节流
个人总结防抖：它在用户不触发事件的时，才触发动作。通俗：保证了正常的用户每输入1，2个字符就能触发一次。如果用户是输入法狂魔，也可以狠制他每输入3～6个字符触发一次。应用：提交按钮的点击事件。实现思路：将目标方法（动作）包装在setTimeout里面，然后这个方法是一个事件的回调函数，如果这个回调一直执行，那么这些动作就一直不执行。为什么不执行呢，我们搞了一个clearTimeou...
2019-08-12 20:03:27
307
原创 git merge和git rebase的区别, 切记：永远用rebase
作者：丁哥开讲链接：https://zhuanlan.zhihu.com/p/75499871来源：知乎著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。git merge和git rebase的区别, 切记：永远用rebase这一期来谈一下git merge和git rebase的区别。Git无疑现在已经成为最流行的...
2019-08-12 19:53:14
1434
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人