js基础第一天

1.历史

1.什么是JavaScript
- 1995年在网景公司，发明的JavaScript。一开始JavaScript叫做LiveScript，但是由于当时Java这个语言特别火，就改名为JavaScript,同时期还有其他的网页语言，比如VBScript、JScript等等，但是后来都被JavaScript打败，所以现在的浏览器中，只运行一种脚本语言就是JavaScript,简称:JS。
2.JavaScript与ECMAScript的关系
- ECMAScript是一种由Ecma国际前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Association，制定的标准。
  JavaScript是由公司开发而成的，公司开发而成的一定是有一些问题，不便于其他的公司拓展和使用。所以欧洲的这个ECMA的组织，牵头制定JavaScript的标准，取名为ECMAScript。
  简单来说ECMAScript不是一门语言，而是一个标准。符合这个标准的比较常见的有：JavaScript、Action Script（Flash中用的语言）
3.JavaScript作用
- 在HTML网页中，主要分为三大块:HTML、CSS、JavaScript
  - HTML从语义上构造网页
  - CSS从审美上美化界面
  - JavaScript从交互上提升用户的用户体验
4.js被称为对初学者友好的语言

2.第一个JavaScript程序

1.Script标签的说明
- 位置: 可以放在html中的任意位置,但是最好放在body的结束标签上面
- 和style标签一样type可以省略不写

2.演示helloWorld

  // 括号里面只能放字符串/数值/元素/对象
  alert('hello world');

3.JavaScript中的注释
- 单行注释: 以 // 开头,后面的内容就是注视
- 快捷键 ctr(cmd) + /
- 多行注释: /**/ 多行注释可以换行,但是不能嵌套
- 快捷键 ctr(cmd) + shift + /

3.变量

1.概念: 变量是用来存储信息的容器

2.使用一个变量分为3步

  a.声明变量 用var来定义一个变量例如 var a;
  b.赋值 赋值采用 = 来赋值  a=10;
  c.使用
  声明的一个变量的时候可以直接赋值 例如 var b = 20;

3.变量的命名规范

  1.以字母 a-z A-Z 数字0-9 字符 _ $ 组成
  2.变量不能以数字开头, 不能使用关键字命名
  3.变量的命名采用驼峰命名法 首个单词字母小写,后面的单词首字母大写 例如 lastName

变量命名不能和保留字重名
[图片上传失败...(image-e67c7-1511529697813)]
[图片上传失败...(image-94c5d1-1511529697813)]

4.变量的类型
- 变量类型为5种
  - 字符串(string)
  - 数字(number) 0-9
  - 布尔(boolean) true/false
  - 对象(object)
  - 未定义(undefined)
  用 console.log(typeof a);来查看输出的类型
  
  typeof 关键字用来输出变量的类型

5.控制台输出

  console.log(1); // 输出普通日志
  console.warn('1'); // 输出警告日志
  console.error('1'); // 输出错误日志
  输出日志的快捷键
  a.log + enter

4.运算符

1.算数运算符 + - * / %(取余/取模) ++ --

  var a = 5;
  var b = 10;
  var c = a + b;
  var d = a - b;
  var e = a * b;
  var f = a / b;
  var g = a % b;
  a++;
  a--;

2.算数运算符的优先级, 先乘除(取余)后加减

  var a = 2 + 3 * 4; 结果是 14
  如果想提升优先级的话用 ()来提升
  var a = (2 + 3) * 4; 输出 20
  如果要 a = a + 5;可以简写成 a+=5;

3.关系运算符
```
  > < == >= <= != ===
```
- 关系运算符得到的结果为布尔值
- 关系运算符不能连用,如果想连用用逻辑运算符

4.逻辑运算符

  && || !
  && 有假则为假
  || 有真则为真
  ! 取反

逻辑运算符参与运算的是布尔值

5.if语句

1.if语句

  在开发中需要判断条件执行代码的时候需要用if语句
  if(判断条件){
      当条件为真的时候执行代码
  }

2.if else

  if(判断条件){
      当条件为真的时候执行代码块
  }else{
      当条件为假的时候执行代码块
  }

else 可以省略

3.三目运算符: 判断条件 ? 语句1 : 语句2
- 当判断条件为真执行语句1, 为假执行语句2

4.if else语句特点: 只能执行一个代码块

  if(判断条件1){
      当为真的时候执行代码块 1
  }else if(判断条件2){
      当为真的时候执行代码块 2
  }else if(判断条件3){
      当为真的时候执行代码块3
  }else if(判断条件4){
      当为真的时候执行代码块 4
  }else if(判断条件5){
      当为真的时候执行代码块 5
  } 
  ...
  else{
      当以上所有的条件都不为真的时候执行代码块
  }

6.switch语句

switch (变量){
    case 值1:
        语句1;
        break;
    case 值2:
        语句2;
        break;
    case 值3:
        语句3;
        break;
    case 值4:
        语句4;
        break;
    ...
    default:
        语句n;
        break;
}
使用 break 来阻止代码自动地向下一个 case 运行

案例星期一到星期日

7.循环

1.for循环

  for（单次表达式;条件表达式;末尾循环体）
  {
      中间循环体；
  }

终止循环用break
终止本次循环用continue

2.while循环

  while(判断条件){
      循环体 
  }

3.do-while循环

  do{
      循环体
  }while(判断条件)

while循环和do-while循环的区别是 do-while循环先执行代码,再判断,while循环是先判断再执行代码

8.函数

1.函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块

2.函数是用来封装特定的功能的代码块利用函数可以提高代码的复用性

  function 函数名() {
     函数体/要执行的代码
  }   
  函数只有调用的时候才会执行封装的代码
  函数调用 函数名()

3.函数可以传递参数

  function sum(a,b) {
      alert(a+b);
  }
  sum(1,2);

4.获取函数实际传入参数的个数,和定义传入参数的个数

  function sum(a,b) {
  // 获取函数的实际传入的参数的个数
  console.log(sum.arguments.length);
  // 获取函数定义的参数个数
  console.log(sum.length);

  alert(a+b);
  }
  sum(1,2,3);

5.函数的返回值

  function sum(a,b) {
      return a+b;
  }
  // 将函数执行的结果赋值给变量 s
  var s = sum(1,2,3);
  console.log(s);

使用return 结束并返回 return后面的代码不再执行

6.函数的变量提升
```
  var a = 10;
  function fn() {
      console.log(a);
      var a = 20;
  }
  fn();
```
如果函数内部有变量和函数外部的变量是一样的,会优先取函数内部的变量
如果在使用后面定义变量,这个时候就会将函数的声明定义在使用之前,而赋值还在函数后面

116409-106.jpg