基本概念:
JavaScript:是一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。 [3]
Javascript脚本语言同其他语言一样,有它自身的基本数据类型,表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方,表达式则可以完成较复杂的信息处理。
JavaScript的环境
运行环境: 浏览器
开发环境:记事本工具即可(注意记事本写完之后需要将后缀名改为html),sublime、vs code hbuilder、webstream
程序实现
1.第一个简单的:hello world
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/index.js" ></script>
<script>
alert("hello world, javascript, I coming~~~");
</script>
</head>
<body>
</body>
</html>
2.JavaScript的注释
// 单行注释
/* 多行注释 */
/*! 文档注释 */
3.js的几种常见写法
1、 写在标签上(不推荐)
<body>
<button onclick="alert('是我是我是我是我是我是我');">点击一下,你就知道</button>
</body>
2、写在script标签中(不推荐)
<script>
// JavaScript 代码
alert("I coming~~~");
document.write("朕聪哥");
</script>
3、写在独立的.js文件中,使用script引入(推荐)
4、对话框
alert(字符串); // 警告框
确认框:var res = confirm("您要确定吗?");
输入框:var age = prompt("请输入您的年龄:", "16");(括号中的)
-----------------------------------------------------------------------------------------
5、JavaScript的作用
1、数据校验
2、网页特效
3、数据交互(ajax)
6、变量
定义:之前在Java中:数据类型 变量名称 = 变量值; 注意:java、c等等语言都是强数据类型语言JavaScript是一门弱数据类型的编程,所以,定义变量时不需要申明变量类型 var 变量名称 = 变量值;
变量的命名规则:跟Java保持一致
- 名称可包含字母、数字、下划线和美元符号
- 名称必须以字母开头
- 名称也可以 $ 和 _ 开头(但是在本教程中我们不会这么做)
- 名称对大小写敏感(y 和 Y 是不同的变量)
- 保留字(比如 JavaScript 的关键词)无法用作变量名称
7、数据类型
JavaScript的数据类型
基本数据类型
数值型 number
布尔型 boolean
字符串 string
null 空
undefined 未定义
NaN (not a number)不是数字
引用数据类型 Object
8、常见的运算符
运算符 | 描述 |
---|---|
+ | 加法 |
- | 减法 |
* | 乘法 |
/ | 除法 |
% | 系数 |
++ | 递加 |
-- | 递减 |
JavaScript 赋值运算符
赋值运算符向 JavaScript 变量赋值。
运算符 | 例子 | 等同于 |
---|---|---|
= | x = y | x = y |
+= | x += y | x = x + y |
-= | x -= y | x = x - y |
*= | x *= y | x = x * y |
/= | x /= y | x = x / y |
%= | x %= y | x = x % y |
JavaScript 比较运算符
运算符 | 描述 |
---|---|
== | 等于 |
=== | 等值等型 |
!= | 不相等 |
!== | 不等值或不等型 |
> | 大于 |
< | 小于 |
>= | 大于或等于 |
<= | 小于或等于 |
? | 三元运算符 |
注释:JS 比较这一章中完整描述了比较运算符。
JavaScript 逻辑运算符
运算符 | 描述 |
---|---|
&& | 逻辑与 |
|| | 逻辑或 |
! | 逻辑非 |
注释:JS 比较这一章中完整描述了逻辑运算符。
JavaScript 类型运算符
运算符 | 描述 |
---|---|
typeof | 返回变量的类型。 |
instanceof | 返回 true,如果对象是对象类型的实例。 |
注释:JS 类型转换这一章完整描述了类型运算符。
JavaScript 位运算符
位运算符处理 32 位数。
该运算中的任何数值运算数都会被转换为 32 位的数。结果会被转换回 JavaScript 数。
运算符 | 描述 | 例子 | 等同于 | 结果 | 十进制 |
---|---|---|---|---|---|
& | 与 | 5 & 1 | 0101 & 0001 | 0001 | 1 |
| | 或 | 5 | 1 | 0101 | 0001 | 0101 | 5 |
~ | 非 | ~ 5 | ~0101 | 1010 | 10 |
^ | 异或 | 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 |
<< | 零填充左位移 | 5 << 1 | 0101 << 1 | 1010 | 10 |
>> | 有符号右位移 | 5 >> 1 | 0101 >> 1 | 0010 | 2 |
>>> | 零填充右位移 | 5 >>> 1 | 0101 >>> 1 | 0010 | 2 |
9、三大流程:
1.顺序
代码从左到右,从上而下执行的。
2.选择(分支)
单分支 双分支 三分支
3.循环
10、函数
function 函数名称([参数列表]) {
}
function showInfo(name, age) {
alert("这个是一个函数")
alert("我的名字叫"+ name +", 今年"+ age +"岁了");
return "这个是一个返回值";
}
let res = showInfo("李聪聪", 18);
alert(res)
11、字符串对象
三种得到字符串的方式
1、 var s = '字符串'
2、 var s = new String("字符串");
3、 var s = String("字符串");
12、数学对象
Math
<script>
console.info(Math.E)
console.info(Math.PI)
console.info(Math.ceil(3.1))
console.info(Math.floor(3.9))
console.info(Math.abs(-9))
console.info(Math.pow(2, 8))
console.info(Math.random())
var ran = Math.floor(Math.random() * 100)
console.info(ran)
var a = "1213我是中国人"
alert(parseInt(a))
console.log(Math.round(5.4))
</script>
13、数组
var arr = [1, 3, true, [1], false];
console.info(arr)
var arr = new Array();
arr[0] = "I'm licong";
arr[1] = "woshilicong"
console.info(arr);
var arr = new Array(1, 2, 3, 4, 5, 10);
两种循环方式:
for (let i = 0; i < arr.length; i++) {
console.info(arr[i]);
}
for (var i in arr) {
console.info(arr[i]);
}
14、日期对象
var data = new Date();
console.info(data);
console.info(data.getTime())
var year = data.getFullYear();
var mon = data.getMonth()
//获取当前为那一日
var day = data.getDate();
console.info(day)
// 星期数
console.info(data.getDay())
var hours = data.getHours();
//获取当先为几点
console.info(hours)
var min = data.getMinutes();
//获取当前的分钟数
console.info(min)
var s = data.getSeconds();
//获取当前的秒数
console.info(s)
var ss = data.getMilliseconds()
console.info(ss)