Javascript入门——语法基础汇总

Javascript是什么?

javascript是一种具有函数优先的轻量级,解释型或及时编译型的编程语言。它是在在1995年由网景公司的Brendan Eich花了10天时间开发而成的,其标准是ECMAScript。

因为当时Java语言非常红火,所以网景公司希望蹭Java的热度进行推广。而微软看到Javascript已经火了起来,于是模仿javascript开发出了JSsscript。为了让Javascript成为全球标准几个公司联合ECMA组织定制了Javascript语言的标准,被称为ECMAScriot标准。

JAVAScript的嵌入方式
理论上来说,JavaScript代码可以嵌入在网页的任何地方,但是我们通常把它放在标签中。

JavaScript有三种嵌入方式分别是内嵌式、外链式、事件引入。其格式如下:

内嵌式: 放在标签中

外链式:

事件引入:

JavaScript注释方式

使用注释可以提高代码的可读性,它的注释方式如下:

//       单行注释

/*  */  多行注释

注:在开发中应多用注释,这样方便自已后续修改代码,以及给相关的其他开发者带来方便。

JavaScript的输出方式

document.write("内容");    向文档写入html表达式或JS代码,在窗口显示

console.log("内容");    在控制台输出  常用在调试中

alert("内容");  警告框,在窗口弹出弹窗。

alert();函数会阻断JavaScript程序的执行,从而造成副作用;

console.log()仅在控制台中打印相关信息,因此不会有这种副作用。

变量


什么是变量?

变量就是可变的量,与其对应的是常量。它其实是在内存里申请一块空间,用于存储对应的数据,是用来存储某种数值的存储器。

变量的命名

变量的命名不是任意的,它有一些规则:

1、必须以字母、下划线或美元符号开头,后面可以跟字母、数字、下划线。

2、区分大小写。大写字母和小写字母是两个完全不同的量

3、不允许使用JavaScript关键字和保留字作为变量名。

变量声明 

声明变量语法: var 变量名

  var a;  定义了一个变量,名字为a;

初始化变量

var a = 50;  初始化变量a,把50赋值给a;

变量赋值

var a;

a=50;

先定义变量,再给他赋值;

基本运算符

一、加法运算 +

在JS里可以用 "+" 来表示加法运算符

如:document.write(1+2);

var a = 5; var b = 5; var c = a+b;

注意一下,"+"不仅可以表示加法运算符,还可以用来表示字符串的拼接。

如: var a = "Hello";

var b = a + "world";

二、减法运算符 -

在JS里可以用 "-" 来表示减法运算符

如:document.write(3-2);

var a = 5; var b = 5; var c = a-b;

三、乘法运算符 *

在JS里可以用 "*" 来表示乘法运算符

如:document.write(5*5);

var a = 5; var b = 5; var c = a*b;

四、除法运算符 /

在JS里可以用 "/" 来表示除法运算符

如:document.write(5*5);

var a = 5; var b = 5; var c = a*b;

五、取余运算

在JS里可以用 "%" 来表示除法运算符

"取余"就是在整除之后余下的数。

如:f=a%b; f是a与b相除取得余数

二、自增自减
自增 a++

a++ 等价于 a = a+1;

如: var a = 5;

        a++;

        document.write(a);         输出6

自减 a--

a-- 等价于 a = a-1;

如: var a = 5;

        a--;

        document.write(a);         输出4

注意:

第一块

var a = 20;

document.write(++a);        输出21

第二块

var b = 20;

 document.write(b++);        输出20

第三块

var c = 20;

 document.write(c--);        输出20

注意比较上边的三个块,第一块的输出结果是我们所期望的21,而第二块和第三块的结果的输出结果都是20,而不是我们认为的21和19,这是因为++和--在变量之后,这表示运算完成之后,再将其值加1,而第一块因为++在变量之前,所以先进行加1,然后再输出。

三、比较运算符
比较运算符有大于>,小于<,小于等于<=,大于等于>=,等于=,不等于!=

比较运算符返回布尔值(true、false)

alert(2>4)        //返回false;

alert(3>1)        //返回true;

alert(3>5)        //返回false;

alert(2 == 2)   //返回true;

alert(2 != 2)    //返回false;

四、逻辑运算符
逻辑运算符在离散数学和电子电路技术中经常用到,在处理一些复杂关系时很有帮助。

逻辑与  &&

true && true    true

true && false   false

false &&  true   false

false && false  false

只用两个都为真,整体才能为真,否则都为假。 

逻辑或  ||

true && true    true

true && false   true

false &&  true   true

false && false  false

只要有一个及以上的真,即为真。

JS分支与循环

分支
if条件结构是根据条件判断之后再做处理

语法:基本的if语句

if(条件){
//语句

}

if-else语句

if-else语句是根据条件输出不同的语句

语法: 基本的if-else语句

if(条件){
//语句1

}else{
//语句2

}

eg.小明考试及格,妈妈奖励他一本练习册,考试不及格,妈妈奖励他大嘴巴子。使用if语句实现。

var score = prompt("请输入小明的考试成绩');

if(score >= 60){
alert("小明,这是你的练习册!");

}else{
alert("看招!");

}

if与if-else条件执行顺序?

if是只要条件成立便执行,而if-else则是条件1成立执行语句1,否则执行语句2

多重if结构

多重if语句就是else部分还包括其它else

语法:基本的if语句

if(条件){
//语句1

}else if(){
//语句2

}else{
//语句3

}

switch结构
基本结构

switch(表达式) 计算表达式的值

{
case 常量1:

语句;                        如果等于常量1,则执行此语句;

break;

case 常量2:

语句;                          如果等于常量2,则执行此语句;

break;

default:

语句; 如果没有找到匹配值,则执行

}

eg. 输入数字,输出相应的日期

var day = prompt();

switch(day){
case 1:

alert("星期一);

break;

case 2:

alert("星期二);

break;

...........

}

注意:如果需要每个case执行完后跳出,在每个case后不要忘记写break;

switch与多重if结构的区别

相同点:都可以实现多分支结构

不同点:switch只能处理等值的条件判断,且条件是整形变量或字符变量的等值判断,而多重if结构处理else部分还包括其他if结构,特别适合某个变量处于某个区间时的情况

循环

while循环

在没有学习循环之前,如果要输出“我爱你”1000次,我们通常的做法可能是console.log("我爱你")*1000,但是这样会浪费大量的时间和空间。而如果使用了循环,这些不必要的过程就可以省掉。

while(循环条件){//符合条件,循环继续执行;否则,执行退出。

循环操作          //循环中被重复执行

}

例如上边输出我爱你的例子。

var love = 1;

while(love <=1000){
        document.write("我爱你");

}

do-while循环

通过上边的介绍可以发现,while循环必须先判断,在执行。而do-while不一样,它是先执行,然后再判断。

do{
        循环操作

}while("循环条件");

do-while与while的区别

while是先判断再执行,do-while是先执行再判断。

当初始情况不满足循环条件时

while循环一次也不会执行,

do-while循环不管任何情况都至少执行一次,至少执行一次。

你可能感兴趣的:(javascript,前端,css,html)