JavaScript简单总结

最新推荐文章于 2022-08-01 17:09:14 发布

熊猫不想

最新推荐文章于 2022-08-01 17:09:14 发布

阅读量469

点赞数 2

本文链接：https://blog.csdn.net/qq_51501328/article/details/117073269

版权

笔记同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

前端0

3 篇文章 0 订阅

订阅专栏

前言简单了解C语言
这里在js和C语言相似的为写上；只是为了大家能够简单了解一下javaScript

js的引入方式

外部引入
内部引入、
元素事件（在那个地方用到js的内容但是没有js的标签）。
document.write()表示页面输入的内容
alert()表示弹出对话框
var X=10;var声明符
再js中变量的的声明都有var声明

数据类型：

基本数据类型、引用数据类型
空值null表示系统为分配空间
运算规则：
数字+数字=数字
字符串+字符串=字符串
字符串+数字=字符串
条件运算符：条件？表达式1：表达式2
数据类型转换
隐试转换、显示转换
Number()数字型字符串转换为数字若字符串不是纯数字则会打出出NaN
parseI(大写的i)nt()首字母为数字的任意字符串的数字；会提取整数部分若字符串首字母不是数字则会打出出NaN（但首字母是+或者-不会）
parseFloat()不仅可以提取整数部分还能提取小数部分若字符串首字母不是数字则会打出出NaN（但首字母是+或者-不会）
数字转化为字符串
与字符串相加、toString()在实际开发中很少用到toString()函数一般是和一个字符串相加
转移符号
'英文单引号、"英文双引号、\n换行符
对于\n一般用于对话框文本换行，如果这里使用
就无法实现了

注释

\ 单行注释
* *\ 多行注释
流程控制：
顺序结构、选择结构、循环结构

函数

function 函数名(){···········}
函数定义时不论有无返回值都要用function
有返回值在{····}用return 返回值;
全局变量和局部变量
函数调用：
直接调用
表达式调用
超链接调用
语法：<a href="javascript:函数名"></a>
事件调用
js的内置函数
isFinite()判断某一个数是否是一个有限值
isNaN()判断一个数是否是NaN值
escape()对字符串进行编码
unescape()对字符串进行解码
eval()把一个字符串当作一个表达式来执行
字符串对象：
内置对象、自定义对象
字符串对象：String
数组对象**：Array**
日期对象：Date
数值对象：Math
字符串长度语法:字符串名.length
大写转小写语法toLowerCase(······)
小写转大写语法**:toUpperCase(·····)**
获取某一个字符串语法:字符串名.charAt(n) 字符串第n+1个字符
截取字符串语法:字符串名.substring(start,end)开始是start结束为end-1
替换字符串语法:字符串名.replace(原字符串，替换字符串)/字符串名.replace(正则表达式，替换表达式)
str.replace(/lost/g,“new”)换掉str上的所有lost
str.replace(“lost”,“new”)只会替换第一个lost
分割字符串语法:字符串名.split(“分割符”)
说明：将字符串分割为数组
检索字符串的位置
字符串名.indexOf(指定字符串) 某个字符串首次出现的位置
字符串名.lastIndexOf(指定字符串) 某个字符串最后出现的位置
但是指定字符串中无返回值为-1

数组对象

数组的创建语法:var 数组名=new Array(元素1，元素2······元素n) 完整形式
语法:var 数组名=[元素1，元素2············元素n] 简写形式
数组的获取
数组的赋值
获取数组长度语法:数组名.length
说明：数组内容为无，则长度为0
js中数组可以储存不同的数类型，但在实际开发中很少用到
截取数组某部分
语法:数组名.slice(start,end);也可数组名.slice(start);结束为数组的最后
添加数组元素
语法:数组名.unshift(新元素1，新元素2················，新元素n)
说明:表示在数组开头添加的新元素
语法:数组名.push(新元素1，新元素2······················，新元素n)
说明:表示在数组结尾添加的新元素
由于数组的长度未知，则Push函数的重要性体现出来
删除数组元素
语法:数组名.shift（）
说明:删除数组第一个元素
语法:数组名.pop()
说明:删除数组最后一个元素
比较数组长度
语法:数组名.sort(函数名)
说明:"函数名"是定义数组元素排序的函数的名称
可用于排序
数组名.join(separator);将数组放到一个字符串中并且使用separator(自己选的分隔元素的符号)
颠倒数组顺序
语法:数组名.reverse();
说明:将数组中的元素反过来。
将数组元素连接为字符串
语法:数组名.join(“连接符”)
说明:空格也算连接符，一般会采用英文逗号作为连接符；默认为，
时间对象
语法:var 日期对象名=new Date();
说明:1) 用var声明一个变量 2)使用new关键字，新建一个Date日期对象 3)将新建的日期对象赋值给变量
创建一个日期对象，必须使用new关键字。其中Date对象的方法有很多，其中主要分两大类：getXxx()获取时间和setXxx()设置时间
getXxx():getFullYear()获取年份，取值为4位数，getMonth()获取月份，取值为0到1的整数（所以要加1因为实际为1~12）
getDate()获取日数取值为1到31的整数，getHours()获取小时数取值为0到23（实际要加1）getMinutes()获取分钟数0到59getSeconds()获取秒数0~59
setXxx():set FullYear()设置年月日 Month()设置月日 Date()设置日 Hours设置时、分、秒、毫秒
Minutes()设置分、秒、毫秒 Seconds()设置秒、毫秒
获取年月日例子：
var time01=new Date();
var timeDate=time01.getDate();
var timeMonth=time01.getMonth();
var timeYear=time01.getFullYear();
document.write(“今天是”+timeYear+“年”+timeMonth+“月”+timeDate+“日”);
设置年月日
语法:
1)时间对象.setFullYear(year,month,day)
说明:year是必选参数是一个四位数而之后的两个参数是可选参数
2时间对象.setMonth(month,day)
说明：Month是必选参数
3)时间对象.setDate(day)
说明：day是必选参数
获取时间例子：
var time02=new Date();
var myHours=time02.getHours();
var myMinutes=time02.getMinutes();
var mySeconds=time02.getSeconds();
document.write(“当前时间是”+myHours+“时”+myMinutes+“分”+mySeconds+“秒”);
设置时间
语法：
1）时间对象.setHours(hour,min,sec,millisec)
说明:hour是必选参数millisec是毫秒，sec是秒
2）时间对象.setMinutes(min,sec,millisec)
说明:min是必选参数
3）时间对象.setSeconds(sec,millisec)
说明:sec是必选参数
获取星期几
语法:时间对象.getDay();
例子:document.write(“今天是星期”+time02.getDay());
说明：0表示星期日；在开发中可以做一个数组的下标来输出星期几，而数组在对应的下标储存对应的参数及星期几
数学对象
属性：Pl圆周率、LN2 2的自然对数、LN10 10的自然对数、LOG2E 以2为底的e的对数、LOG10E以10为底的e的对数、SORT2 2的平方根、SPRT_2 2的平方数的倒数
在实际开发中推荐：“度数*Math.PI/180”表示弧度

Math对象的方法
最值：Math.max/min(a,b,c,d，·····n)
说明：返回值为其中最值要
例子：
var a=Math.max(3,5,6,4,9,4);
document.write(“最大值”+a);
三角函数：sin(x)/cos(x)/tan(x)
反三角函数：asin(x)/acos(x)/atan/或atan2(x)

	说明：	1）atan()和atan2()是不一样的，atan2()能够精确判断角度对应哪一个角而atan()却不能。因此，在高级动画开发中，我们大多数使用的是atan2(),基本不用atan()
		2）对于反三角函数除了atan2()之外，其它用的很少，较常用的是三角函数（sin,cos,tan）
		3）对于度数来说用"度数的数值*Math.PI/180"

取整运算
向下取整：返回小于或等于指定数的"最近的那个整数"。
语法：Math.floor(x)
例子：-2.1》》-3；3.1》》3
向上取整：返回大于或等于指定数的"最近的那个整数"
语法：Math.ceil(x)
例子：-2.1》》-2；3.1》》4
document.write(Math.ceil(3.1)+"
"+Math.floor(3.1)+"
"+Math.ceil(-2.1)+"
"+Math.floor(-2.1));
生成随机数
js中random()方法用来生成0~1[0,1)的随机值
语法：Math.random()
随机生成指定区间的随机数：Math.random()*x+y [y,x+y)
随机生成指定范围的整数：1)Math.floor(Math.random()*x+y) 因为x+y不到则需要加一在最后 2)Math.ceil(Math.random()*x+y)

DOM基础

全称：文档对象模型，由W3C定义的一个标准；DOM操作，可以简单地理解成元素操做
DOM结构：采取的是："树形结构"，用"树节点"的形式来表示页面中的每一个元素
	解析：每一个元素都是一个节点，而一个节点就是一个对象；则我们在操作元素时，其实就是把这个元素看成一个对象，然后使用这个对象的属性和方法来进行相关操作（可以理解出DOM的重要）
节点类型：DOM节点有12中类型。常见的有三种1）元素节点2）属性节点3）文本节点
	例子：<div id="id1">Hello World</div><div>元素有三个节点全部是一个元素节点	id值相当于一个属性标签	Hello World相当于一个文本节点
	注意：元素和节点是不一样的概念，节点是包括元素的
	在js中我们使用nodeType属性来判断一个节点的类型
		不同节点类型的属性值：节点类型 nodeType值	元素节点 1	属性节点 2	文本节点 3
			说明：1）一个元素一个节点	2）属性节点和文本节点看起来像元素节点的一部分，但实际上是各自独立的，并不属于元素节点。3）只有元素节点可以拥有子节点
获取元素：获取"元素节点（不是属性节点和文本节点）"
	说明：对于一个页面，我们想要对某个元素进行操作，就必须通过一定的方式来获取该元素，获取该元素后，才能对齐进行操作；这和CSS的选择器很相似但是各自有自己的操作方式
	重点：6中获取元素多要学透彻
		getElementByld()
			通过id来选中元素
			语法：document.getElementByld("id名")
				例子：window.onload=function(){
					var divc=document.getElementById("id1");
					divc.style.color="red";
					}
					····································
					<div id="id1">
						javaScript
					</div>

		getElementsByTagName()
		getElementsByClassName()
		querySelector()和querySelectorAll()
		getElementsByName()
		document.title和document.body

		
		报错处理：如果没有定义的参数使用的打印语句直接失效，在开发中出现打错字母时发生的