1、基础知识
ECMAScript(ES):规定了JS的一些基础核心的知识(变量、数据类型、语法规范、操作语句等)
DOM:document object model 文档对象模型,里面提供了一些属性和方法,可以让我们操作页面中的元素
BOM:browser object model 浏览器对象模型,里面提供了一些属性和方法,可以让我们操作浏览器
常用浏览器内核
浏览器的内核是分为两个部分的,一是渲染引擎,另一个是JS引擎。现在JS引擎比较独立,内核更加倾向于说渲染引擎。
webkit内核(V8引擎)
- 谷歌
- 大部分移动端浏览器
- 国内大部分浏览器 360 QQ UC 猎豹 搜狗
- NODE基于V8来渲染JS
Gecko 火狐浏览器
- Presto 欧朋浏览器
- Trident IE浏览器
数据类型的分类和检测
- Number
- String
- bloean
- null:空对象指针基础
- undefined:未定义
- function 函数类型
- object对象数据类型:
- {}普通对象
- 数组
- /$/ 正则
[对象数据类型:是把描述同一事物的属性和方法放在一个内存空间中,起到了分组的作用]
检测数据类型
- typeof:检测数据类型的运算符
- instanceof:检测某个实例是否属于这个类
- constructor:获取当前实例的构造器
- Object.prototype.toString.call:获取当前实例所属的类信息
typeof:结果返回的是一个字符串,字符串内包含的是数据类型
- typeof 的局限性
- typeof null 的检测结果不是‘null’ 而是’object’: 而null是基本数据类型 ,并不是object
- 使用typeof 无法具体区分出到底是数组还是正则或普通对象
Boolean
- 把其他类型转换为布尔类型
只有0,NaN,空字符串、null、undefined为false;其余都是true;
! 或者 !!的意义
!:先将数据类型转化为布尔值,再取反
!!:两次取反相当于没有取反,只是把数据类型转化为布尔类型
-
!null => true
-
!!undefined =>false
Number
[NaN]
- js中新增了一个数据类型:NaN(not a number 不是一个有效数字,但是属于number)
- typeof NaN =>’number’
NaN!=NaN NaN和任何值都不等
[isNaN]
isNaN:用来检测这个值是否是有效数字,如果不是,则为true,反之,则为false
当时使用isNaN检测时,()中如果不是number类型:
基本数据类型:先将其他类型值转化为Number类型值再运算
对象数据类型:先将对其调用toString方法,再转化为Number类型值
[Number]
- 使用Number把字符串转换为数字的时候,空字符串是零,其它字符串中如果出现的字符代表纯数字可以转为正常的数字,如果出现了任何一个非有效数字的字符,最后的结果都是NaN
- 将引用类型转化数据类型时,先将其转化为字符串,后再转化为number;
-
({name:'zxt'}).toString() =>"[object Object]"
-
Number(undefined) =>NaN
-
[parseInt()]
将其他类型值转换number,和Number不同,提取规则:从左至右依次查找有效数字字符,直到遇见非有效字符为止(不管后面还有没数字)
parseInt(‘12px’) =>12
parseInt(‘px1’) =>NaN
parseInt(‘122.3’) =>122
[parseFloat()]
与parseInt不同的是支持小数
- parseFloat(‘12.34pxc’)= 12.34
由于浮点数不是精确的值,所以涉及小数的比较和运算要特别小心
-
0.1 + 0.2 === 0.3
-
// false
-
0.3 / 0.1
-
// 2.9999999999999996
-
[toFixed()]
控制数字保留小数点后面几位
-
1.var num = parseFloat('width:12.5px'); //=>NaN
-
2.if(num==12.5){
-
3. alert(12.5);
-
4.}else if(num==NaN){//=> NaN!=NaN
-
5. alert(NaN);
-
6.}else if(typeof num=='number'){//=> typeof NaN->'number'
-
7. alert(0);//=>'0'
-
8.}else{
-
9. alert('啥也不是!');
-
10.}
null 和 undefined
null: 没有,没有开辟内存空间
undefined: 未定义
“” : 空字符串,什么都没有,但是开辟了内存空间
null:什么都没有,但一般都是自己手动赋值的,后期再自己赋值
unfefined:完全不在预期之内
Object
对象是由0到多组键值对组成的,每一组之间用逗号分离
每一个对象数据类型,都是有0到多组的属性名和属性值组成的
属性名:描述当前对象具备的某些特征(数字/字符串格式)
属性值:具体特征的值(任何数据类型)操作一个对象的属性有2种方式
obj['key']
obj.key
(属性名是数字不可以使用这种方法)
创建对象
字面量方式:var obj={}
构造函数方式:var obj=new Object();
对象键值对的操作:增、删、改、查
var obj = {};
obj.name = ‘zxt’;//=>增加一个叫做NAME的属性,属性值是:’zxt’
obj[‘name’] = 29;//=>修改NAME对应的属性值:一个对象的属性名是不能重复的
,之前没有这个属性,我们的操作是增加操作,之前有这个属性,当前操作就是在修改现有属性名的属性值
obj.age = null; //=>假删除:把属性值设置为空,但是属性名是存在的 <=> obj[‘age’] = null =>获取age的属性值结果是null
delete obj.age;//=>真删除:把属性名和属性值彻底从对象中移除掉 =>获取age的属性值结果是undefined获取一个对象某一个属性名对应的属性值,如果当前这个属性在对象中并不存在,获取的结果是undefined
obj[name]和obj['name']的区别
-
//-> age:变量名,代表的是它存储的值
-
//-> 'age':常量,字符串的具体值
-
var age = 'name';
-
var obj = {
-
name:'zhufeng',
-
age:8};
-
console.log(obj.age); =>8
-
console.log(obj['age']); =>8
-
console.log(obj[age]); => obj[age变量] =>obj['name'] =>获取name属性名的属性值 =>'zhufeng'
Object.keys:
Object.keys 返回一个所有元素为
字符串的数组
,其元素来自于从给定的对象上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。可以用来判断对象是否为空:Object.keys(obj).length
-
let obj = { 0 : "a", 1 : "b", 2 : "c"};
-
console.log(Object.keys(obj));
-
// ['0', '1', '2']
函数数据类型
函数数据类型也是按照引用地址来操作的
函数:具备一定功能的方法
基本数据类型和引用数据类型的区别
JS是运行在浏览器中的(内核引擎),浏览器会给JS提供一个赖以生存的环境,所以我们把这个环境叫做全局作用域 window(global是后台的)
JS代码是自上而下依次执行的
基本数据类型是按值操作的:基本数据类型再赋值时,是直接把值赋值给变量即可
-
var a=12;
-
var b=a; // b=12 把变量a存的值赋值给变量b
-
b=13;
-
alert(a); //a=12
引用数据类型是按空间地址(引用地址)来操作的:
var n={name:’主动’};
1、先创建一个变量n;
2.浏览器首先会开辟一个存储空间(内存空间),是把对象中需要存储的键值对分别存储在这个空间中,后期为了方便找到这个空间,浏览器会给空间设个地址(16进制);
3、把空间的地址赋值给变量;所以n存储的是一个引用地址,并不是一个具体的值
&&逻辑与||逻辑或
-
在条件判断中
&&:所有都为真,才是真
||:只要一个为真,就是真 -
在赋值操作中 (短路操作)
||: a||b;看a的真假,a为真,则返回a的值,a为假,则返回b,不管b是什么
&&:a&&b, a为假,则返回a的值,a为真,则返回b,不管b是什么
真实项目中应用逻辑或实现默认值的设置操作
逻辑与的优先权高于逻辑或
JavaScript常用的操作语句
通过一系列的逻辑判断,来完成特定的事情
for循环
if循环:当在判断的操作中,很多条件都是符合的,执行完成第一个符合的条件后,后面的条件不管是否符合都不在处理了
for in 循环
用来遍历(循环)对象键值对的, '循环数组中的每一项', '条件?条件成立执行:条件不成执行
;, 执行步骤:]
key存储的值都是字符串格式,key中存的是属性名
在for in 循环遍历时,大部分浏览器都是先把对象中的键值对进行排序(整数数字在前,由小到大,其余按原来编写顺序排列)(小数算作字母,不算数字)for in循环会遍历对象原型上的方法
itin [Tab] for in 循环快捷键
三元运算符
['条件?条件成立执行:条件不成执行;]
是简单的if、else的另外一种写法
如果某种情况并不需要做处理,我们可以用null,undefined,void 0占位即可
某一情况执行多条操作,使用()包起来,每一项处理的事情之间用逗号分隔
在三元运算符中不能出现 break/continue/return
会出现 SyntaxErrorr 语法错误
switch case
也是if else某种特定情况的简写,可以在switch 语句中使用任何数据类型(在很多其他语言中只能使用数值),无论是字符串,还是对象都没有问题。其次,每个 case 的值不一定是常量,可以是变量,甚至是表达式。
每一种case情况结束都需要加break,达到条件成立处理完成,跳出当前判断每一种case情况的比较都是使用===进行比较的:绝对相等
=:赋值,变量=值
==:比较,值==值
绝对比较,值===
如果左右两边比较的值是相同类型的,那么直接比较内容是否一样即可;如果两边值的类型不一样,==和===是有区别的
:
===类型不一样,最后的结果就是false,更加的严谨
==类型不一样,浏览器首先会默认的把类型转化为一样的,然后再比较内容,相对松散一些
for循环语句
for(初始值;验证条件;步长累加){
循环体}
设置初始值
验证条件
条件成立执行循环体,否则推出循环
步长累加
验证条件
···············
没有步长累加会陷入死循环
for循环与for in循环的区别:for in 循环可以遍历到原型上的公有属性,而for循环只能遍历私有的属性
腾讯面试题
-
for(var i=0;i<10;i+=2){
-
if(i<=5){
-
i++;
-
continue;
-
}else{
-
i--;
-
break;
-
}
-
console.log(i);}
-
console.log(i); //=>5