think
think copied to clipboard
think in fe
看到这样的一道题目: ```javascript var a = {n:1}; a.x = a = {n:2}; console.log(a.x); // --> undefined ``` 这是为什么呢? 因为赋值语句是从右到左的,也就是先计算右值,所以`a.x = a = {n:2}`这句,就拆分为:`a.x = (a = {n:2})` 也就是先执行的`a = {n:2}`赋值,再赋值给a.x。 最开始我以为是`a...
**编码规则:** `count[letter]`,将letter的内容count次输出,count是0或正整数,letter是区分大小写的纯字母 **示例:** ``` const s = '3[a]2[bc]'; decodeString(s); // 返回'aaabcbc' const s = '3[a2[c]]'; decodeString(s); // 返回'accaccacc' const s = '2[abc]3[cd[e]]fg'; decodeString(s); // 返回'abcabccdcdcdef' ``` **解题思路** **思路一**:从外往内拆,拆成如下对象格式 ``` obj...
微信分享填坑指南
### 准备工作 如果想要是使用微信的分享功能,需要使用微信JS-SDK来完成。且只能点击微信右上角的`...`调起分享面板,不能直接由页面行为唤起! 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力。 #### JS-SDK使用 1、绑定域名: 登录微信公众平台 --> 公众号设置 --> 功能设置 --> 填写“JS接口安全域名” 2、在页面引入JS文件: `http://res.wx.qq.com/open/js/jweixin-1.2.0.js` **注:**支持https;支持使用 AMD/CMD 标准模块加载方法加载;应尽可能早的加载,建议放置到页面head里加载。 3、配置config: 所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用。 ```javascript wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: '', //...
[原文](https://css-tricks.com/centering-css-complete-guide/) [作者:Chris Coyier](https://css-tricks.com/author/chriscoyier/) css居中很难吗?显然不是。我认为这个问题并不是很难,但是它有很多种实现方法,难点是需要知道在什么场合使用什么样的居中方式! 因此,我制作了一棵决策树去帮助你更容易的去解决这个问题。 我们太需要居中了...... ## 水平居中 ### 内联元素水平居中 在一个块级元素内部水平居中内联元素,我们只需要这样做: ```css .center-children { text-align: center; } ``` [Demo](http://codepen.io/chriscoyier/pen/HulzB) 这种方式对于inline、inline-block、inline-table和inline-flex等都能起作用。 ### 块级元素水平居中 你可以设置一个块级元素的`margin-left`和`margin-right`的值为`auto`来实现水平居中(块级元素的宽度必须是固定值,否则它将充满父元素从而达不到居中效果): ```css .center-me { margin: 0 auto; }...
跟随着《深入React技术栈》一书,对React v15.0.3的源码进行了简单的解读,以下是部分读书笔记: 1、mountComponent本质上是递归渲染内容的,所以,由于递归的特性,父组件的componentWillMount要先于子组件的componentWillMount执行,而父组件的componentDidMount则在其子组件之后调用。  2、在componentWillReceiveProps中调用setState时,不会触发re-render,此时只是把state合并到更新队列里边去。 3、在componentWillReceiveProps、shouldComponentUpdate和componentWillUpdate中也无法获取到更新后的state值,此时state仍然在更新队列里边,需要执行了inst.state = nextState之后才能访问到,也即只有在render和componentDidUpdate之后this.state获取到的才是更新之后的state。 4、updateComponent本质上也是递归渲染内容的,由于递归的特性,所以父组件的componentWillUpdate是在子组件的componentWillUpdate前调用,父组件的componentDidUpdate则是在子组件的componentDidUpdate之后调用。  5、在shouldComponentUpdate和componentWillUpdate中禁止调用setState方法,这会导致组件渲染的死循环。 6、如果在shouldComponentUpdate和componentWillUpdate中调用setState方法,由于setState方法中会调用performUpdateIfNecessary判断是否需要更新,performUpdateIfNecessary则会判断此时的更新队列是否为空(this._pendingStateQueue != null),不为空则调用updateComponent方法进行更新,而updateComponent方法又会调用shouldComponentUpdate和componentWillUpdate方法,造成循环调用,形成死循环。  7、事务就是将需要执行的方法使用wrapper封装起来,再通过事务提供的perform方法执行,而在perform执行之前,先执行所有wrapper中的initialize方法,执行完perform之后,再执行wrapper提供的close方法。一组initialize和close方法称为一个wrapper。多个wrapper可以嵌套叠加。  8、React将Virtual DOM树转换成actual DOM树的最少操作过程称为调和(reconciler)。diff算法便是调和的具体实现。 9、diff策略 - 策略1:Web UI中跨层级的DOM操作很少,可以忽略不计。(tree diff) - 策略2:拥有相同类的两个组件将会生成相似的树形结构,拥有不同类的两个组件将会生成不同的树形结构。(Component diff) - 同一类型的组件,继续按照原策略继续比较Virtual...
1、redis基本数据类型 字符串(string)、哈希(hash)、列表(list)、集合(set)、有序集合(zset) 2、redis客户端进入命令: $ redis-cli 3、redis键命令基本语法: ``` redis 127.0.0.1:6379> COMMAND KEY_NAME ``` 更多命令参考:https://redis.io/commands 4、什么是基数? 比如数据集 {1, 3, 5, 7, 5, 7, 8}, 那么这个数据集的基数集为 {1, 3, 5 ,7, 8}, 基数(不重复元素)为5。 基数估计就是在误差可接受的范围内,快速计算基数。...
[sketch使用技巧](https://github.com/Mmzer/think/blob/master/sketch%E4%BD%BF%E7%94%A8%E6%8A%80%E5%B7%A7/sketch%E4%BD%BF%E7%94%A8%E6%8A%80%E5%B7%A7.md)
CSS不常用属性收集
`-webkit-box-reflect` 实现倒影和对称效果 `isolation:isolate` : 用来隔离`mix-blend-mode`元素的混合 `will-change ` 加速动画 `mix-blend-mode` 混合模式 `background-blend-mode`: 背景的混合模式。可以是背景图片见的混合,也可以是背景图片和背景色的混合 `text-align-last` : 规定如何对齐文本的最后一行,并且只有在text-align的值为justify时才起作用。 `:target`伪类: 可用于选取当前活动的目标元素。当然 URL 末尾带有锚名称 #,就可以指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)。它需要一个 id 去匹配文档中的 target `:root` : 选择器匹配文档根元素 `:target` 选择当前活动的元素 `::selection`...
## 基本特点 - 结论先行 - 分类清楚 - 上下对应 - 排序逻辑 ## 信息的接收步骤 1. 识别 2. 对应 3. 结构 4. 表达 ## 回答/概括式结构 ### 自上而下疑问回答式 1. 设定场景 2. 明确主题 3. 设想问题...