Web/20-前端综合/2018年-前端日记.md
2018-06-15 21:41:27 +08:00

251 lines
6.7 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

## 2018年4月份
### 2018-04-25
- userAgent相关[判断微信内置浏览器的UserAgent](http://www.cnblogs.com/7z7chn/p/5370352.html)
### 2018-04-26
**前端相关**
- 流程图制作工具:[ProcessOn](https://www.processon.com/)
- api方法的浏览器兼容性问题可以在这个网站上看<https://caniuse.com/>
- CSS3的兼容性问题不一定要使用-webkit-, -moz-, -o-, -ms-等私有前缀。可以使用 PostCSS。[知乎](https://www.zhihu.com/question/20597072)
- 浏览器常见的内核有V8、WebKit。另外腾讯还有个[X5](http://x5.tencent.com/)。
- 要查一下display none 和 visibility hidden的区别。
- ES 的各个版本在 Node 环境下的支持情况,可以查看这个网站:<http://node.green/>
- promise的实现关键词Promises/A、Promises/B、[bluebird](https://github.com/petkaantonov/bluebird)
**综合**
- whistle安装证书后可以拦截 https 请求。但是,我现在又不想拦截了,该怎么卸载证书呢?
### 2018-04-27
- [strider](https://github.com/Strider-CD/strider):可以用来部署项目。
- 有必要了解一下电商1.0、电商2.0、电商3.0的概念。
### 2018-05-02
- `location.pathname`:获取 url 的后半部分。参考链接:[#](http://www.cnblogs.com/itjeff/p/4645262.html)
- 代码解读:`callback && callback()`的含义
### 2018-05-03
- 各种框架实现的todo项目<http://todomvc.com/>
- 对比 sass、less、stylus 这三个css预处理器zqc说后面两个已经不怎么用了。sass 比 less强大stylus的书写方式比较奇怪。
- npm命令中--save 和 --save-dev的区别。参考链接<http://pwcong.me/2017/01/05/npm%E5%BC%95%E5%85%A5%E6%A8%A1%E5%9D%97%E6%97%B6--save-%E4%B8%8E--save-dev-%E7%9A%84%E5%8C%BA%E5%88%AB/>
### 2018-05-07
- Vue组件的注册
有一种组件注册的方式是 Vue+jQuery
```javascript
Vue.component('my-div', $.extend({
props:[],
methods:{
},
filters:{
}
}), vueTpl.subs.myDiv)
```
根据 zqc 的建议,不一定要使用`$.extend()`,还可以使用`object.assign()`。
### 2018-05-08
- sku、spu的概念
### 2018-05-09
- 输入框正则的匹配
让输入框仅支持输入单个id且为字符串。如果输入多个id或者非数字的字符则自动删除
```javascript
v-on:keyup="querysku = querysku.replace(/\D/,'')"
```
### 2018-05-10
- 如果在控制台看到网络请求陈功数据也获取成功但是在ajax里走的是 error数据获取失败说明是 ajax代码的判断逻辑有问题。
- 服务器返回的json数据到底是对象还是字符串
- josn数据里的字段有顺序吗比如下面这段
```jsonn
{
"1492948848": {
"3": "1",
"spec": "",
"imagePath": "jfs/t3076/90/7623078170/152165/9fe8c39d/58b94105N8ed8d2c0.jpg",
"color": "橘色 ",
"name": "【多色可选】丽装铺园纯色百搭简约打底T恤女 橘色 M",
"size": "M"
},
"1492948847": {
"3": "1",
"spec": "",
"imagePath": "jfs/t3109/27/9469817576/176241/aa424d04/58d4c849Ne22114ed.jpg",
"color": "灰色 ",
"name": "【多色可选】丽装铺园纯色百搭简约打底T恤女 灰色 S",
"size": "S "
}
}
```
答案:顺序不重要。
- Vue开发中在其他地方用到Vue实例中的数据时一定要用this或者是`vm.$data.myName`之类的。
- 疑问下面的src路径的前面为何要加`//`
```
<img v-bind:src="'//img14.smyhvae.com/evalpic/s240x240_'+value.imagePath" />
```
我发现控制台看到的输出src中会自动加上http。如果前面不加`//`则表示相对路径。
### 2018-05-11
- 将逗号分隔的字符串,转换为数组: `str.split(",")`。即使数组中只有一个元素,也可以这样用。参考链接:[#](https://blog.csdn.net/erlian1992/article/details/50561452)
### 2018-05-14
- ajax发的是post请求但是后台却只收到了部分数据怎么办答案前端的post请求记得加content-type字段否则会被识别成 get 请求。
- 获取jsonp的数据只能用get请求。如果要用post请求那就传json数据另外可能还要解决跨域的问题。跨域需要在后台配置三行代码即可。
- p标签里的文字溢出怎么办
- whistle该怎样mock数据
### 2018-05-16
- 在控制台看标签的样式,发现有些样式是出现在`element.style`中的(比如图片的尺寸),但是在代码里并没有找到。那是因为,这些样式是在 js 代码中**计算**出来的。
- 图片自适应显示
- [视区相关单位vw, vh..简介以及可实际应用场景](http://www.zhangxinxu.com/wordpress/2012/09/new-viewport-relative-units-vw-vh-vm-vmin/)
- jingwen推荐的iconMoon图标网站。网址<https://icomoon.io/>
### 2018-06-01
- `PingFangSC`字体是iOS独有的字体。`PingFangSC-Regular`是常规字体,`PingFangSC-Semibold`是加粗字体。如果我在代码里设置了这个字体那么ios上可以看到效果但是Android上看不到效果仍然会采用Android系统默认的字体。
### 2018-06-04
**1、git相关**
把 branch1 中的某条记录(比如myLog),提交到 branch2中。做法如下
先切换到branch2中然后输入如下命令
```
git cherry-pick myLog
```
### 2018-06-05
**1、font-size**
`font-size`的最小值为12。
也就是说浏览器的最小字体为12要是再小于这个值是不生效的。如果想要小于12需要在浏览器的高级设置里去修改。
**2、git 多分支同时开发**
现在有这样一个场景我要同时开发一个项目里的两个功能。今天上午开发功能1下午开发功能2。明天上午改功能1的bug明天下午改功能2的bug。
相当于是,我现在是**并行**开发两个功能了要怎么通过git来进行协作呢
目前考虑到的姣好的方式是:
- 从master拉分支`branch1`此分支专门用来开发功能1改功能1的bug。
- 再从master拉分支`branch2`此分支专门用来开发功能2改功能2的bug。
以后需要上线哪个功能就从那个分支merge代码到master。
**3、其他**
- 两个span之间默认有5px的 margin
- **shadow-root**:下一代。
### 2018-06-07
- [原生js实现淡入淡出效果](https://www.teakki.com/p/57dfb44cd3a7507f975e91e4)
- 通过 jQuery 获取Dom的时候比如`$('#topNavTop').css('background','red')`记得要指明是 id 还是 class。
- 每次开发一个新的需求记得要问清楚“H5和小程序”都要做吗要做的话工作量基本乘以2。
### 2018-06-14
- pv、uv的概念