javaEE-11.javaScript入门
目录
一.什么是javaScript
二.快速实现
三.JS引入方式
1.行内引入:
2.内部引入:
3.外部引入:
四.基础语法
1.变量
变量命名规则:
2.数据类型
3.运算符
五.JS对象
1.数组
创建数组:
2.操作数组
3.函数
函数注意事项:
函数参数:
4.对象
1.使用字面量 创建对象:
2.使用new Object()创建对象
3.使用 构造函数 创建对象
一.什么是javaScript
JavaScript(简称JS),是⼀个脚本语⾔,解释型或即时编译型的编程语⾔.
javaScript和java是不存在任何关系的.
有关javaScript的发展史:
Javascript诞生记 - 阮一峰的网络日志
JS和CSS和html的关系:
html相当于网页的骨架;
CSS相当于对网页进行填充,修饰
JS是赋予网页特有的功能,行为
二.快速实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
alert("hello");
</script>
</body>
</html>运行浏览器:
alert:在弹窗中显示.
三.JS引入方式
1.行内引入:
直接在html标签内使用.
点击按钮时,弹窗显示注册成功.
这种方式容易产生大量的冗余代码,不⽅便后期的维护，所以不常⽤.
2.内部引入:
定义script标签,代码写在<script></script>标签中.
<script></script>标签可以放在代码任意位置,一般放在body中.
⾏内样式,只适合于写简单样式.只针对某个标签⽣效.缺点是不能写太复杂的jS.
3.外部引入:
定义script标签,通过src属性,引入外部 .js文件.
外部样式，html和js实现了完全的分离,企业开发常⽤⽅式
四.基础语法
1.变量
创建变量/声明变量/变量初始化:
var 变量名=内容; 或 len 变量名=内容;
这两个用法差不多相同,具体区别暂不讨论.
const 变量名=内容;
通过const创建的变量,初始化后,内容不能修改.
JS是一门动态若类型的语言:
动态:变量可以存放不同类型的值:
弱类型:随着程序的执行,变量中值的类型可以变化:
变量命名规则:
1.变量名的组成字符可以是数字,字母,下划线_,美元符$
2.数字不能开头.
3.建议使用驼峰命名法.
2.数据类型
虽然js是弱数据类型的语⾔，但是js中也存在数据类型，js中的数据类型分为：原始类型 和 引⽤类 型，具体有如下类型
| 数据类型 | 描述 |
| number | 数字,不区分整数和小数 |
| string | 字符串 字符串字⾯值需要使⽤引号引起来,单引号双引号均可 |
| boolean | 布尔类型,true为真,false为假 |
| undefined | 表示变量未初始化，只有唯⼀的值 undefined |
使⽤typeof函数可以返回变量的数据类型,通过浏览器的控制台查看.
3.运算符
JS中的运算符和java中的用法基本相同
==和===的区别:
==仅用于判断内容是否相等;
===判断时 包含类型的判断.
五.JS对象
1.数组
创建数组:
1.使用new关键字创建数组:
var a = new Array();
2.使用字面常量创建数组:
数组中的内容称为元素.
JS中的数组元素不要求类型相同.
2.操作数组
1>.读:
通过数组下标的方式访问数组元素.
2>.增
通过数组下标新增元素,或者通过push追加元素.
可以进行隔空追加,对指定1数组下标追加.
3>.改
通过数组下标修改数组元素，
控制台输出结果:
注意
1. 如果下标超出范围读取元素,则结果为undefined
2. 不要给数组名直接赋值,此时数组中的所有元素都没了.
3.函数
语法格式:
function 函数名(形参列表){
函数体;
return 返回值;
}
函数调用:
函数名(实参列表);//无返回值
var 返回值 = 函数名(实参列表);//有返回值
函数注意事项:
函数定义并不会执⾏函数体内容,必须要调⽤才会执⾏.调⽤⼏次就会执⾏⼏次.
调⽤函数的时候进⼊函数内部执⾏,函数结束时回到调⽤位置继续执⾏.
函数的定义和调⽤的先后顺序没有要求.(这⼀点和变量不同,变量必须先定义再使⽤)
函数参数:
形参个数和实参个数可以不匹配,但是实际开发⼀般要求形参和实参个数要匹配.
1. 如果实参个数⽐形参个数多,则多出的参数不参与函数运算
1. 如果实参个数⽐形参个数少,则此时多出来的形参值为 undefined
函数表达式:
var 变量名 = function(){
函数体;
return 返回值;
}
此时形如 function() { } 这样的写法定义了⼀个匿名函数, 然后将这个匿名函数⽤⼀个变量来表 ⽰. 后⾯就可以通过这个 add 变量来调⽤函数了.
4.对象
js中的 数值,字符串,布尔值,数组,函数都是对象,每个对象中包含若干个属性和方法.
属性:对象的特征,
方法:对象的行为.
1.使用字面量 创建对象:
使⽤ { }创建对象
• 属性和⽅法使⽤键值对的形式来组织.
• 键值对之间使⽤ , 分割.最后⼀个属性后⾯的,可有可⽆
• 键和值之间使⽤ : 分割.
• ⽅法的值是⼀个匿名函数.
使用对象的属性和方法:
2.使用new Object()创建对象
这种创建对象方法和创建数组方法类似.
3.使用 构造函数 创建对象
语法:
function 构造函数名(参数列表){
this.属性名=值;
this.方法名=function(){}
.....
}
调用:
var 变量名= new 构造函数名(实参列表);
注意:
• 在构造函数内部使⽤this关键字来表⽰当前正在构建的对象.
• 构造函数的函数名⾸字⺟⼀般是⼤写的.
• 构造函数的函数名可以是名词.
• 构造函数不需要 return
• 创建对象的时候必须使⽤ new 关键字.