JavaScript学习总结

JavaScript学习总结

JavaScript是由ECAMScript+DOM+BOM组成，ECMAScript 是语言基础标准，用来描述如何使用这门语言来编写程序。DOM为文档对象模型，使用JavaScript操作HTML，核心为document。BOM为浏览器对象模型，浏览器窗口进行交互对象，核心为window。

在HTML页面中插入js代码需要使用 script标签，需要注意的是该标签要成对出现。在编写js代码时一行的结束就被认定为语句的结束，通常在结尾加上一个分号";"来表示语句的结束。

JavaScript的注释

 单行注释，在注释内容前加符号 “//”
 多行注释以"/*"开始，以"*/"结束

变量

定义变量使用var/let 关键字 语法如下：var/let 变量名

JavaScript 是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动的动态确定。

变量命名规范规则

1. 变量必须使用字母、下划线 _ 或者美元符号$, 然后可以使用任意多个英文字母、数字、下划线 _ 或者美元符号组成，多个英文单词则采用驼峰式写法。

2. 不能使用JavaScript关键词与JavaScript保留字。高亮的是关键词和保留字。

   关键字：break do instanceof typeof case else new var catch finally return void continue for switch if 等

   保留字：abstract enum int short boolean export interface static byte extends long super char final native synchronized class float 等

3. 严格区别大小写

   如变量 mynum 与 myNum 是不一样的，表示是两个变量。

变量的数据类型

基本数据类型

string 字符串 被引号（单引号或双引号）括起来的文本

• 转义字符 用 \ 开头 如：
  • \n = enter
  • \t = tab
  • \ 斜杠本身
  • var str = ‘我说：‘这是我说的内容’’
• 字符长度 length属性 应用场景：判断用户输入是否合规
• 字符串拼接 运用 +
• 运用toString（）可转换成字符串

		let b = "1";
		let c = "2";
		console.log(b+c);
		//此时输出的为字符串形式的13

number 数字

• NaN typeof NaN -> Number
• 显示类型转换为数字 parseInt(值)

	let m = "16abc18";
	console.log(parseInt(m));
	//输出16
	//遇到第一个不是数字的就会停止

null 空值

• 暂时没想好给什么值的时候用

undefined

• 表示这个元素 不存在
• undefined值是派生自null值

boolean 布尔值

• true 真
• false 假

如何判断一个变量的类型？

• 运用typeof

		let a = 1;
		let b = "1";
		let bol1 = true;
		let abc = null;
		let bcd;
		console.log(typeof a); //number 数字  蓝色
		console.log(typeof b); //string 字符串 黑色
		console.log(typeof abc); //object 
		console.log(typeof bcd); //undefined
		console.log(typeof bol1); //boolean

如何判断一个变量为“非数字”？

例如：isNaN(‘abc’) //返回true

为何 typeof null 的值是object呢？

原理是因为不同的对象在计算机底层都表示为二进制，在javascript中要是二进制前三位都是0的话就表示对象，而null的二进制都是0，那么前三位自然也是0，就被认为是object，所以typeof null 返回的是object。

引用数据类型

object 对象

• 对象 Object 是属性的集合
  • 每个属性都由 键值 构成
  • 值可以是基础数据类型，也可以是对象
  • 对象是“命名值”的无序集合
  • null被认为是一个空的对象引用
    例：let obj = {name :“abc”};

array 数组

• 是一种特殊对象
  • 表示带编号的值的有序集合
    例：let arr = [1,2,3];

检测数组数据类型用 Array.isArray（值）

        //array 数组
		let arr = [1,2,3]; 
		//object 对象
		let obj = {name :"abc"};
		console.log(typeof arr);//数组
		console.log(typeof obj);//object
		console.log(Array.isArray(arr))//true
		console.log(Array.isArray(obj))//false

运算符

• 隐式转换
  在js中，当运算符在运算时，如果两边数据不统一，CPU就无法计算，这时我们编译器会自动将运算符两边的数据做一个数据类型转换，转成一样的数据类型再计算

加减乘除

加号

		console.log(1 + true)//2 number
		console.log(true + true)//2 number
		console.log(1 + NaN)//nan number
		console.log(1 + null)//1 number
		console.log(1 + {})//1[object object] string
		console.log("hello" + null)//hellonull string
		console.log("hello" + undefined)//helloundefined string
		console.log(1 + null + 2)//3 number
		console.log(1 + 2 + '3')//33 string
		console.log(1 + '2' + 3)//123 string
		console.log('1' + null + 2)//1null2 string
		console.log('1' + (null + 2))//12 string
		console.log('4' * '7')//28 number

‘%’ 取余 2%3、3%2

	console.log(2%3) //2
	console.log(3%2) //1

精度丢失

• 0.1 + 0.2 不能精确表示浮点数
  • 解决方案，将小数转换成整数 var num = (1 + 2)/10;

逻辑运算符

! 非

• 正常情况：对一个布尔值进行取反
  • 非正常情况：先转换为boolean，再进行运算
  • 可以多次取反

		console.log(!undefined) //true
		console.log(!null) //true
		console.log(!0) //true
		console.log(!"")//true
		console.log(!"0")//false
		console.log(!{}) //false

&& 与

• true && false 如果两个值都为true，则返回true
  • 短路原则 如果左侧表达式为false，，返回左侧操作数的值，就停止判断，并不会对右侧操作数进行计算

	let found = true; 
	let result = (found && someUndefinedVariable);
	// 这里会发生错误 ,如果found改为false，就不会发生

|| 或

• 有true就返回true
  • 遵循短路原则

true || console.log('test');//true
false || console.log('test');//test
isNaN(Number(!!Number(parseInt("0.8"))))//false
typeof !parseInt(null) + !isNaN(null);//booleantrue

赋值运算符 ‘=’ ‘+=’ ‘-=’ ‘*=’ ‘/=’

a += 2;//a=a+2
a -= 2;//a=a-2
a /= 2;//a=a/2
a *= 2;//a=a*2
a %= 2;//a=a%2

关系运算符

用来比较两个值之间的关系。

• 大于小于等于
• 对于非数值进行比较，先转换为数字，再比较

let result = '10' > 2; //true
let result = 10 > 'hello' // 任何值和NaN都是false

相等运算符

• == 是自动进行类型转换，再比较

console.log( 1 == 1);//true
console.log( '1' == 1 );//true
// 转换成数字  true ===> 1 
console.log( true == '1' );
console.log( true == '2' );//false
// false , null代表为空，0是一个值不是一个意思
console.log( null == 0 ); //true
// undefined 衍生自null 所以为true
console.log( undefined == null );
// NaN不和任何值相等，包括其本身
console.log(NaN == 1);//false
console.log(NaN == NaN);//false

• === 并不进行自动类型转换，其它和==类似
• !代表非，取反。! == 与 ! =代表不等于，用法与上面一致。

自增自减

对于一个变量自增之后，原变量的值会立即自增1
自增分为两种： ++i 前增量 与 i++ 后增量

var i = 1;
console.log(i++); // 1 先返回i在进行自增
console.log(++i); // 2 先自增在返回i

分支条件语句

if (条件逻辑表达式为测试条件) {
满足条件后执行的语句块；
}

• 如果语句块只有1行语句，大括号可以省略

  if(条件)语句1

let a=prompt()
		
if(a==6){
		console.log("这是我喜欢的数字")
	}
	//若输入6 则返回 这是我喜欢的数字 反之则不返回任何

if (测试条件) {
当测试条件为真，执行到此
} else {
当测试条件为假，执行到此
}

let num = Number(prompt('请输入一个数字'))
if (a % 2 == 0) {
  alert('偶数')
} else {
  alert('奇数')
}
//若输入2 4 6 这样的偶数 则返回偶数 反之返回奇数