JS高级. 01 复习JS基础

1. JavaScript 包含: ____, ____, 和 ____.

2. JavaScript 的基本类型有 ____, ____, 和 ____.

3. JavaScript 的复合类型有 ____, ____, ____, ____, ____, ____, 和 ____. 还有两个核心类型: ____ 和 ____.

4. JavaScript 还有两个空类型: ____ 和 ____.

5. JavaScript 中获得类型的运算符是 ____. 使用该运算符返回的结果是什么类型? ____.

6. JavaScript 中 === 和 == 有什么区别? ____.

7. JavaScript 中 in 运算符有什么用? ____.

8. JavaScript 的关系运算符是: ____.

9. JavaScript 中创建对象使用 ____ 运算符.

10. 什么是引用类型, 什么是值类型? ____.

11. JavaScript 什么叫逻辑中断: ____.

12. JavaScript 中 delete 运算符的作用是 ____.

13. JavaScript 中循环语句有 ____ 种. 分别是: ____, ____, ____, 和 ____.

14. JavaScript 中分支语句有 ____ 种. 分别是: ____, ____.

15. JavaScript 中跳转语句 break 与 continue 如何使用? ____.

JavaScript 包含三大部分：

　　ECMAScript：规定js的语法规范

　　DOM：Document Object Model ：提供了一套完整的操作页面元素api

　　BOM：Browser Object Model ：浏览器对象

JS基本类型

d) string\boolean\number

复杂数据类型(引用类型):

Array Date Obeject RegExp String Boolean Number
核心类型Object function
获取数据类型typeof()
1. (typeof是个关键字)
2. (返回值是字符串)
3. typeof 变量名;
首字母大写的是函数
空类型
null:
1. 变量不可能为null值,除非手动设置
2. 解除对象的占用的时候给对象赋值null
undefined:定义之后未赋值

===和==的区别

===:类型和数值必须全等

==:数值相等即可

in关键字

用法一
1. for…in:变量对象的键
2. for(var 变量;in 对象名)
3. 对象的键名为字符串类型
用法二
1. 判断属性(数值就是索引值)是否存在对象中
2. ‘关键字’ in 对象名

a) 判断关键字是否在关键字

b) 返回值是boolean类型

用法三
1. 判断数组是否存在某个键
2. in关键字判断数组的时候是判断索引是否存在,而不是值
3. 如何判断数组中是否存在指定的值
  1. indexOf
  2. ar.indexOf(要查找的值)
  3. 找到返回指定元素的索引值,
  4. 没有找到返回-1

console.log(3 in arr );      // 判断数组中是否有3这个索引值

console.log(arr.indexOf('b')); //  判断数组中是否含有'b'这个值

关系运算符:> < >= <= =

创建对象使用new对象

a) var obj = new Date();

b) GMT:格林尼治标准时间

c) UTC:世界协调时间

类型

值类型

　　　　a) 储存的就是数据本身的变量就是值类型数据

　　2. 引用类型Object

1. 　　储存的是数据在内存中的地址,数据类型在内存中单独储存就是引用类型数据
函数调用时,默认将实参赋值给形参
形参没有具体的数值
看到对象字面量和{大括号}才会创建新对象
值类型做函数的参数
1. 函数内部的变量,也就是形参和实参只是简单的赋值操作,两个数据独立储存
2. 在函数内部对形参进行修改,不会影响外面的值
引用类型做函数的参数

是把实参存储的地址赋值给了形参,在函数内部,形参同样指向该对象
所以在函数内部对该变量进行修改,会修改外部的值
如果在函数内创建对象,修改一个值不会影响另外一个.两个独立存在

引用类型中除了function 都是object 类型

var obj = {

    num:5

};

console.log(obj); //输出num的值是5

function num(number) {

    number.num = 100;

    number = {

        num:15555   //函数内创建的对象和函数外的互不影响

    }

    return number;

}

num(obj);

console.log(obj);//输出num的值是100

对象的动态特效

对象的动态特性是指,在对象创建出来之后,为对象添加新的属性或者方法
1. obj.satHello = function(){方法;}
2. obj.xxx = yyy;
  1. 如果xxx存在,是进行修改
  2. 如果xxx不存在,是添加属性或者方法
obj.[”属性名”]:可以用这种方法取值,也可以新增属性或者方法
obj[0] = ‘oooo’;可以添加成功,因为这里会进行一个隐式转换
1. [ ]内的值会被隐式为转换字符串类型
2. 把对象{}转换层字符串object object
动态添加属性/方法
1. obj.新属性 = 新值
2. obj[新属性] = 新值

/**

 * 对象的动态特性

 *      在创建一个对象之后,可以给对象追加属性和方法

 */

var prople = {

    name:'jack',

    age:18

}

console.log(people); // 输出那么 和age 两个属性

people.sex = '男'; // 追加属性

prople.sayHallo = function () { // 追加方法

    console.log("我叫jack");

}

console.log(prople);  //输出追加后的对象,name age sex 三个属性和sayHallo这个方法

prople.sayHallo();  //输出  我叫jack

prople['height'] = 180;

console.log(prople);//输出追加后的对象,name age sex height四个属性和sayHallo这个方法

逻辑中断(短路运算)

　　true ||　false　　// 返回true

　　false || true／false // 返回true／false

　　　　表达式一　　||　　表达式二　

　　　　　　　　1为真返回1

　　　　　　　　1为假返回2

　　true && false. //. 返回false 第一个真。返回第2个

　　false && true //. 返回false。第一个假返回第1个　

　　　　　表达式一　　||　　表达式二

　　　　　　　　1为真返回2

　　　　　　　　1为假。返回1

delete运算符的作用

用来删除对象的属性,还有删除未使用var声明的变量
不能删除实用var声明的变量
删除一个不存在的属性,也会删除成功

　　　　a) delete 对象名.对象属性名;

　　4. 返回值是删除是否成功false/true

　　5. 如果删除的属性存在与原型中,返回true,但是并未删除

循环语句

for
1. 跳出循环:continue
while
do…while
for…in

分支语句

　　　 if…else

　　　 swith…case

函数

函数声明

　　function name(){}

函数表达式

在使用函数表达式声明函数的时候,function后面可直接跟函数名(name)
var fn = function name(){}
但是这个函数名(name),直线在函数内部使用,外部无法访问
var fn = new Function(“”)

//解析会被提前

function name(){

   //函数体

}

//解析不会被提前,使用必须在定义之后

var fun0 = function () {

    //函数体

}

//解析不会被提前,使用必须在定义之后

//创建一个函数对象

var fun = new Function("");//函数体放 引号中间

//创建一个匿名函数

var a= (function (){/*函数体*/})();  //创建完毕直接调用

Dom操作

a) document.createElement

b) appendChild

　　2. 删

a) removeChild

　　3. 改

a) style

b) id

c) className

d) innerHTML

e) innerText

f) ...

　　4. 查

a) getElementById

b) getElementsByTagName

c) getElementsByClassName

异常处理

捕获语句:try catch finally

try{

        // 可能出现的代码

        // 无法捕获语法错误

}

catch(e){

        //出现错误后执行的代码

}

finally {

        // 必然会执行的代码

        // node.js

       // 一般做释放资源的操作

}

异常最大的特征：出现异常之后，后面的代码将不会执行

手动抛出异常

　　1· 使用throw 关键字

　　2·错误代码（编号），错误信息

　　3·throw 可以在外部定义

try{

    a();

}catch(e){

    // console.log(e);

    // e 是错误信息

    throw( 'a() 是一个未定义的函数)' );

    // throw( e )相当于不写这个异常处理函数；

    // throw() 手动抛出异常，括号内写抛出的自定义信息

}

finally {

    console.log("这里的一定会执行") ;

}

面向对象

1、什么是对象！！！！
万物皆对象

2、对象的特征
对象的特征就是用来描述对象的相关信息
、比如一个人对象，特征就有：name age gender height

3、对象的行为
对象行为就是描述对象的行为
比如一个人对象，行为就有：吃跑跳睡唱抽烟喝酒烫头

4、在JS当中什么是对象？
键值对儿的组合就是

5、现实生活中的对象的特征对应到JS当中是对象的属性！

6、现实生活中的对象的行为对应到JS当中就是对象方法！

createElement(‘div’):创建一个div

面向对象是对面向过程的封装

　　a) 封装的意义就是复用

编写代码规则DRY

　　a) don’t repeat yourself

使用函数封装带来的问题：

　　1.全局变量污染
　　2.代码结构不够清晰，维护不方便

使用对象进行封装后的优势
　　1.暴露在全局的只有一个对象名不会造成全局变量污染
　　2.使用对象将代码进行功能模块的划分，有利于日后的维护

function createEle(box) {

    var ele = document.createElement('div');

    ele.style.width = '100px';

    ele.style.height = '100px';

    ele.style.backgroundColor = '#f00';

    ele.style.margin = '0 auto';

    box.appendChild(ele);

}

使用对象进行封装。对象封装

var obj = {

    jQy: {

        Id: function (ele) {

            return document.getElementById(ele);

        },

        Class: function (ele) {

            return document.getElementsByClassName(ele)[0];

        }

    }

}

jQuery 中创建对象直接添加即可

$('body').append("<div style='width: 100px;height: 100px;margin: 0 auto;'></div>")