前端
yesyoucan_
这个作者很懒,什么都没留下…
展开
-
transform transition animation 总结
transform常用的属性:rotate(30deg) 顺时针旋转30度scale(x,y)/scale(num)/scaleX()/scaleY() 当里面是正数为放大几倍,当为负数时字体翻转不是缩小,当参数为小于1的小数时,缩小。skew(30deg,20deg) 盒子倾斜角度。translate(-50%,-50%)盒子中心与父盒子(0,0)点重合transform: scale(0.2)...原创 2018-05-25 12:48:49 · 263 阅读 · 0 评论 -
applyMiddleware源码解读
前言: 笔者之前也有一篇关于applyMiddleware的总结。是applyMiddleware的浅析。 现在阅读了一下redux的源码。下面说说我的理解。概要源码: step 1: applyMiddleware(thunkMiddleware, createLogger()) 第一次执行applyMiddleware增加两个中间件;使用闭包...转载 2018-08-15 17:30:09 · 607 阅读 · 0 评论 -
js: 数组的迭代方法
使用数组总是会碰到数组的遍历(迭代)操作。说到迭代,可能会立马想起for语句对数组进行迭代。比如需要迭代出下面数组peoples年龄(age)大于30的人名(name)。var peoples = [ { name: 'Agraj', gender:'M', age: 29, address: { ...原创 2018-09-01 21:51:00 · 1161 阅读 · 0 评论 -
react 子组件更新父组件状态
react 子组件更新父组件状态class Father extends Component { construtor(props){ super(props); this.state={ name: 'Peter', age: '26' } } onChangeSta...原创 2018-09-08 17:54:49 · 6293 阅读 · 3 评论 -
redux基础知识
redux笔记action: 一个操作的定义,大概是这个样子, 本身是一个对象{ type:'add', todo }actionCreater: 一个函数,返回结果是一个actionfunction add (todo) { return { type: 'add', todo ...原创 2018-09-09 21:51:13 · 139 阅读 · 0 评论 -
CSS BEM 书写规范
CSS BEM 书写规范BEM命名约定BEM 是由 Yandex 团队提出的一种前端命名方法论。网上流传的主要是两个版本,一个是Yandex 原版BEM,还有一个是Nicolas Gallagher 修改版,这里我们采用的是 Yandex 团队原版的 BEM 规范。使用 BEM 命名规范,理论上讲,每行 css 代码都只有一个选择器。BEM代表...原创 2018-09-07 13:18:31 · 511 阅读 · 0 评论 -
word-break:break-all和word-wrap:break-word的区别
word-break:break-all和word-wrap:break-word的区别:word-break:break-all正如其名字,所有的都换行。毫不留情,一点空隙都不放过。而word-wrap:break-word则带有怜悯之心,如果这一行文字有可以换行的点,如空格,或CJK(Chinese/Japanese/Korean)(中文/日文/韩文)之类的,则就不打英文单词或字符的主意了...原创 2018-12-25 14:50:41 · 5253 阅读 · 0 评论 -
white-space: nowrap
white-space: nowrapwhite-space: nowrap的意思是除非遇到换行标签,否则不换行。点此查看效果原创 2018-12-25 14:55:20 · 941 阅读 · 0 评论 -
如何命名变量,让变量名更加优雅
在开发的过程中,我们总是会疑惑,如何给这个变量命名才能让使自己的代码更容易被别人理解。当leader review完代码时,有时会指出我们变量命名不合理,那么我们如何才能让命名合理化?1、根据自己代码的意义来命名:eg:获取用户信息:getUserInfo2、研究代码的上下文,观察之前代码的命名风格function getConfigureList() { return dispatch...原创 2019-01-20 10:23:15 · 2187 阅读 · 0 评论 -
中科大软院春招面试题
好玩的三道题:function foo(){var i =0; return function(){ console.log(i++); }}var foo1 = foo();var foo2 = foo();foo1();foo1();foo2();//0 1 0解析:第一次调用foo1()后,下次不再执行var i= 0了,直接调用return里的函数htm...原创 2019-02-26 17:45:48 · 783 阅读 · 0 评论 -
深拷贝和浅拷贝的理解与应用
深拷贝和浅拷贝的理解与应用 <div class="article-info-box"> <div class="article-bar-top d-flex"> <span class="time">2..转载 2018-08-08 11:05:28 · 190 阅读 · 0 评论 -
getElementsByClassName()兼容IE9以下版本:
getElementsByClassName()不兼容低版本IE浏览器;但是他是可以支持document.getElementsByTagname()的,下面是一种兼容的写法。简单的写法:function getElementsByClassName(node,className){ //输入节点名和类名 if(node.getElementsByClassName){ ...原创 2018-06-08 15:40:21 · 192 阅读 · 0 评论 -
ES5和ES6面向对象的写法
面向对象:ES5: function User(name,age){ this.name = name; this.age = age; } User.prototype.showName=function(){ console.log(this.name); ...原创 2018-05-25 21:39:41 · 1325 阅读 · 0 评论 -
转载:webpack4的配置
转载地址:https://blog.csdn.net/u012443286/article/details/79504289写这篇文章的初衷在于,虽然网络上关于webpack的教程不少,但是大多已经过时,由于webpack版本更新后许多操作变化很大,很多教程的经验已经不适合。当我们使用npm安装webpack时,若不指定webpack的版本,将默认安装最新版,笔者测试时默认安装的是4.1.1,并不...转载 2018-05-25 21:42:10 · 590 阅读 · 0 评论 -
中科大软院校招前端笔试题(记忆版)
好玩的三道题: 笔试题:function foo(){var i =0;return function(){console.log(i++);}}var foo1 = foo();var foo2 = foo();foo1();foo1();foo2();//0 1 0解析:第一次调用foo1()后,下次不再执行var i= 0了,直接调...原创 2018-05-25 22:41:44 · 583 阅读 · 0 评论 -
浅谈js中的call bind apply
使用call()时,obj调用了test得的sum方法,这就相当于把sum方法写到了obj里,并向sum里传了两个参数,所以1,2两个alert()输出的是传进的两个参数;self.a和self.b取得的是obj内的a,b值为2,3,和为5.bind函数将test.sum简化为另一个全局函数sum(b),sum(b)只需要传入一个参数即可。三种方法中的第一个参数实际上代表了this的指向,比如说第...原创 2018-05-23 10:22:32 · 113 阅读 · 0 评论 -
computed && methods && watch
methods一般用在事件绑定的方法中,每次函数调用,函数都要被重新运行一遍。computed计算属性是基于依赖缓存的,计算属性只有当所依赖的条件发生改变时才会执行。computed:<body> <div id = "app"> {{msg}} <br> {{msg}} </div></body><script>原创 2018-05-27 23:55:44 · 126 阅读 · 0 评论 -
Vue-cli设置autoOpenBrowser:true运行后项目自启
第一步:第二步:第三步:cnpm run dev:原创 2018-05-24 15:16:40 · 8825 阅读 · 0 评论 -
转:vue嵌套路由-params传递参数
转载:https://blog.csdn.net/k491022087/article/details/70232965在嵌套路由中,父路由向子路由传值除了query外,还有params,params传值有两种情况,一种是值在url中显示,另外一种是值不显示在url中。1、显示在url中index.html[html] view plain copy<div id="app"> ...转载 2018-05-29 22:24:57 · 135 阅读 · 0 评论 -
CSS中容易被忽视的 position属性sticky
position: sticky; 基于用户的滚动位置来定位。粘性定位的元素是依赖于用户的滚动,在 position:relative 与 position:fixed 定位之间切换。它的行为就像 position:relative; 而当页面滚动超出目标区域时,它的表现就像 position:fixed;,它会固定在目标位置。元素定位表现为在跨越特定阈值前为相对定位,之后为固定定位。这个特定阈值...原创 2018-05-30 10:47:29 · 10143 阅读 · 0 评论 -
CreateDocumnetFragment()和creatElement()的区别:
用法举例createElementvar createElementEg = document.createELement('div');// 添加元素方法1:innerHTMLcreateElementEg .innerHTML = '<span>this is createELement eg</span>';va...转载 2018-06-06 11:06:52 · 392 阅读 · 0 评论 -
ES6箭头函数中的this绑定问题
ES6箭头函数中的this绑定问题 &amp;lt;div class=&quot;article-info-box&quot;&amp;gt; &amp;lt;div class=&quot;article-bar-top d-flex&quot;&amp;gt;转载 2018-06-06 21:52:56 · 221 阅读 · 0 评论 -
京东面试--一道关于this的有趣题目
好玩到炸裂,共享下window.num=1var obj={ num:4, dbl: (function(){ this.num*=2; return function(){ this.num*=2; } })() }obj.dbl; 》》位置1dbl(); 》》位置2obj.dbl(); 》》位置3console.log...原创 2018-06-07 20:36:39 · 224 阅读 · 0 评论 -
nvm安装总结(mac)
1、安装nvmcurl -o- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash如果Mac使用的zsh,需要将命令中的| bash改为 | zshnote:oh-my-zsh安装可以替换mac的bash,安装后可以安装一个喜欢的主题,界面将非常美观。然后在控制台 cd ~/.nvm,观察...原创 2019-04-02 09:22:49 · 239 阅读 · 0 评论