总结JS笔记

目录

JS笔记

JS基本概念

全局变量 和 局部变量

弹出框：

document.write对html内容输出

控制台输出内容：

获取表单值 和 非表单值

数据类型：

数据类型的分类：

typeof检测类型的方式

数组的创建：

对象的创建方式

关于 undefined 和 null之间的介绍：

数据类型的转换

整数转换

运算符：

★js的结构：

break 和 continue 的介绍

★字符串的方法

★数组的方法

函数

一、变量作用域

二、封闭函数

三、闭包

四：return false;

五：arguments对象

递归：

定时器

时间对象

JS事件

event : 事件对象 

事件流：捕获型事件流和冒泡型事件流

阻止事件冒泡

阻止默认行为：

DOM基础 

DOM中创建标签和文本

DOM中插入元素

DOM查询

1：查找父级

2：查找子元素

3：查找兄弟元素

DOM高级

★DOM属性操作setAttribute()（对象方法）

Window.onscroll滚轮事件

★窗口尺寸与大小

正则表达式

Axios

---

JS笔记

JS基本概念

js 的全称：JavaScript

js 特点： 解释性 基于对象 事件驱动 跨平台性

js的组成部分

核心：ECMAscript

文档对象模型：DOM (全称：document object model)

浏览器对象模型：BOM (全称: browser object model)

js在哪使用： 在body中使用：

全局变量 和 局部变量

1）全局变量：

在函数外面定义变量，在整个javascript中都可以被访问到。

2）局部变量：

在函数内部定义的变量，只能被函数内部使用。

全局变量 和 局部变量的寿命

1）全局变量在网页关闭后，结束其生命

2）局部变量在函数调用完后，结束其生命

弹出框：

1）alert();   表示弹出框

2）confirm(); 表示确认框 康 fang mu

3）prompt(); 表示输入框 po 让 破 t

document.write对html内容输出

1）使用window.onload时，在head中的document.write输出的内容会覆盖掉body里面的所有内容(只用与document.write中)

2）在不适用window.onload时，head、body中的document.write共存。

document  da q men de

控制台输出内容：

通过console.log()

康 搜

获取表单值 和 非表单值

1）value    wai liu 表示获取表单值

2）innerText / innerHTML    表示获取非表单值

innerHTML 和 innerText的相同点和不同点

1）相同点：都可以获取纯文本内容

2）不同点：

innerText只能获取纯文本内容(不包括HTML标签)

innerHTML能获取纯文本内容(包括HTML标签)

数据类型：

数值(number)类型：(包含整数和浮点数)

布尔(boolean)类型：(只有true和false两个值  【两个值小写】)

字符串(string)类型：(表示一个字符序列，必须使用单引号（''）或双引 号（""）括起来)

空(null)类型：(表名某个变量的值为空，只有一个值为：null【小写】)

未定义(undefined)类型：(用来确定一个已经创建但还没有赋初值的变量， 只有一个值为：undefined   【小写)】

对象(object)类型：(该类型的值为对象，对象由一些列属性（变量）和方法（函数）的集合，访问它们时用：.  (英文点号))

数组(Array)类型：(一系列的变量组成)

函数(function)类型：(包含一段可执行的代码)

数据类型的分类：

1）基本数据类型：

数值(number)类型、nan bo

布尔(boolean)类型、bo li

字符串(string)类型、

空(null)类型   na

未定义(undefined)类型、un di fan de

2）复合数据类型：

对象(object)类型  

数组(Array)类型、 e run

函数(function)类型 fang te shen

typeof检测类型的方式

1）typeof 数据类型

例如：console.log(typeof '123')

例如：

var str = '123';

console.log(typeof str)

2）typeof(数据类型)

例如：console.log(typeof('123'))

例如：

var str = '123';

console.log(typeof(str))

数组的创建：

1) var arr = [1,2,3,4]

2) var arr = new Array(1,2,3,4)

数组的下标从 0 开始

获取数组的内容：arr[下标]

数组的增、删、查、改

例如：

var arr = [1,2,3]

增：arr[3] = 4;

删：arr[2] = null;

查：arr[1];

改：arr[1] = 'a';

对象的创建方式

1） var obj = {

    name: "Jone",

    age: 18

   }

  

2）var obj1 = new Object({

   name: "Tome",

   age: 20

   })

   

对象的获取方式：

1） obj.name

2） obj['name']

对象数据类型的增、删、查、改

例如：var obj = {

name: "Tom",

age: 18,

ph: 12345

}

增：obj.sex = "women"

删：obj.ph = null;

查：obj.ph / obj['ph']

改：obj.name = "Jone"

关于 undefined 和 null之间的介绍：

1） undefined 表示未定义，一般一个变量声明，但没有赋值。会出现 undefined

1. null  表示空对象，一般是为变量占位使用。

数据类型的转换

1）Number() 表示转为数值类型

例如：

Number('123');

Number(true / false)

// 转化非数字   跟number一样  在前面加一个加号更简约

alert( +true ); // 1

alert( +"" );   // 0

这是自己总结的：

在算术函数和表达式中，会自动进行 number 类型转换。

比如，当把除法 / 用于非 number 类型：

alert( "6" / "2" ); // 3, string 类型的值被自动转换成 number 类型后 进行计算

2）String() / toString() 表示转为字符串类型

例如：

var num = 123;

num.toString(); / String(num);

var bool = true / false;

bool.toString(); / String(bool)

这是自己总结的：

当我们从 string 类型源（如文本表单）中读取一个值，但期望输入一个数字时，通常需要进行显式转换。

如果该字符串不是一个有效的数字，转换的结果会是 NaN。例如：

let age = Number("an arbitrary string instead of a number");

alert(age); // NaN，转换失败

3）Boolean() 表示转为布尔类型

例如：

var str = 'hello world';

Boolean(str);

var num = 123;

Boolean(num);

整数转换

parseInt(12.96);    //转成整数

parseFloat(12);    //转成浮点数

注释：parseFloat() 函数可解析一个字符串，并返回一个浮点数。

Math.round(12.36);    //四舍五入

Math.floor(12.72);    //向下取整

Math.ceil(12.32);     //向上取整

Math.random()生成[0,1)的数

Math.random()*5生成[0,5)的数

parseInt(Math.random()*5)生成的都是[0,4] 的随机整数

随机函数的封装

// 1)函数的定义

function toFree(n,m){

         return parseInt(Math.random()*(m-n)+n);

    }

// 2)函数的调用

toFree(11,15)----取值范围（11-14）不包括最后一位数字

运算符：

1）算术运算符

+（加）、-（减）、*（乘)、/（除）

%（取余）、++（累加）、--（累减）

取余(%)

模 2 结果两种 0 / 1

模 3 结果三种 0 / 1 /2

i ++ 和 ++ i 的区别：

i ++ 先赋值，在运算

++ i 先运算，在赋值

2）赋值运算符

=（赋值）、+=（加赋值）、-=（减赋值）

*=（乘赋值）、/=（除赋值）、%=（取余赋值）

3）比较运算符