JavaScript基础笔记

这个是在学习JavaScript基础时整理的笔记，内容不是很全。

1. 输入输出

方法	说明	归属
alert(msg)	浏览器弹出警示框	浏览器
console.log(msg)	浏览器控制台打印输出信息	浏览器
prompt(info)	浏览器弹出输入框，用户可以输入	浏览器

2. 变量

2.1 特殊情况

情况	说明	结果
var age; console.log(age);	只声明，不赋值	undefined(未定义的)
console.log(age);	不声明，不赋值，直接使用	报错
age = 10; console.log(age);	不声明，只赋值	输出10

3. 数据类型

3.1 数字型 Number

• 最大值：Number.MAX_VALUE
• 最小值：Number.MIN_VALUE
• 无穷大：Infinity
• 无穷小：-Infinity
• 非数值：NaN

isNaN() : 用于判断非数字，并返回一个值，是数字返回 false，不是数字返回 true

3.2 字符串型 String

3.2.1 字符串转义符

转义符	解释说明
\n	换行
\	斜杠\
’	单引号
"	双引号
\t	tab 缩进
\b	空格

3.2.2 字符串长度：length

3.2.3 字符串拼接

• 多个字符串之间可以使用 + 进行拼接，拼接方式为 字符串 + 任何类型 = 拼接之后的新字符串

{
	// 字符串 “相加”
	console.log('hello' + ' ' + "world"); // hello world
	// 数值字符串 “相加”
	console.log('20' + '21'); // 2021
	// 数值字符串 + 数值
	console.log('11' + 22); // 1122
}

3.3 布尔型 Boolean

boolean 有两种类型： true 和 false

true 参与运算当 1 看；false 参与运算当 0 看

3.4 Undefined 和 Null

undefined(未定义) 和 字符 相加，结果为 两个相连

undefined(未定义) 和 数字 相加，结果为 NaN

null(空) 和 字符 相加，结果为 两个相连

null(空) 和 数字 相加，结果为 数字

3.5 获取数据类型 typeof

{
	var num = 20;
	console.log(typeof age); // number
	// prompt 输出的类型是 字符型
	var age = prompt();
	console.log(typeof age); // string
}

3.6 数据类型转换

3.6.1 转换为字符型

方式	说明	案例
toString()	转成字符串	var num=1; alert(num.toString());
String() 强制转换	转成字符串	var num=1; alert(String(num));
加号拼接字符串	和字符串拼接的结果都是字符串	var num=1; alert(num+ ‘字符串’)；

3.6.2 转换为数字型

方式	说明	案例
parseInt(string) 函数	将string类型转成整数数值型	parseInt(‘18’)
parseFloat(string) 函数	将string类型转成浮点数值型	parseFloat(‘20.21’)
Number() 强制转换函数	将string类型转换为数值型	Number(‘12’)
js 隐式转换(- * /)	利用算术运算隐式转换为数值型	‘12’-0

4. 运算符

4.1 前置运算法

++ num

口诀：先自加，后返回值

{
	var p = 10;
	console.log(++p + 10); // 21
}

4.2 后置运算符

num++

口诀：先返回原值，后自加

{
	var age = 10;
	console.log(age++ + 10); // 20
}

5. 数组

5.1 创建数组

1.利用 new 创建数组

var arr = new Array();

2. 利用数组字面量创建数组

var 数组名 = [ ];

5.2 新增数组元素

1. 改变数组长度

var arr = ['red', 'green', 'blue'];
arr.length = 5;

2. 修改数组索引值

var arr = ['red', 'green', 'blue'];
arr(4) = 'pink';

5.3 检测是否为数组

（1）instanceof

		var arr = [];
        console.log(arr instanceof Array);

（2）Array.isArray(参数)

		var arr = [];
		console.log(Array.isArray(arr));

5.4 添加删除数组元素

方法名	说明	返回值
push(参数1…)	末尾添加一个或多个元素，注意修改元素组	返回新的长度
pop()	删除数组最后一个元素，把数组长度减1，无参数，修改元素组	返回它删除的元素的值
unshift(参数1…)	向数组的开头添加一个或更多元素，注意修改原数组	返回新的长度
shift()	删除数组的第一个元素，数组长度减1，无参数，修改元素组组	返回第一个元素的值

		// (1) push  在数组末尾添加一个或多个元素
        var arr = [1, 2, 3];
        arr.push(4, 'pink');
		console.log(arr.push(4, 'pink')); // 返回新数组的长度
        
        // (2) unshift 向数组的开头添加一个或更多元素
		var arr = [1, 2, 3];
        arr.unshift('red');
		console.log(arr.unshift('red'));  // 返回新数组的长度
		
		// (3) pop()  删除数组最后一个元素
		var arr = [1, 2, 3];
        console.log(arr.pop());   // 返回删除元素的值
        
        // (4) shift()  删除数组的第一个元素
		var arr = [1, 2, 3];
        console.log(arr.shift());   // 返回删除元素的值

5.5 数组排序

方法名	说明	是否修改原数组
reverse()	颠倒数组中元素的顺序，无参数	改变元素组，返回新数组
sort()	对数组的元素进行排序	改变元素组，返回新数组

		// (1) reverse() 翻转数组
        var arr = [1,2,3,4,5];
        arr.reverse();
        console.log(arr);

		// (2) sort() 冒泡排序
        var arr1 = [3, 24, 1, 10, 77];
        arr1.sort(function (a, b) {
   
            return a - b;   // 升序排序
            return b - a;     // 降序排序
        })
        console.log(arr1);

5.6 获取数组元素索引

方法名	说明	返回值
indexOf()	数组中查找给定元素的第一个索引	存在返回索引号，不存在返回-1
lastIndexOf()	查找数组中的最后一个的索引	存在返回索引号，不存在返回-1

		var arr = [1, 2, 3, 4, 2, 5];
        console.log(arr.indexOf(2));   // 1
        console.log(arr.lastIndexOf(2));   // 4

5.7 数组去重

目标：把旧数组里面不重复的元素选取出来放到新数组中，重复的只保留一个，放到新数组中去重。

核心算法：先遍历旧数组，然后根据旧数组去查询新数组，如果该元素在新数组里面没有出现过，就添加到新数组，否则不添加。

// 数组去重
        function unique(arr) {
   
            var newArr = [];
            for (var i = 0; i < arr.length; i++) {
   
                if (newArr.indexOf(arr[i]) === -1) {
     // 判断元素在新数组是否已存在
                    newArr.push(arr[i]);   // 添加元素到新数组
                }
            }
            return newArr;
        }
        var demo = unique([1, 2, 3, 3, 5, 6, 2]);
        console.log(demo);

5.8 合并数组

concat() 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

	     // 合并数组 concat()
        var arr1 = [1, 2, 3];
        var arr2 = [4, 5, 6];
        var newArr = arr1.concat(arr2);  // 合并两个数组
        console.log(newArr);

        var arr3 = [7, 8, 9];
        var arr = arr1.concat(arr2, arr3);  // 合并三个数组
        console.log(arr);

5.9 数组转换为字符串

方法名	说明	返回值
toString()	把数组转换为字符串，逗号分隔每一项	返回一个字符串
join(‘分隔符’)	方法用于把数组中的所有元素转换为一个字符串	返回一个字符串

		// 1. toString()
        var arr = [1, 2, 3];
        console.log(arr.toString());

        // 2. join('分隔符')
        var arr1 = ['pink', 'blue', 'red'];
        console.log(arr1.join());     // pink,blue,red
        console.log(arr1.join('-'));  // pink-blue-red
        console.log(arr1.join('&'));  // pink&blue&red

5.10 根据字符返回位置

方法名	说明	使用
charAt(index)	返回指定位置的字符（index 字符串的索引号）	str.charAt(0)
charCodeAt(index)	获取指定位置字符的ASCII码（index索引号）	str.charCodeAt(0)
str[index]	获取指定位置处字符	HTML5, IE8+支持 和 char()等效

5.11 拼接以及截取字符串

方法名	说明
concat(str1,str2,…)	concat()方法用于连接两个或多个字符串，拼接字符，等效于 +
substr(start,length)	从start位置开始（索引号），length 截取的个数
slice(start,end)	从start位置开始，截取到end位置，end取不到（都是索引号）
substring(start,end)	从start位置开始，截取到end位置，end取不到，不接受负值

        // concat() 拼接字符串
        var str1 = 'abc';
        var str2 = 'def';
        console.log(str1.concat(str2));   // abcdef

        // substr(); 
        var str = '中山大学新华学院';
        console.log(str.substr(2, 2));  // 大学

	    // slice()
        var arr = [1, 2, 3];
        var newArr = arr.slice();
        console.log(newArr);   // [1, 2, 3]

5.12 替换字符和字符串转换为数组

		// replace('被替换的字符', '替换为新的字符')   有重复字符时，只会替换第一个字符
        var str = 'abcdea';
        console.log(str.replace('a', 'x')); // xbadea

        // splice('分隔符')  字符串转换为数组
        var arr = 'pink, red, blue';
        console.log(arr.split(',')); // [pink, red, blue]

6. 函数

6.1 arguments的使用

当不确定有多少个参数传递的时候，可以用arguments来获取。在JavaScript中，arguments实际上它是当前函数的一个内置对象。所有函数都内置了一个arguments对象，arguments对象中存储了传递的所有实参。

6.2 函数的两种声明方式

1.自定义函数

// 1.声明
function 函数名() {
   

}
// 2.调用
函数名();

// 例子
function fn(){