前端踩坑系列《三》

Top 3：访问地址中的 #

问题描述：

在点击某个按钮的时候，我们打开一个页面，这个页面中的配置参数，可以通过页面的 url 传参的方式去做的，类似于以下的形式。

http://www.cnblogs.com/kaituorensheng/p/3776527.html?name=gping&age=23

这种方式我们在平时页面之间传参用得很多，但实际上会存在一个隐患，就是页面超级长的时候（这里具体我也不是很清楚），访问地址就会报 5** 或者 404 的错误。

404 错误

问题解决：
其实可以通过改成其他的传参方式进行解决，比如我们这个需求打开的这个实际上是一个 iframe，那么我们可以通过 postMessage 的方式进行。

另外一个就是我们想要提到的，通过 # 的方式，我们经常在页面中看到 ? 和 &，但是 #却不算常见，见得多的使用场景就是 hash 地址。那它到底有什么神奇的能力呢？

• # 代表网页中的一个位置， # 号右边的字符，就是该位置的标志符
• 单纯改变 # 后面的字符，网页不会发生重载
• HTTP 请求中不包括 # 后面的字符串

最后一点就是可以用来解决我们的问题的点。还是刚刚那个例子，我们带上 # 试下:

Top 2：数组浅复制

问题描述
这个坑是同事分享，slice 是我们对数组经常做的操作，但实际上用的时候，我们却可能忽略它是浅复制的，导致我们改变一些值的时候，另外一些值异常。这里记录一下：

盗用灵魂画师作品

问题解决
如上，平时多注意！

Top 1: input 标签的 accept 属性

问题描述
直接上代码：

很简单的需求，上传图片。但是会有一个问题，就是在 window 中上传图片会很慢，这个慢主要是指的是调起文件管理器很慢，一般要 5s——10s 不等（需求方表示程序员可以祭天了）

问题分析
这里主要的原因在于 accept 属性，这里的意思接受一切的图片，相当于一层过滤，但也正是因为这一层过滤，导致的很慢。我的猜想是它会一个个的去比较，所以导致性能下降

问题解决
指定特定的图片类型：

总结

又是元气满满的踩坑周呢，这周有点忙，忙着挖坑和填坑!
祝大家心明眼亮，节日玩得开心~

都看到这里了，记得关注啊