​ Adblock Plus是现在很多用户会安装的一些浏览器扩展插件，用来屏蔽使用浏览器浏览时页面中的插件。

​ 最近在写一个静态页面时，发现有张图片加载不出来，图片名为ad.jpg，调试了之后发现是浏览器的Adblock Plus把这张图片屏蔽掉了。

​ 刚开始没在意，后来浏览知乎和cnBeta时，发现都有因为使用Adblock Plus出现的提示，就突然很好奇，Adblock Plus检测是怎么实现的，自己根据写项目时的情况，实现了下检测Adblock Plus的功能。

要解决的问题：

​ 在不影响页面布局的情况下，检测用户是否使用Adblock Plus插件。

​ 最近在研究对象深拷贝的时候无意间发现了这样一个现象：

1
2
3
4

let obj = {name: 'Ryan',info:{name:'Ryan'}};
console.log(obj);
obj.info.name = 'Shang';
console.log(obj);

​ 在html中写上这段代码，在chrome浏览器中执行的结果是这样：


​ obj.info.name的值竟然在第一次打印的时候就变了？难不成console.log是一个异步操作？

库和框架

库

• 别人写好的内容由我们主动调用
• 常见库：jQuery Underscore Zepto Animate.css

框架

• 拥有完整的解决方案，我们写好内容交给框架调用
• 常见框架：vue angular react backbone

JSX

​ JSX是react发明的特殊写法语法，JSX=JavaScript+XML，就是JS和HTML的混合写法，这并不是JS引擎原生支持的，所以想在浏览器中直接执行，需要先转成ES5代码。jsx本质上就是一个js变量，可以作为参数、函数返回值、也可以用在循环/判断语句中。

1
2
3
4

ReactDOM.render(
     <h1 id="msg"><span>hello</span><span>world</span></h1>,
     document.querySelector('#root')
);

转义成为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

//1参数是元素类型，2参数是属性对象，3参数是子元素
ReactDom.render(React.createElement(
    "h1",
    { id: "msg" },
    React.createElement(
        "span",
        null,
        "hello"
    ),
    React.createElement(
        "span",
        null,
        "world"
    )
), document.querySelector('#root'));

​ 以前在学习JavaScript时总是有些漏洞，比如JavaScript中两个等号的比较所带来的类型转换问题，今天特别拿出来研究整理了一下。

对象==对象

引用类型的数据比较的是引用地址

1
2

{}=={}; //false，引用地址不同
[]==[]; //false，引用地址不同

对象==字符串