js(1)知识小总结

js基础知识总结

一:基础复习

1. Javascript组成:

a) ECMAscript:规范了js的语法规范和语言使用标准
b) DOM:文档对象模型,一套api,提供了一套操作页面元素相关的api
c) BOM:browser object model-浏览器对象模型,提供一套用来操作浏览器相关信息的api

2. Js中常用的数据类型:

a) 简单数据类型:string number boolean
b) 复杂数据类型:Object function Array Date RegExp Math…
c) 空类型:Null undefined

3. 判断数据类型:typeof关键字,返回值的类型为string

a) string number boolean > string number boolean
b) 对象/数组>object
c) function(){} > function
d) null > object
e) undefined > undefined

4. 相等和全等

a) 相等:只判断值是否相等
b) 全等:判断类型和值是否相等(先判断类型再判断值)

5. In关键字:

a) For-in:遍历对象
b) 属性 in 对象:判断对象是否可以访问某个属性

6. 值类型和引用类型

a) 值类型:空间直接存储值
b) 引用类型:变量存储的是数据的地址,数据单独存储,变量存储的地址指向数据
c) 值类型和引用类型在赋值值的特点
i. 值类型的变量复制(参数传递)的时候是将值复制一份赋值给新的变量,修改其中一个不会影响另外的变量值
ii. 引用类型的变量复制(参数传递)是将存储的地址复制一份给新的变量,两个变量会指向同一个地址空间,修改其中一个另外的变量也会有相应的变化

7. 逻辑中断

a) ||中断:如果表达式1的值为真,就返回表达式1,否则返回表达式2
b) &&中断:如果表达式1为假,则返回表达式1的值,否则返回表达式2的值

8. Delete关键字的使用:

a) 可以删除未使用var声明的变量
b) 可以删除对象的属性,删除之后属性值为undefined。注意:如果访问一个不存在的变量,则会报错,但是如果删除一个不存在的属性,则不会报错,只是会返回undefined。
c) Delete关键字有返回值,但是不可靠,所以一般情况下不要使用这个返回值来进行相应的判断(通过Object.defineProperty方法添加的属性无法删除)
d) 使用delelte删除数组中的元素的时候,数组中的后面的元素的索引不会自动变化靠前,数组的长度也不会自动变化

9. Js中的循环语句:do-while while for for-in

10. Break和continue

二:对象的动态特性:

在对象创建完成之后,可以随时为对象添加任何属性和行为的特性—动态特性
使用方式:
  1. 点语法:对象.属性
  2. 关联数组语法:对象[属性名称]

    三:DOM操作复习:

    增加:createElement clone appendChild insertBefore innerHTML
    删除:removeChild innerHTML
    修改:innerHTML setAttribute style
    查询:getElementById getElementsByTagName getElementsByClassName querySelector querySelectorAll

    四:异常处理:异常会导致异常出现后面的代码不能正常的执行

  3. 语法:
    try{
    可能会出错的代码
    }catch(e){
    捕获异常后的处理代码
    }finally{
    无论是否出错都会执行的代码,如释放资源
    }
  4. e就是捕获到的异常信息
  5. 抛出异常:throw,可以抛出提示信息字符串值,也可以抛出对象
  6. 抛出的异常就是捕获的异常
  7. 注意:
    a) 死循环并不会报错,但是递归会报错
    b) 语法错误并不会进行捕获,因为语法错误在代码运行前就已经出现了
    c) 异常会导致后面的代码无法正常执行
    d) 异常捕获处理的目的就是为了当异常出现后不会影响后面代码的执行

    五:调试工具的使用:

  8. 开启调试窗口
  9. 介绍调试窗口
    a) 指针: 可以选择页面中的元素
    b) 手机: 模拟移动端界面,进行移动端页面的调试
    c) Elements: 查看页面 DOM 树
    d) Console: 控制台(注意, 控制台与该页面是一个整体, 在控制台中的任何操作, 会影响到页面)
    e) Source: 代码调试,可以设置断点
  10. 调试工具的使用
    a) 逐过程运行, 一次运行一个函数
    b) 单步运行(逐步运行), 一次运行一句, 如果是函数, 进入函数体内运行
    c) 继续运行. 从当前状态运行下去, 直到出现断点, 如果没有断点则运行结束
  11. 利用 watch 监视窗口可以查看对象成员
    六:面向对象的基本介绍:
  12. 什么是对象:
    a) 万物皆对象
    b) 对象的特征和行为
  13. Js中的对象:
    a) 无序的键值对的集合
    b) 属性对应着特征
    c) 函数方法对应着行为
  14. 使用js模拟对象
    var car={
    ‘brand’:’changcheng’,
    ‘price’:10000,
    ‘color’:’white’,
    行为
    run:function(){

    console.log('我启动了。。。。开始动了。。。');
    

    }
    };

    抽象对象–名词提炼法
    var xiaoMing={
    name:’小明’,
    ride:function(){

    console.log('开车旅行');
    

    }
    };
    var smallCar={
    brand:’BMW’,
    fly:function(){

    console.log('水陆两用');
    

    }
    }
    var dog={
    type:’big yellow dog’,
    name:’dahuang’,
    eat:function(){

    console.log('就会吃');
    

    }
    };

七:面向对象的编程:

var myQuery={
getELe:{
获取元素
getTags:function(tagName){
return document.querySelectorAll(tagName);
},
getId:function(id){
return document.getElementById(id);
}
},

setStyle:{
    封装添加边框的函数
    setBorder:function(elements){
        for(var i=0;i<elements.length;i++){
            设置边框样式
            elements[i].style.border="1px solid red";
        }
    },
    setColor:function(colorName){
        for(var i=0;i<elements.length;i++){
            设置边框样式
            elements[i].style.color=colorName;
        }
    }
},
request:{
    ajax:function(){},
    get:function(){},
    post:function(){}
}

}
到此:
1.解决了全局变量污染
2.解决了代码混乱

-------------本文结束感谢您的阅读-------------