javascript基础初识

一、javascript初识

1.1 javascript是什么

javascript是一种可以用来网页增加交互性的编程语言。
javascript是可插入html页面的编程代码
javascript插入html页面后，由浏览器执行
javascript是一种面向对象的编程语言
javascript是解释型编程语言。

1.2 亲切的hello world

	<button type="button" onclick="alert('hello world!')">点击这里</button>

1.3 javascript和java的区别

    虽然javascript与java有紧密的联系，但确实两个公司开发的不同的两个产品。Java是sun公司推出的面向对象的程序设计语言，特别适合于internet应用程序开发。
    Javascript是netscape公司的产品，其目的是为了扩展netscapenavigator功能，而开发的一种可以嵌入web页面中的基于对象和时间驱动的解释性语言，它的前身是livescript。

1.4 javascript几个基本特点

Javascript语言脚本语言基于对象事件驱动安全跨平台

1.5 面向对象

    Javascript是种脚本语言，它可以用来制作与网络无关的，于用户交互作用的复杂软件，他是一种基于对象（object based）和事件驱动（event driver）的编程语言，因而它本身提供了非常丰富的内部对象供设计人员使用。
    Javascript是一种解释型的编程语言，其源代码在发往客户端执行之前不需要经过编译，而是将文本格式的字符代码发送给客户编由浏览器解释执行。

1.6 代码编辑

    Javascript的代码是一种文本字符格式，可以直接嵌入html文档中，并且可动态装载，编写html文档就像编辑文本文件一样方便。

1.7 javascript代码格式

Javascript的基本架构
Javascript嵌入到html中
Jacascrip保存为文件，外部引入js
Javascript程序代码的英文大小写字母是不同的。

1.7.1程序语句

程序语句结束符号“；“

1.7.2程序批注

”//“单行的注释
“/“和”/“多行的注释

1.8javascript可以做什么

Javascript做页面端动态的交互，动态的东西包括但不限于：表单提交验证、样式改变、用户操作监控与相应、自动化处理、异步加载、页面游戏开发、音频视频处理、图形界面、页面游戏开发、音频视频处理

1.8.1javascript不可以做什么

javascript是一种客户端语言。设计他的目的是在用户的机器上而不是服务器上执行任务，因此，javascript有一些固有的限制，这些限制主要出于如下安全原因。
Javascript不允许写服务器机器上的文件。
不能做读写数据库服务器相关的操作。
不是后台的程序开发语言。
当然有人觉得通过node可以进行服务端的操作，但是javascript是解释性语言，node就像浏览器一样只不过把javascript转成c/c++代码运行，所以这里见仁见智吧；

1.9javascript组成

一个完整的javascript实现是由以下3个不同部分组成的
核心（ECMAScript）–js的核心ECMAScript描述该语言的语法和基本对象。
文档对象模型（DOM）–dom描述了处理网页内容的方法和接口
浏览器对象模型（BOM）–bom描述了与浏览器进行交互的方法和接口。

二、javascript关键字和标识符

2.0javascript关键字和标识符

Javascript关键字是指在javascript语言中有特定含义，成为javascript语法中一部分的那些字。
关键字不能成为变量名和函数名使用。

Break	do	instanceof	typeof	case	else	Volatile
cinally	return	void	continue	for	switch	Double
debugger	this	with	while	default	public	Import
if	throw	delete	in	try	Abstract	Protected
Int	Short	Boolean	Export	char	Static	Implements
Extends	Long	Interface	Super	Final	Native	Debugger
Throws	var	function	catch	Enum	Bute	Transient
Class	new	Goto	Const	Float	Package	Private

2.1javasccript变量和常量

常量又叫直接量,可以分为以下几个类别:
数值型（number）
布尔型（boolean）只有true和false
字符型（string）
空值null
未定义undefined。
以上几种类型，又叫js原始数据类型；当然由于这里只是解释变量和常量es6新增symbol,基本数据类型、引用数据类型等不详尽解释；
变量：主要作用是存取数据，提供存放信息的容器

2.1.1变量的命名

不能使用javascript中的关键字作为变量
一个有效的变量，必须以字母开头，中间可以出现数字如text1、test2等
除下划线”_”作为连字符外，变量名称不能有其他符号
区分英文字母大小写

2.1.2变量的声明

Javascript变量可以在使用前先做声明，并可赋值，通过使用var关键字对变量做声明。

var str='hello world';
var num =120;
alert(str);
alert(num);

由于js是弱类型语言，并不严格需要对变量的声明，所以JS中变量声明又分显式申明和隐式申明。

　　var i=10;//显式申明
　　i=10;//隐式申明

隐式声明时变量会默认为全局变量，当变量数量增多，引用复杂后，不进行变量的局部声明定义将会是一场灾难，所以我们仍需要时刻注意对变量的局部声明；

说道声明，简单说一下声明提升，也是面试时经常会问到的一个问题；
例如我们声明一个变量

var a = 10;

看起来我们直接生命了一个变量a=10;但是js在编译时，会将这部分拆分成两段var = a声明部分，以及a = 10赋值部分;而所有的声明部分会放在所在的作用域的顶部，这个过程称为声明提升。同样声明一个函数时也会进行声明的提升,并且函数的优先级会比变量更高；

	console.log(a)
	function a(){console.log('a')}
	var a = 123;
	//log的结果为ƒ a() { console.log('a') }

再上一到面试题：

	+function(){
        alert(a);
        a();
        var a=function(){
            console.log(1);
        }
        function a() {
            console.log(2);
        }
        alert(a)
        a()
        var c=d=a;
    }();
    alert(b)
    alert(c)

这里就不放结果了，自己cv到console里打个断点看一眼更好理解；这种类型的题目经常是一看就会，稍微变个形，一做就废，所以只能说多看多练才能熟练掌握；

2.2 javascript表达式

在定义完变量后，就可以对他们进行赋值、改变、计算等一系列操作、这一过程通常有叫称一个叫表达式来完成，可以说他是变量、常量、布尔及运算符的集合，因此表达式可以分为算术表达式、字串表达式、赋值表达式以及布尔表达式

2.2.1算术运算符

Javascript中的算术运算符有单目运算符和双目运算符。

运算符	描述	例 y=5	结果
+	加	X=y+2	X=7
-	减	X=y-2	X=3
*	乘	X=y*2	X=10
/	除	X=y/2	X=2.5
%	求余数（保留整数）	X=y%2	X=1
++	递加	X=++y	X=6
–	递减	X=–y	X=4

此外还有三目运算符==?:==来进行简单的条件运算；一下两段代码执行结果是一致的

	if(a>b){
    	max=a;
	}else{
    	max=b;
    }
	//等价于
 	max=a>b?a:b

对于链式写法不同的运算符有着自己的优先级，有兴趣可以戳链接了解下，这里先不赘述
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_Precedence

2.2.2 比较运算符

比较运算符他的基本操作过程是，首先对他的操作数进行比较，然后返回一个true或false的值，有7个比较运算符。

运算符	描述	例 x=7	结果
==	等于	X==8	false
===	全等于（值和类型）	X === “7”	false
！=	不等于	X!=8	true
>	大于	X>5	true
<	小于	X<5	false
>=	大于或等于	x>=8	false
<=	小于或等于	X<=8	true

2.2.3 布尔逻辑运算符

Boolean运算符有三种：&&、||、和！。
下面的真值表描述了逻辑&&运算符的行为

运算数1	运算数2	结果
True	True	True
True	False	False
False	True	False
False	False	False

下面的真值表描述了逻辑 | | 运算符的行为

运算数1	运算数2	结果
True	True	True
True	False	True
False	True	True
False	False	False

逻辑！运算符的行为如下：
如果运算数是数字0，返回true，
如果运算数是0以外的任何数字，返回false，
如果运算数是null，返回true，
如果运算数是undefined，发生错误。

三、javascript的语句

3.1输出语句

	document.write()//输出到页面的内容（document-方法）
	alert()//弹出警示框
	console.log()//输出到调试窗口

转义字符
Javascript中有些以反斜杠\开头的不可现实的特殊字符。通常称为控制字符，
/b表示退格符；/n折行；/f表示换页；/r表示回车符；/t表示tab符号；/‘表示单引号‘/“表示双引号。

3.2表达式语句

1赋值型

	x=y;
	x=y+z;
	x='hello'

2复合型

	{
		var name='world'；
		document.write（'hello,'+name）;
	}

3.2if语句

结构

	if（表达式）{
	//当表达式结果为真是，执行的代码段
	}else{
	//当表达式结果为假是，执行的代码段
	}

3.3switch语句

结构

	switch（表达式）{
		case值1：
		//当表达式的值等于值1时候，执行的代码段
		break；（跳出）
		case值2：
		//当表达式的值等于值1时候，执行的代码段}
		break；
		default：//当表达式的值没有找到匹配的值的亲况下执行的代码段
	}

3.4for循环语句

结构

for（初始化数值；条件表达式；增量表达式）{code}
//当条件表达式值为真时，执行下边的代码。

说明：
初始化参数告诉循环的开始位置，必须赋予变量的初值，
条件适用于判别循环停止时的条件。若条件满足，则执行循环体，否则跳出
增量：主要定义循环控制变量在每次循环时按什么方式变化；
三个主要语句之间，必须是用分号分隔。
Break语句
Break；Break语句从for循环中跳出，跳出switch代码段；
Continue语句；从循环中跳过当前循环的剩下一部分，执行下一次循环。

3.5 for循环语句的嵌套

结构(100以内质数,面试题)

for（var i=2;i<=100;i++）{//遍历100以内所有的数
    var ctrue=true;//假设所有传过来的数字均为质数	
    for（var j=2; j<I;j++){//j永远不等于i
		if（i%j==0）{
			ctrue=false;
		}
	}
	if(ctrue){
		document.write(i);}
	}
}

3.6 while循环语句

结构

while(条件表达式){
	//当条件表达式的值为真时，执行下面的代码段。
}

3.7do while 循环语句

结构

do{
	//当条件表达式值为真时，执行下边的代码
}while（条件表达式）