一、基础概念
1.原始类型:boolean、null、undefined、number、string、symbol
2.字面量:一般固定值称为字面量,如 3.14。
- 数字(Number)字面量有整数字面量,浮点数字面量,Infinity,NaN
- 字符串(String)字面量 可以使用单引号或双引号
- 表达式字面量
- 数组(Array)字面量
- 对象(Object)字面量
- 函数(Function)字面量
3.JavaScript 语句标识符
语句 | 描述 |
---|---|
break | 用于跳出循环。 |
catch | 语句块,在 try 语句块执行出错时执行 catch 语句块。 |
continue | 跳过循环中的一个迭代。 |
do ... while | 执行一个语句块,在条件语句为 true 时继续执行该语句块。 |
for | 在条件语句为 true 时,可以将代码块执行指定的次数。 |
for ... in | 用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。 |
function | 定义一个函数 |
if ... else | 用于基于不同的条件来执行不同的动作。 |
return | 退出函数 |
switch | 用于基于不同的条件来执行不同的动作。 |
throw | 抛出(生成)错误 。 |
try | 实现错误处理,与 catch 一同使用。 |
var | 声明一个变量。 |
while | 当条件语句为 true 时,执行语句块。 |
4.变量提升:函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。也就是说,变量可以先使用后声明。
注意:JavaScript 只有声明的变量会提升,初始化的不会。
5.闭包:闭包是一种保护私有变量的机制,在函数执行时形成私有的作用域,保护里面的私有变量不受外界干扰。直观的说就是形成一个不销毁的栈环境。
通俗的讲,在函数A里,声明了变量a,函数A内嵌了一个函数B,函数B访问了变量a,最后返回函数B,函数B就是一个闭包。
示例1:
function A(){
var a="hello world"
function B(){
console.log(a);
}
return B;
}
var c = A();
c();//hello world
闭包有3个特性:
①函数嵌套函数
②函数内部可以引用函数外部的参数和变量
③参数和变量不会被垃圾回收机制回收
示例2:
var add = (function () {
var counter = 0;
return function () {return counter += 1;}
})();
add();
add();
add();
// 计数器为 3
6.深浅拷贝:
示例:
let a={name:'hello'}
let b=a
a.name="world"
console.log(b.name) // world
上述例子中,将a拷贝到b其实是拷贝了地址,一旦对象a的name属性发生改变,对象b的name属性也会改变,为了解决以上问题,引出了浅拷贝和深拷贝。
如何实现深浅拷贝
- 浅拷贝:
Object.assign({}, a)
展开运算符... - 深拷贝:
JSON.parse(JSON.stringify(obj))
7.立即执行函数
见闭包的示例2代码。
二、常用的方法使用示例
1.indexOf :返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现,则该方法返回 -1。
stringObject.indexOf(searchvalue,fromindex)
2.lastIndexOf:返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。如果要检索的字符串值没有出现,则该方法返回 -1。
stringObject.lastIndexOf(searchvalue,fromindex)
3.splice:从数组中添加/删除项目,然后返回被删除的项目。
arrayObject.splice(index,howmany,item1,.....,itemX)。
示例:
<!doctype html>
<html>
<body>
<script >
let arr1 = [1,2,3,4]
let arr2 = [1,2,3,4]
arr1.splice(2,0,"88")
document.write(arr1 + "<br />")
arr2.splice(2,1,"88")
document.write(arr2 + "<br />")
</script>
</body>
</html>
输出结果:
1,2,88,3,4
1,2,88,4
4.slice:从已有的数组中返回选定的元素。该方法并不会修改数组,而是返回一个子数组。
arrayObject.slice(start,end)
5.split:用于把一个字符串分割成字符串数组。
stringObject.split(separator,howmany)
示例:
<script >
var str="1,2,3,4,5"
document.write(str.split(",") + "<br />")
document.write(str.split(",",3))
</script>
输出结果:
1,2,3,4,5
1,2,3
6.replace:用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
stringObject.replace(regexp/substr,replacement)
示例:
<script >
var str="hello world!hello,123"
document.write(str.replace(/hello/g, "你好"))
</script>
输出结果:
你好 world!你好,123
More
7.substr:在字符串中抽取从 start 下标开始的指定数目的字符。
stringObject.substr(start,length)
8.substring:用于提取字符串中介于两个指定下标之间的字符。
stringObject.substring(start,stop)
注意:与 slice() 和 substr() 方法不同的是,substring() 不接受负的参数
9.toLocaleLowerCase();toLowerCase()转小写
10.toLocaleUpperCase();toUpperCase()转大写
11.trim:用于删除字符串的头尾空格。
string.trim()
12.map、filter、reduce
- map:生成一个新数组,遍历原数组,将每个元素拿出来做一些变换然后放入到新的数组中。另外 map 的回调函数接受三个参数,分别是当前索引元素,索引,原数组
[1, 2, 3].map(v => v + 1) // -> [2, 3, 4]
- filter:生成一个新数组,在遍历数组的时候将返回值为 true 的元素放入新数组,我们可以利用这个函数删除一些不需要的元素。
let array = [1, 2, 4, 6]
let newArray = array.filter(item => item !== 6)
console.log(newArray) // [1, 2, 4]
- reduce:可以将数组中的元素通过回调函数最终转换为一个值。它接受两个参数,分别是回调函数和初始值。
const arr = [1, 2, 3]
const sum = arr.reduce((acc, current) => acc + current, 0)
console.log(sum)
13.reverse:reverse() 方法用于颠倒数组中元素的顺序
arrayObject.reverse()
14、every、some、join
- every:用于检测数组所有元素是否都符合指定条件。
every() 方法使用指定函数检测数组中的所有元素:
如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
如果所有元素都满足条件,则返回 true。
语法:array.every(function(currentValue,index,arr), thisValue)
var ages = [32, 33, 12, 40];
function checkAge(age) {
return age >= 18;
}
function myFunction() {
ages.every(checkAge);
}
- some:测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。
Array.some()
const array = [1, 2, 3, 4, 5];
const even = (element) => element%2===0;
console.log(array.some(even));
//true
- join:用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。
arrayObject.join(separator)
<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr.join())
</script>
//George,John,Thomas
15.Math
- Math.floor() 返回小于或等于一个给定数字的最大整数
Math.floor( 45.95); // 45
- Math.round()把一个数字舍入为最接近的整数
<script type="text/javascript">
document.write(Math.round(0.60) + "<br />")
document.write(Math.round(0.50) + "<br />")
document.write(Math.round(0.49) + "<br />")
document.write(Math.round(-4.40) + "<br />")
document.write(Math.round(-4.60))
</script>
//output
1
1
0
-4
-5
16.正则表达式:使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。
三、其他
1.==和===的区别
== ,如果对比的数据类型不相同,先进行类型转换,再进行比较;
===,判断两者类型和值是否相同。
2.在条件判断时,除了 undefined, null, false, NaN, ' ', 0, -0,其他所有值都转为 true。
类型转换
3.理解this
JavaScript this 关键字
JavaScript中this详解