1JavaScript引入方式
1 <!-- 行内式 -->
<button onclick="alert('helloworld!!')">点击</button>
2<!-- 嵌入式 -->
<script>
// 写js代码
alert("helloworld!!!")
</script>
3<!--
外部引入js文件
./ == 当前目录下
../ == 返回上一级目录
cd . cd ..
-->
<script src="./test.js"></script>
注释
// 单行注释
/**/ 多行注释
输出
<script>
// 1.窗口输出
alert("你好,世界");
// 2.控制台输出 --输出类型string
console.log("这是第一个输出")
// 3,prompt
prompt("请检查")
</script>
变量
<script>
// 变量
// 变量就是装东西的!!!就是存储数据的容器。我们可以通过变量名称获取数据修改数据!!!
// 1.变量的声明 var是关键词, variable
var age;
// 2.变量的赋值
age = 10;
// 3.变量的初始化
var age = 10;
console.log(age) --10
var age,name;
var age=10,name="kuaixiang";
</script>
变量命名
<script>
age这个变量名是随你定义的吗?
由字符、数字、下划线、美元符号组成
不能以数字开头
不能是关键字、保留字
严格区分大小写
变量的定义最好有一定的意义
var age = 10;
var Age = 20;
// var var = 20;
cosole.log(age);
var myTest = 10;
var a = 10;
var b = 20;
</script>
数字类型
<script>
var num1 = 10;
var num2 = 19;
var num3 = 0xa;
进制之间的转换
1.数字的范围
var num4 = ; 9007199254740992
isNaN == 判断是否不是一个数字
console.log(isNaN(num1)) // 打印出来false isNot a Number
</script>
字符串类型
<script>
在定义字符串时,单引号和双引号都是可以的!!!
var string1 = "中国加油";
var string2 = "武汉加油";
var string3 = '你好世界';
var string4 = "这是一个'激动人心'的时刻"
2.字符串的转义字符
\n == 换行
\\ == \
\" \'
\t tab 空格
\b 空格
var string4 = "这是一个\"激动人心\"的时刻"
var string5 = "锄禾日当午,\n汗滴禾下土"
console.log(string5)
3.字符串的长度
var string6 = "你是不是没有好好的学习?"
console.log(string6.length)
4.字符串拼接
var string7 = "床前明月光";
var string8 = "疑是地上霜";
console.log(string7 + "\n" +string8)
</script>
显示年龄的案例
<script>
// alert console.log prompt
注意 一个语句结束之后,最好加; javascript没有严格要求!!!
var age = prompt("请输入您的年龄");
var str = "您今年的年龄已经" + age + "岁了";
console.log(str)
</script>
布尔值
<script>
// 布尔值类型 true 和false
// true 真 false 假
var flag = false; // 布尔值类型
// 布尔值和数字相加时 true = 1;
console.log(flag + 1); --1
var str = flag + "前端课堂"
console.log(str)-- false前端课程
</script>
其他数据类型
<script>
// undefined 没有被定义的意思,这种一种数据类型!!!
var name;
console.log("你好" + name) //你好undefined
var age = null; // null也是一种数据类型!!!
console.log(111 + age) //111
console.log("你好" + age) //你好null
当数字和字符串进行拼接时,会将数字自动转换成字符串!!!
console.log(111 + "您好") // 111您好
当字符串数字和数字想减时,就会自动将字符串数字转换成数字!!!
console.log("110" - 9); //101
// NaN == not a number
console.log("你好" - 10); //NaN
</script>
检测数据类型
<script>
var str = "单身快乐";
var a;
var b = null;
// typeof 使用方法 typeof 变量名称
console.log(typeof str) //string
console.log(typeof 110) // number
console.log(typeof true) // boolean
console.log(typeof a) // undefined
console.log(typeof null) // object
</script>
字面量
<script>
console.log(18)
console.log("123123");
console.log(true)
console.log(undefined)
</script>
转换成字符串型
script>
// string number boolean object undefined
// var num = 10;
var num = 10;
// num转换成了数字,隐式转换
console.log("您的数字为:" + num);
// 显示转换
var num = 10;
// to ... string
console.log(num.toString())
console.log(String(num))
</script>
转换成数字类型
<script>
// 1.parseInt(变量) --整型
// 这个函数不仅可以转换字符串,而且转换出来的是一个整数
console.log(parseInt('3.1415926')) --3
console.log(parseInt('3.9415926')) --3
console.log(parseInt("110,你好!!!")) --110
console.log(parseInt("你好,100!!!")) // NaN
// 2.parseFloat(变量) // -- 浮点型 可以将字符串类型转数字
// float: 浮点
console.log(parseFloat('3.1415926')) --3.1415926
console.log(parseFloat('120px')); --120
console.log(parseFloat('你好,120')); // NaN
var sum=parseFloat(0.1)
var sum2=parseFloat(0.2)
console.log(sum+sum2); // 输出0.30000000000000004 不等于0.3 会失精度
原理:现将十进制的数转化为二进制数 二进制最多位数为53位 超出的截去 //失去精度
再将二进制数相加转化为十进制数
// 3.利用Number函数
var str = "123"
console.log(Number(str)) --123
// 4. - 可以隐式转换字符串 /
console.log('120' - 10); --110
console.log('123' * 1); --123
// 5.布尔类型转换成数字
var flag = false;
console.log(Number(flag)) --0
</script>
计算年龄
<script>
// 从输入框中得到一个年龄
var year = prompt("请输入您的出生年龄");
console.log(typeof year)
var age = 2020 - year;
console.log("你的今年的年龄是:" + age);
</script>
加法计算器
<script>
// 从输入框中得到一个年龄
var year = prompt("请输入您的出生年龄");
console.log(typeof year) --string
var age = 2020 - year;
console.log("你的今年的年龄是:" + age);
</script>
布尔值案例
<script>
// var flag = prompt("请输入您要输入的bool值:");
// console.log(flag)
// console.log(Boolean(flag))
// 在布尔类型转换的时候,如果不是0,'',NaN,null,undefined,其他转换出来的都是true
console.log(Boolean(1)) --true
</script>
对于 null 来说,虽然它是基本类型,但是会显示 object,这是一个存在很久了的 Bug
Number()和parseInt()不同
都可以用来进行数字的转换
区别在于,当转换的内容包含非数字的时候,Number() 会返回NaN(Not a Number)
parseInt() 要看情况,如果以数字开头,就会返回开头的合法数字部分,如果以非数字开头,则返回NaN