<div class="container">

<h3>debugger语句会产生一个断点，用于调试程序，并没有实际功能；</h3>

<ol>

<li>使用debugger的前提是你手动打开了“开发者工具”；</li>

<li>debugger会产生一个断点，代码会停止在这里不再往下执行；</li>

</ol>

</div>

<script>

console.log(1);

debugger;

console.log(2);

</script>

<h3>如何获取页面元素？</h3>

    <ol>

        <li>获取单个元素：document.querySelector('选择器')，如果该选择器对应多个元素，则只返回第一个；</li>

        <li>获取多个元素：document.querySelectorAll('选择器')，获取选择器对应的全部元素；</li>

    </ol>

<h3>类型转换</h3>

        <ol>

            <li>JavaScript总是把值自行转换为他需要的数据类型;</li>

            <li>

                转化为数字：

                -(减)、*(乘)、/(除)，会把类型转换成数字； <br>

                true转化为1，false、空字符串转换为0；<br>

                略坑的加号:+，只要有一个是字符串，则全部作为字符串；

                因为加号(+)同时还是字符串连接符号；

            </li>

            <li>原始值到对象的转换：直接使用String()、Number()、Boolean()构造函数转换；</li>

        </ol>

<h3>作为属性的变量</h3>

        <ol>

            <li>使用var声明变量时，作为全局对象的一个属性，无法通过delete运算符删除；</li>

            <li>不使用var，直接给一个未声明的变量赋值，该变量是可以delete的；</li>

            <li>不使用var，使用关键词this给一个变量赋值，也是可以delete的；</li>

        </ol>

<h3>作用域链</h3>

        <ol>

            <li>JavaScript里的全局代码或者函数，都有一个与之对应的作用域链；</li>

            <li>作用域链可以理解为对象的列表，或叫对象的链表，他们是按优先级顺序排列的；</li>

            <li>这些对象就定义了一段代码或者函数的“作用域中”的变量；</li>

            <li>在全局代码(就是不是函数的代码，好扯~~)中，作用域链由一个全局对象组成；</li>

            <li>

                在无嵌套的函数中，作用域链有两个对象：<br>

                一、定义函数参数和局部变量的对象； <br>

                二、定义全局变量的对象；<br>

                如果是嵌套函数，则作用域链上至少三个对象；

            </li>

            <li>

                当代码运行需要<code>变量解析</code>(就是查找需要的变量的值)的时候，<br>

                就在作用域链(有顺序的对象或者链表)里面寻找对应的变量，<br>

                一旦找到就使用该变量并结束寻找；<br>

                如果作用域链里面找不到对应的变量，则抛出错误；

            </li>

        </ol>

        <h3>关系运算符用于检测两个值之间的关系；</h3>

        <ol>

            <li>总是返回一个布尔值true或false；</li>

            <li>==：相等运算符，检查两个值是否相等，不考虑类型；</li>

            <li>===：恒等运算符，检查两个值是否相等，同时考虑类型；</li>

            <li>比较运算符：>、>=、<、<=；</li>

            <li>

                in运算符：检查右侧对象里面是否拥有左侧属性名，如果有返回true； <br>

                实例代码一看就什么都懂了 ：

                <pre>

                    var a = {x:1, y:2, z:''};

                    console.log(a);

                    console.log('x' in a);

                    console.log('z1' in a);

                    console.log('toString' in a);

                    console.log('isPrototypeOf' in a);

                </pre>

            </li>

            <li>

                instanceof:检查左侧的对象是否是右侧类的实例，如果是返回true； <br>

                如果一个对象是一个“父类”的子类的实例，则一样返回true； <br>

                还有记住一点所有的对象都是Object的子类(后面原型链会讲到)； <br>

                所以，还是看代码：

                <pre>

                    var d = new Date();

                    console.log(d instanceof Date);

                    console.log(d instanceof Array);

                    console.log(d instanceof String);

                    console.log(d instanceof Object);

                </pre>

            </li>

        </ol>

<h3>位运算符对数字的二进制数据进行更低层级的按位运算，高级，然而不常用；</h3>

        <ol>

            <li>位运算要求操作数是整数；</li>

            <li>位运算会将NaN、Infinity、-Infinity转换为0；</li>

            <li>按位于：&，对操作数的二进制表示逐步执行AND操作；</li>

            <li>按位或：|，对操作数的二进制表示逐步执行OR操作；</li>

            <li>按位异或：^，对操作数的二进制表示逐步执行XOR操作，一个为1另一个不为1才返回1；</li>

            <li>按位或：~，对操作数的二进制表示所有位取反；</li>

            <li>左移：<<，对操作数的二进制表示进行左移，移动位数由第二个操作数指定；新的一位用0补充，并舍弃第32位；左移1位相当于*2，左移2位相当于*4，以此类推；</li>

            <li>带符号右移：>>，右边溢出的位忽略；如果是正数，左边最高位补0；如果是负数，左边最高位补1；右移1位相当于/2,右移2位相当于/4，不要余数，以此类推；</li>

            <li>无符号右移：>>>，和带符号右移一样，只是左边的最高位总是补0；</li>

        </ol>

<h3>大声说出来你知道的算术运算符：加减乘除取余，+-*/%；</h3>

        <ol>

            <li>

                +：数字相加 或 字符串连接； <br>

                加法操作的行为表现： <br>

                一、如果其中一个操作数是对象，则JavaScript会自动把他转成原始类型的值；<br>

                二、如果其中一个操作数是字符串的话，则另一个也会转成字符串，然后你懂的；<br>

                三、如果两个操作数都是数字，则进行加法运算; <br>

                可怜巴巴的样子，还是给你弄几个例子吧：

                <pre>

                    console.log(1 + 5);

                    console.log('1' + 5);

                    console.log(new Date() + '--ok');

                    console.log(12 + NaN);

                    console.log(true + true);

                    console.log(201 + null);

                    console.log(203 + undefined);

                    console.log(3 + 5 + '猜猜看');

                </pre>

            </li>

            <li>其他的算术运算符还用讲吗？</li>

        </ol>

<h3>由函数调用表达式延伸而来，前面加个new即可；</h3>

        <ol>

            <li>如果不需要传递参数，函数后面的小括号可以省略；</li>

            <li>如果调用的函数或方法没有返回值，则表达式的值是undefined；</li>

            <li>简单理解就是函数或方法名称后面跟上小括号代表执行；</li>

            <li>不看个例子感觉不踏实：

                <pre>

                    new Array(1,2,3);

                    new String('hello world!');

                </pre>

            </li>

        </ol>

<h3>跳转语句可以让JavaScript代码的执行从一个位置跳转到另一个位置，厉害了~</h3>

        <h3>标签语句</h3>

        <ol>

            <li>标签由标识符加冒号组成，如：gohere:；</li>

            <li>标签标识符+冒号(:)+语句，就组成了标签语句；</li>

            <li>break 和 continue可以使用语句标签；</li>

        </ol>

var personobj = {

                        name: '你叫什么？',

                        sex: '男',

                        weight: '160'

                    };

                    var arr = new Array();

                    var i = 0;

                    for(arr[i++] in personobj);

                    console.log(arr);

<h3>try-catch-finally是JavaScript的异常处理机制；</h3>

        <ol>

            <li>

                语法结构是这样的：

                <pre>

                try{

                    //我们自认为没有错误的 处理业务的代码

                }

                catch(e){

                    //上面的业务处理代码报错了，这里才会执行

                    //console.log(e);

                }

                finally{

                    //这里总是会执行，哎哟，领导啊，总结发言

                }

                </pre>

            </li>

            <li>异常对象e里面有两个属性name和message，分别代表错误类型和错误描述信息；</li>

            <li>

                瞄一眼小案例：

                <pre>

                    try{

                        console.log(a);

                    }

                    catch(e){

                        console.log(e.name); //返回错误类型

                        console.log(e.message); //错误描述

                    }

                    finally{

                        console.log('大会到处结束');

                    }

                </pre>

            </li>

        </ol>

<h3>with语句用于临时扩展作用域链；</h3>

        <ol>

            <li>是的，临时扩展作用域，临时；with代码块执行完成后恢复原始状态；</li>

            <li>

                语法结构是这样的：

                <pre>

                with(object){

                    statement;

                }

                </pre>

                将object添加到作用域链的头部，执行完成statement后，作用域链恢复到原始状态；

            </li>

            <li>

            看代码吧

            <pre>

                /*

                 *清空表单所有输入框的值

                 *document.querySelector['#myform'].username.value = '';

                 *document.querySelector['#myform'].password.value = '';

                 *document.querySelector['#myform'].coder.value = '';

                 */

                with(document.querySelector['#myform']){

                    username.value  = '';

                    password.value  = '';

                    coder.value     = '';

                }

            </pre>

            这就是with的用法；

            </li>

            <li>但是，不推荐使用with，有代码不好优化，运行慢等问题；</li>

            <li>并且，严格模式下是不能使用with的；</li>

            <li>所以，能不用我看你还是不要用with了吧；</li>

        </ol>

 <h3>use strict是将后续的代码解析为严格代码；</h3>

        <ol>

            <li>严格模式下禁止使用with；</li>

            <li>严格模式下所有的变量都要先声明；</li>

            <li>

                严格模式下调用函数的this值是undefined；下面这段小代码不加"use strict"的区别；

                <pre>

                    "use strict";

                    function fn(){

                        console.log(this);

                    }

                    fn();

                </pre>

            </li>

            <li>严格模式和普通模式有很多细微差别，记住很困难，基本原则是：<code>写代码要严谨</code>，不要偷懒，不要觉得当前代码可以正常运行即可；</li>

        </ol>