JavaScript知识点总结(更新中)

JavaScript

前言

• JavaScript语言特点:

解释型语言
单线程: 同一时间只能做一件事

• JavaScript三大部分

ECMAScript
DOM
BOM

• 主流浏览器

浏览器				开发公司
IE				  trident
Chrome			  webkit/blink
firefox			  Gecko
Opera			  presto
Safari			  webkit

• js引入方式

页面内嵌script标签

外部引入

壹 基础

- 变量

var a;	//	用关键字 var 声明变量
a=100;	//	变量赋值
a=444;	//	同一个变量可以反复赋值 是动态的
var b=200;	//	声明变量同时赋值
var a,d,g,r,t;	//	用逗号分开进行多个赋值

变量命名规则

- 变量名必须以英文字母, _, $ 开头
- 变量名可以包括英文字母, _, $, 数字
- 不可以用系统的关键字, 保留字作为变量名

- 数据类型

//	基本数据类型 (原始值)
//	Number	String	Boolean	 undefined	null
var b=-2.2222;		//	number
var str='gartg';	//	string
//	Boolean			(true 和 false)
//	undefined		(未定义)
//	null			空 占位置

//	引用数据类型 (引用值)
//	array object function ... date RegExp
var arr=[1,2,3,4,5,6,false,'abcd'];		//	array(数组)

//	数据类型区别
/*	基本类型不可改变
	赋值方式不一样
		基本数据类型存具体数据内容
		引用数据内容存指向数据内容的地址 
*/
document.write(a);

- js基本语法

- 语句后面要用分号结束 ";"
	注: 函数 for语句 if语句 后不需要加分号
- js*语法错误*会引发后续代码终止, 但不会影响其它js代码块
- 书写格式要规范, "+ - / =" 两边都应该有空格

语法错误:
- 低级错误(语法解析错误) 后续js代码块不会继续执行
- 逻辑错误(标准错误,情有可原)

- js运算符

运算操作符

-  "+"
   1 数学运算, 字符串连接
   2 任何数据类型加字符串都等于字符串
-  "-" "*" "/" "=" "%" "()"
   1/0	Infinity
    -1/0	-Infinity
    Infinity 是number类型
    NaN (Not a number)
-  "()"的优先级最高, "="优先级最弱
-  "++" "--" "+=" "-=" "/=" "*=" "%="

前++ 与 后++

//	赋值的顺序 自右向左, 计算的顺序 自左向右
//	前++	先赋值 后计算;	后++ 先计算 后++
//	前--  后-- 同理
var a=10;
var b=++a -1 + a++;	//	b=21	a=12

练习

//	交换a,b的值
var a=11;
var b=22;
//方法一
var c=a;
a=b;
b=c;
//方法二
a=a+b;	// 和
b=a-b;	// 将a赋值给b
a=a-b;	// 将b赋值给a

比较运算符

">" "<" "==" ">=" "<=" "!="
比较结果为Boolean值, true 或 false

逻辑运算符

"&&" "||" "!"
运算规律: 
	"&&" 与运算符	一假全假 全真才真
	若只有两个表达式的话,只看到第二个表达式,就可以返回该表达式的值了.
	先看第一个表达式的结果,若结果为真,那么就看第二个表达式转化为布尔值的结果.
	当第一个表达式为false时,直接返回第一个表达式的值,其后的表达式不在看.
	"||" 或运算符	一真全真 全假才假
	当第一个表达式为true时,直接返回第一个表达式的值,其后的表达式不在看.
	"!" 非运算符
	先 将数据变为Boolean类型再取反
运算结果: 
	为真实的值

被认定为false的值

undefined	null	NaN	 ""	 0	false	==>	转化为Boolean时均为 false
NaN 不等于任何值 包括它自己

- 循环语句

if语句

语法结构
	语法一
	if(true){	
		代码块;
	}
	语法二	前提: 条件之间彼此互斥
	if(条件1){ 
        代码1;
    }else if(条件2){
        代码二2;
    }...
    ...
    else{
        
    }

for循环

语法结构
	for( a ; b ; c ){
    	d;
	}
执行顺序: a --> b --> d --> c --> b --> d --> c ... b --> d --> c

while循环

类似于简化版for循环
语法结构:
	while(条件){
		代码块;
	}
死循环:
	while(1){
		代码块;
	}

逢7过
var i=0;
while(i<100){
	if(i%7==0||i%10==7||(i-i%10)/10==7){
		document.write(i);
	}
}

do…while…循环

不推荐
特点:	无论条件是否满足,均先执行一遍
语法结构:
	do{
		代码块;
	}while(条件)

练习

//	计算2的n次幂,n可输入,n为自然数
	var n=parseInt(prompt('请输入自然数'));
	var num=2**n;
	document.write(num);
	
	var nul=1;
	for(var i=0;i<n;i++){
		nul *= 2;
	}
	document.write(mul);
//	计算n的阶乘,n可输入
	var n=parseInt(prompt('请输入自然数'));
	for(var i=n;i>=1;i--){
		n*=(n-1)
	}
	
	var nul=1;
	for(var i=1;i<=n;i++){
		mul*=i;
	}
//	输入斐波那契数列	1 1 2 3 5 8 13 21 34 ...
    var n=parseInt(prompt('请输入自然数'));
	var a=1,b=1,c;
	for(var i=0;i<n-2;i++){
		c=a*b;
        a=b;
        b=c;
    }
	document.write(c);

//	编写一段程序,输入一个三位数的正整数,输出时反向输出.例:输入345,输出543
	
//	输入a,b,c三个数字,打印出最大的
	var a=parseInt(prompt('请输入自然数'));
	var b=parseInt(prompt('请输入自然数'));
	var c=parseInt(prompt('请输入自然数'));
	if(a>b){
        if(a>c){
            document.write(a);
        }else{
            document.write(c);
        }
    }else{
        if(b>c){
            document.write(b);
        }else{
            document.write(c);
        }
    }
//	打印出100以内的质数
	//	方法一
	var count=0;
    for(var i=1;i<100;i++){
        for(var j=1;i<=i;j++){
            if(i%j==0){
               count++;
            }
        }
        if(count==2){
            document.write(i);
        }
        count==0;
    }
	//	方法二
	var count=0;
    for(var i=2;i<100;i++){
        for(var j=1;i<=	Math.sqrt(i);j++){
            if(i%j==0){
               count++;
            }
        }
        if(count==1){
            document.write(i);
        }
        count==0;
    }

- typeof 类型转换

typeof作用: 判断数据类型
	使用方法: 
		方式一:	typeof(参数);	
		方式二:	typeof 参数;
	typeof 可以判断6种类型的数据:
	返回值有: number string Boolean object undefined function
	type(null) 返回 object
	
	注意: 有且仅有typeof其内的参数未定义时,不报错
	若参数未定义 不报错 且返回字符串类型的 undefined

类型转换

Number(参数):	将参数转换为数字类型
	undefined string(非数值) ---> NaN
	true ---> 1
	false ---> 0
	null ---> 0
	
parseInt(参数一,参数二);	将数字转化为整形,取整形式类似于向下取整
	参数一: 要处理的数据
	参数二: 将参数一当成参二的进制数, 处理成十进制 取值范围(2~36)
	注意: 以数字开始读取,直到读取到非数字类型停止
	
parseFloat(string);		正常的小数

String(参数);		将参数转化为string类型的数据

_参数_.toString(redix);	将参数转化为string类型的数据
	redix: 将参数转化成 redix 对应的进制
	 注意: undefined 和 null 不能使用toString 转化
	可以和parseInt共同处理数据 达到进制转换的效果
	
num.toFixd(redix);	科学计数法,将num保留几位小数,并进行四舍五入的运算
	redix: 保留小数的位数

Boolean(参数);	将参数转化为 true 或 false
	注意: 除 undefined	  null	NaN	 ""	 0	false 这六个值返回false ,其他大部分均返回true

隐式类型转换

-	isNaN(参数);
	作用: 先用Number()对参数进行处理, 再与NaN进行比较 相等返回true 否则返回false
	null ---> false
	undefined ---> true
	
-	++/--   +/-(正负运算)
	++/-- : 先调用 Number() 再运算 无论是否成功转化 数据类型均变为Number类型
	+a,-a(正负) : 将a转化为number类型

-	+
	当 + 两边有一个是字符串时,会调用String()方法, 将两端类型均转为字符串
	没有字符串时 先调用number 再计算

-	- * / %	  ---> 调用 Number()

-	&& || !	  ---> Boolean()
	注意: 在调用Boolean()函数进行类型转换时 除 undefined	  null	NaN	 ""	 0	false 这六个值返回false ,其他大部分均返回true
	
-	> < >= <=
	当以上符号两端有一个数字时,会调用Number()

-	== !=
	undefined == null	==> 	true
	NaN != NaN
	注意: undefined 和 null 与其他类型作比较均为false

不发生类型转换的 === !==

===  !== 
	既判断数据类型 又判断数据大小

练习

typeof(a); ---> undefined
typeof(undefined);	---> string
typeof(NaN); ---> number
typeof(null); --->object
var a='123abc';
typeof(+a);	---> number (NaN)
typeof(!!a); ---> boolean
typeof(a+''); ---> string
1=='1'; --->true
NaN==NaN; ---> false
NaN==undefined; ---> false
'11'+11; ---> 1111
1==='1'; ---> false
parseInt('123asd');	---> 123
var num=112.34345;
num.toFixd(3); ---> 112.343
typeof(typeof(a)); ---> string

- 函数 小练习 初始作用域

函数 ( 高内聚,弱耦合 ) 不定参

定义
	函数声明: 函数命名规则符合 小驼峰 原则
	函数表达式:	(一般指匿名函数表达式)
		方式一: 命名函数表达式
		function 函数名(){	}	---	函数.name = 函数名
		方式二: 匿名函数表达式 / 函数表达式
		var text = function (){	}	---	函数.name = text
		方式三: 	函数.name = aaa
		var text = function aaa(){	}
组成形式
	函数名称: 函数命名规则符合 小驼峰 原则
	参数:	形参( 形式参数 )	实参( 实际参数 )
	返回值( return )作用:
		1 有终止函数的意思,其后的代码块不再执行
		2 返回值 用于接收函数内部的返回值

//	a,b 即为形参
//	arguments 是一个伪数组 有长度 arguments.length 可遍历用于存储传入的所有实参
//	函数也有长度属性 例: sum.length 指的是形参的个数
function sum(a,b){	//	var a,b;
    //	形参和arguments是两个独立的个体,但彼此之间有映射关系,所以一个变化另一个也跟着变化
    var c=a+b;
    document.write(c);
    // return 之后的语句不再执行 并返回123
    return 123;
    document.write(arguments,sum.length);
}
//	调用函数时,传入的22,33为实参
var res=sum(22,33);
//	res 用于接收函数内部的返回值 123
console.log(res)

练习

//	1 写一个函数,功能是告知你所选定的动物叫声
function scream(animal){
    switch(animal){
        case 'dog':
            console.log('wang!!');
            break;
        case 'cat':
            console.log('miao~~');
            break;
        case 'fish':
            console.log('o~o~o~');
            return;
    }
}

//	2 实现加法计数器
function sum(){
    var res;
    for(var i=0;i<argumens.length;i++){
        res+=arguments[i];
    }
    document.write(res);
    console.log(res);
}

//	3 定义一组函数,输入数字, 逆转 并 输出 汉字形式
//	reverse()实现数字逆转
function reverse(){
    var num=window.prompt('请输入数字');
    var str='';
    for(var i=num.length-1;i>=0;i--){
        str += transfer( num[i] ) ;
    }
    console.log(str);
}
//	transfer()实现汉字输出
function transfer(num){
    switch(num){
        case '1':
            return '壹';
        case '2':
            return '贰';
        ...
    }
}

//	4 实现n的阶乘	(递归实现)
var n=window.prompt('请输入数字');
function mul(n){
    //	方法一	for循环实现
    var num=1;
    for(var i=1;i<=n;i++){
        num*=i;
    }
    //	方法二	递归实现
    if(n==1){
        return 1;
    }
    return n*mul(n-1);
}

//	5 实现斐波那契数列	1 1 2 3 5 8 13 ...
	var n=parseInt(prompt('请输入自然数'));
	var a=1,b=1,c;
	for(var i=0;i<n-2;i++){
		c=a*b;
        a=b;
        b=c;
    }
	document.write(c);

初识作用域

定义:
	变量(变量作用于又称上下文)和函数生效(能被访问)的区域
作用域分为
	全局(window)作用域:	全局作用域之中的变量称之为 [全局变量]
	局部作用域:	局部作用域之中的变量称之为 [局部变量]
注意:	
	1 全局作用域内不可以访问局部变量	但局部作用域内可以访问全局变量以及其祖籍变量
	2 函数内部是局部作用域 函数内部作用域彼此独立

作业 (银行家算法)

//	输入一串低于10位的数字,输出这串数字的中文大	(银行家算法)

- 递归 预编译 (上)

递归

递归重点:	1 找规律	2 找出口
优点:	让代码更加简洁

//	求n的阶乘	1 规律 n*(n-1)	2 已知条件当出口
function mul(n){
    if(n==1 || n==0 ){
        return 1;	//	2 出口
    }
    return n*mul(n-1);	//	1 规律
}

//	求斐波那契数	1 1 2 3 5 8 13 ...
//	1 规律 n=(n-1)*(n-2)		2 出口 第一位和第二位 恒等于1
var n=parseInt(prompt('请输入自然数'));
function fb(n){
    if(n==1||n==2){
        return	1;	//	出口
    }
    return fb(n-1)+fb(n-2);	//	返回找到的规律
}

预编译

- js运行三部曲:	语法分析	预编译	解释执行
- 注意: 函数声明整体提升 / 变量 声明提升

> 预编译前奏
- imply global 按时全局变量: 即任何变量 若变量未经声明就赋值 此变量就为全局对象(window)所有
- 一切声明的全局变量 全是window的属性		window 即 全局
- 赋值从右向左 声明从左向右

> 函数预编译 发生在函数执行的前一刻	步骤如下:
- 1 创建AO( Activation Obiect )对象 即 执行期上下文
- 2 找形参和变量声明 将变量和形参作为AO属性名 值为 undefined
- 3 将实参值和形参统一
- 4 在函数体里面找函数声明 值赋予函数体 

> 全局预编译	 发生在全局执行的前一刻
- 1 创建GO对象 即 执行期上下文
- 2 找形参和变量声明 将变量和形参作为GO属性名 值为 undefined
- 3 在函数体里面找函数声明 值赋予函数体
- 注意: window == 全局 == GO