基本介绍
前端有HTML,CSS,JS,HTML负责的便是基本的元素内容,CSS在基础上对HTML做一些修饰,确保网页是看起来舒适的,而涉及到一些交互,行为上的东西,便交由JS来进行实现。
HELLO WORLD
内部标签样式
<script>
alert('hello world');
</script>
外部引入
在文件夹中添加个test.js,那么对其进行外部引入如下所示
//test.js文件中的内容:
alert('hello,world');
//html文件中内容:
<script src="js/test.js">
</script>
测试代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/test.js">
</script>
</head>
<body>
</body>
</html>
基本语法
<script>
// 变量定义
var num = 1;
var name = "hello";
// 条件控制
if(num > 60 && num <70){
alert("60-70");
}else if(num >= 70 && num < 80){
alert("70-80");
}else{
alert("other");
}
//输出到F12控制台
console.log("hello world");
/*
多行注释
*/
</script>
数据类型--基本介绍
- js不区分小数和整数,Number
123 //整数
123.1 //浮点数
1.23e3// 科学计数法
-99 // 负数
NaN // not a number
Infinity //表示无限大
'abc'//字符串
"abc"
true // BOOL类型
false
&& || ! //与或非
> < = >= <=
== //等于(类型不一样,但是数值一样也会判断为True)
=== //绝对等于(类型一样,值一样,结果为True)
TIPS1:NaN===NaN,这个与所有的数值都不相等,包括自己。可以通过isNaN(NaN)进行判断。
- 浮点数问题
TIPS2:尽量避免使用浮点数进行运算,存在精度问题。通过两数相减获取到绝对值判断绝对值是否小于0.00000001进行判断。
- null与undefined
- null 空
- undefined 没有定义
- 数组 java的数组必须是相同类型的对象,但是JS中不需要。
//保证代码的可读性尽量使用[]
var arr = [1,2,3,4,"hello"];
//也可以通过下面这种方式进行创建
new Array(1,2,3,4,"hello");
//console.log(arr[0]) => 1
//console.log(arr[5]) => undefined
//取数组下表,如果越界了就会undefined
- 对象
var person = {
name:"hello",
age:12,
arr:[1,2,3]
}
取对象的值
person.name
> "hello"
person.age
> 12
严格检查模式strict
<script>
'use strict';//严格检查模式,防止JavaScript的随意性产生的一些问题。
i1 = 1;
var i2 = 1;
//var => 全局变量 let =>局部变量
</script>