JavaScript基础

JavaScript基础

1. JavaScript的基本概念

1. ECMA 是 欧洲计算机制造商协会
2. ECMA-262 是 ECMA下辖的一个专门制定网页脚本语言规范的一个分支机构
3. ECMAScript 是具体的标准规范，简称 ES ，从2015年开始，以后每年退出一个新版本，以年份命名 ES6 也称ES2015
4. JavaScript 只是 ES 这个标准的具体实现
5. JavaScript ：一门实现人机交互和前后端交互，运行在浏览器端的脚本语言

2. JavaScript书写位置

1. 行内元素

直接将js写入行内进行运行

<input text="button" value="测试" onclick="alert('进行测试')">

2. 内部样式

将js写在html页面中，需要使用包裹起来

<script>"将js代码写在这里"</script>

3. 外链

将js写在另一个以.js为后缀的文件中

<script src="这里写需要引入的.js文件的地址"></script>

3. JS弹出层和JS内容输出

//提示框
alert("使用此代码进行提示框的弹出，可以在其中加入一些需要提示的内容")

//输入框
prompt("输入框，在页面中弹出一个输入框，用户可以在其中输入一些内容")

//确认框
confirm("使用此代码可以对用户进行询问，是否确定...")

//在浏览器页面中输出
document.write("使用此代码可以在浏览器页面中展示一些内容，，原样输出的内容需要用双引号包裹")

//在控制台中输出，一般程序员在进行调试时使用
console.log("随便写了啦")

4. 变量

1) 变量的含义

//变量：用来保存一些可变的值的一个写法，变量是需要提前被定义的
//如果把一个值写为确定的值（不用变量），那么凡是设计到这个值的地方需要改的话，那么很多代码都要去进行变动，所以更显出变量的重要性

//首先，我们要先定义一个变量，如：
var age=21;
//随后输出看一下
document.write("我的年龄是" + age + "岁");
document.write("....年龄" + (age + 2) + "岁")；
document.write("...年龄" + (age - 2) + "岁")；

2) 变量名的命名规则

//变量名的命名规范 一般也需要由语义  由数字、字母、下划线和$符号组成，同时不能以数字开头，否则就会报错
var a = 1;
var a_1 = 2;
var _b = 2;
var $ = 4;//以上都不会报错
var 1a = 5;//这个就会报错

//关键字：ES规范中定义的由特殊含义的一些单词（这些也不可以用作变量命名）
var var = 1;//这个也会报错

//保留字：ES中定义过的，但还未使用到的一些单词（也不可以用作变量命名）

3) 其他

//其他的变量相关得到常见点
 var a = 1,
     b = 2,
     c = 3;//一次声明多个变量

var a = (b = c = 1);//不报错，但不推荐使用
b = 1;//不写关键字，也不推荐

5. 常量

//常量：常量是用来保存一成不变的值，但是要事先进行声明
const id = 00001;//1.必须一成不变
id = 2;//2.值不能够改变

6. 值的类型

//基本数据类型

//1. number（数值）
//正数、负数、小数、0b（二进制）、0o（八进制）、0x（十六进制）、NaN ; 等等
console.log(NaN);//当一个运算的无法用一个具体的数字来表示，但是结果的值类型又必须是数值类型时，就会出现NaN

//2. string（字符串）
console.log("你");
conlose.log('好');
console.log(`吗`);//ES6+里面的新增语法

var uname = "杰斯";
console.log(uname + ",你好吗？");

//反引号，模板字符串
console.log(`${uname},你好吗？`);

//3. boolean（布尔类型）
//只有true和false两个值，一般和判断条件结合一起使用

//4. undefined
//只有undefined一个值，当声明变量未初始化时，会取到undefined
var test;
console.log(test);//输出undefined

//null
//1. 声明了一个变量，不知道该赋什么值，还需要进行初始化，直接给null
//2. 一个变量里原来存有值，但是想把原来的值清掉，通过赋值为null清掉

7. 运算符

1) 算术运算符

//算术运算符 + - * / %
console.log(a + b);//加
console.log(a - b);//减
console.log(a * b);//乘
console.log(a / b);//除
console.log(a % b);//取余

###　２)赋值运算符

//赋值运算符 = += -= *= /= %=
//当赋值符号左右两边的变量相等时可以简写
var a = 10;
//a = a + 20;//对这个简写
a += 20;//得到这个
console.log( a );
//其他赋值运算符以此类推

3) 比较运算符

//比较运算符 > >= < <= == != === !==
//如果给定的两个值的实际大小和表达式里用的符号一样，结果为true，否则为false
console.log(20 > 10);//true
console.log(20 < 10);//false

8. 类型转换

//强制转换 需要使用转型方法进行操作

//1. 将其他类型转换为数值 Number()
//1.1 字符串转数值
console.log(Number("1.11"));//纯数字字符串在转数值时会直接变成对应数字
console.log(Number("1a2"));//含字母或者特殊字符的字符串在转换数值时，会转变为NaN
console.log(Number(""));//空字符串转为0
console.log(Number(" "));//空格字符串转为0
//1.2 布尔转数值
console.log(Number(true));//1
console.log(Number(false));//0
//1.3 undefined
console.log(Number(undefined));//NaN
//1.4 null
console.log(Number(null));//0

//2.将其他类型转字符串 String(val) val.toString()
//2.1 就是在其他类型的值的外面直接加引号
console.log(String(123));//"120",依此类推

//3. 其他类型转布尔值
//3.1 数值转布尔值 0和NaN转false，其他都为true
//3.2 字符串转布尔值 空字符串转false，其余都为true
//3.3 undefined 和 null 转 false

//parseInt(val)
//1.取整
console.log(parseInt(10.99));//10
//2.取一个字符串里以整数开头的部分，如果一个字符串不是以整数开头，得到NaN
console.log(parseInt("a10"));//NaN
console.log(parseInt("10a"));//10
console.log(parseInt("10.11a"));//10
console.log(parseInt(""));//NaN
console.log(parseInt(" "));//NaN

//parseFloat
//可以取一个字符串里以小数开头的部分，如果一个字符串不是以数字开头，得到NaN
console.log(parseFloat("10.11abc"));
console.log(parseFloat("a10.11abc"));


//隐式转换
// 1. 什么时候会转 2. 转的结果是什么
// 1) 算术运算
// (1) + 如果参与运算的两个值，有一个为字符串，另外一个也会转成字符串，进行拼接，如果两个都是字符串，直接进行拼接
console.log(10 + "20"); //"1020"
console.log(true + "Abc"); //"trueAbc"
console.log("10" + "20"); //"1020"
//+  如果参与运算的两个都不是字符串，都会转成数值进行求和运算
console.log(true + 120); //121
console.log(true + undefined); // NaN

// (2) - * / %  无论参与运算的数是什么类型，统统转数值

// 2)比较运算
// (1) 如果两个值都是字符串，按位比较
console.log(12 > 2); //true
console.log("12" > "2"); //false 第一个字符串里的第一个字符和第二个字符串的第一个字符先比，如果满足给定的关系，继续往后继续比，如果不满足直接false
// (2) 不都是字符串 转数值
console.log(12 > "2"); // 12 > 2
g(true + undefined); // NaN

// (2) - * / %  无论参与运算的数是什么类型，统统转数值

// 2)比较运算
// (1) 如果两个值都是字符串，按位比较
console.log(12 > 2); //true
console.log("12" > "2"); //false 第一个字符串里的第一个字符和第二个字符串的第一个字符先比，如果满足给定的关系，继续往后继续比，如果不满足直接false
// (2) 不都是字符串 转数值
console.log(12 > "2"); // 12 > 2