第五周预习——JavaScript 基础语法

JavaScript基础介绍 JavasScript在web应用中的作用

JavaScript语言风格

JavaScript引用方式

（1）页面中：

（2）引用JS文件：

调用方法

使用console.leg();将内容输出到调试台。

变量 基础语法

变量命名规范

（1）命名范围：数字、大小写字母、下划线_、美元符号$（注：不能以数字开头）。

（2）变量命名潜规则：全大写为常量。

（3）定义的自由：可以不用var。

数据类型 1、全部数据类型

类型	定义规范	类
字符串	var str=" ";	String
数字	var num=0;	Number
对象	var obj={ };	Object
数组	var arr=[ ];	Object(Array)
布尔型	var bool=ture;	boolean
函数	var fun=function( ){ }	Function
其他类型	null、undefined、NAN	。。。

2、字符串

（1）4个比较重要的属性方法

例子：var str="hello world"
以数值的方法访问一个字符	str[0]  ----->"h"
在字符串中查找某字符	str.indexOf("h")  ----->0
替换字符串的某一段	str.replace("hello","hi")  ----->"hi world"
字符串长度	str.length  ----->11

（2）字符串的单引号和双引号的区别：

在JS中，单引号和双引号是可以互换的，但需要注意嵌套关系。

3、数字

（1）取出字符串中的整数：

parseInt("1.23abc")  ----->1

（2）取出字符串中的分数：

parseFloat("1.23abc")  ----->1.23

4、对象

（1）对象的语法格式

例子：

var myComputer={
    name:"wodediannan",
    brand:"apple",
    price:4888
};

• 对象的内容使用{}包围
• 内容为键值对的形式
• 键不需要括号，遵循变量命名规范
• 值可以为任何类型
• 键值对之间以逗号隔开，最后一个不需要

（2）对象的访问语法

• 点语法：myComputer.price  
• 方括号语法：myComputer[price]  

（3）对象的特殊性质

对象的数据不赋值即是获取。

例子：

myComputer.cpu ----->undefined

myComputer.cpu="i7-7009k"  ----->myComputer={name:"mname:"wodediannan",brand:"apple",price:4888,cpu="i7-7009k"}

5、数组

（1）基础语法

例子：

var score_1=[98,60,75,33]

• 每个数据以逗号隔开
• 以方括号（下标）访问：例：score_1[0]  ----->98

6、对象与数组相互嵌套

（1）数组中嵌套对象

例子：

var ComputerList=[
  {
    name:"我的电脑",
    brand:"apple",
    price:4888
  },
  {
    name:"他的电脑",
    brand:"lenove",
    price:5999
  }
]

访问电脑中第一台电脑的价格?

• computerList[0].price
• computerList[0][price]

（2）对象中嵌套数组

例子：

var myComputer={
    name:"wodediannan",
    brand:"apple",
    price:4888,
    app:["qq","chrome","微信"]
};

访问我的电脑里的第三个app?

• myComputer.app[2]
• myComputer[app][2]

（3）对象和数组的关系

数组是一种特别的对象。

（4）对象和数组的区别

对象的特点	数组的特点
内容是无序的	内容是有序的
访问方式有两种	访问方式只有一种
	具有长度属性

7、布尔型

var isBegin=false;

只有两个值：ture、false。

8.函数

（1）定义函数:

 （2）执行函数

调用函数：add(3,5)  ----->传入参数a=3,b=5。

（3）在JS中的两种函数定义方式

• function add( ){ }         定义了一个名字为add的函数。
• var add=function( ){ }        定义了一个没有名字的函数，然后使add这个变量名来指向他。

两种使用没有太大区别，但由于一些原因，一般使用后者。

（4）函数作用域

例子1：h1可以使用。

var h1="hello world";
var fn=function(){
    console.log(h1);
}

例子2：h1不可以使用。

var fn=function(){
    var h1="helllo world";
}
console.log(h1)

总结：外面定义了，里面可以用；里面定义了，外面用不了。

（5）函数关键词return和arguments

return:函数遇见return后，立即停止执行，然后返回return结果。

arguments:函数全部参数，类似于数组。

（6）函数作为构造器，用于产生对象

定义构造器：

var Computer=function(price,brand){
    this.price=price;
    this.brand=brand;
    this.start=function(){
               console.log("开机")
    }
}

调用构造器：

var com_1=new Computer(1000,"apple");
{
    price:1000,
    brand:"apple",
    start:function(){/*...*/}
}

关于构造器的5点：

• 对象的属性和方法：对象的函数称为方法，其余为属性。
• 首字母大写：没有语法限制，只用来区别构造器和函数。
• this关键词：在构造器中this跟着变量成了返回的对象的属性。
• 无return：作为构造器，主要的作用就是用于产生一个对象，所以不需要return。
• new语法：构造器专属关键词，用于使构造器产生一个对象。

（7）函数和构造器混用的情况

var Computer=function(name,price){
    this.name=name;
    return "运行结束";
    this.price=price;
}

使用函数调用：Computer("apple",3000)

• 结果返回“运行结束”
• name属性去到全局上
• this这个时候代表的是window
• 不会运行到price那一行

使用构造器调用：var a=new Computer("apple",3000)

• 结果返回对象，不运行return。
• 对象a带有属性name，不带有price。
• 不会运行到price那一行。

9、null、undefined和NaN

（1）null 就是什么都没有

注：typeof(类型）null  ----->"object"

（2）undefinrd 未定义

例：var test;  ----->test="undefined"

注：type undefined  ----->"undefined"

（3）NaN （Not a Number）

例：parseInt("asd")  ----->NaN

注：type NaN  ----->"number"

运算符 1、算数运算符

（1）算数运算符

	符号	作用
基本运算符	+	相加
	-	相减
	*	相乘
	/	相除
自运算	++	自增
	--	自减
等运算	+=	加等
	-=	减等
	*=	乘等
	/=	除等

（2）数字和字符串之间的运算

例1：1+1+"hello world"

结果："2helllo world"

例2："hello world"+1+1

结果："hello world11"

结论：运算从左到右，遇到字符串后数字转为字符串进行相加。

2、逻辑运算符

符号	作用
&&	且运算
||	或运算
==	等判断
！	取反
>	判断是否大于
>=	判断是否大于等于
<	判断是否小于
<=	判断是否小于等于

3、三元运算符

一个简单地判断方式

[条件]?[ture执行代码]:[false执行代码]

循环控制、条件判断 1、循环控制、条件判断的种类：

• if...else判断语句
• switch选择语句
• while循环
• do...while循环
• for循环

2、if..else判断语句

（1）基本语法：

if(条件判断）{

   如果为ture的代码
};
else{
   如果为false的代码
}

（2）if可以单独使用，并且if和else在只有一行时可以省略花括号。

if(条件) 代码；
else   代码；

（3）if...else if...语句可以无限嵌套

if(条件）{  代码  }
else if(条件) {  代码  }
else if(条件) {  代码  }
else {  代码 }

3、switch选择

（1）基本语法：

var inputNumber=function(number){
  switch(number){
    case 1:
      代码
      break;
    case 2:
      代码
      break;
    default:
  }
}

（2）关键词介绍：

关键词1：switch  定义一个switch语句，接受参数。

关键词2：case  定义此switch的一种情况，对应则执行后面的代码块。

关键词3：break  此case完成后跳出此switch，否则会继续执行后面的case。

关键词4：default  定义一种情况，当上方case全部不符合时的执行情况。

4、while循环

while(条件）{
   执行的代码
}

特殊情况：死循环。

while(true){
   执行代码
}

由于条件一直为true,会一直执行while循环

5、do..while

do{
  执行的代码
}
while(条件)

6、for循环

for（初始条件；判断条件；自增条件）{
   执行代码
}

7、continue和break

continue:标记当前循环已完成，继续下一次循环。

break:之间退出当前循环。