Day22 js基础

1 js简介

• 什么是js
  • js是JavaScript的缩写，是一门唯一的用来控制网页内容的脚本语言；
  • 是web标准中的行为标准-用来控制网页内容的变化
• .js写在什么位置
  • 内联 - 将js代码写在标签的事件相关属性中,例如：onclick属性
  • 内部 - 将js代码写在script标签中(既可以放在head标签中也可以放在body标签)
  • 外部 - 将js代码写在js文件中, 然后通过script标签导入
• js能做什么事情
  • 修改标签内容
  • 修改标签属性
  • 修改标签样式
  • 添加内容
• 怎么写js代码？
  • js语法

    
        
        
    
    
        
        
        按钮
        
        
        
        
        
        
        
        
我是段落
        修改内容
        


        
        
        
        修改图片
        


        
        
        
我是一段文字
        修改样式
        
        
        
     

2 js 语法基础

2.1 注释(和C语言注释一样)

//单行注释：在注释文字前加//
/*
多行注释1
多行注释2
*/

2.2 标识符

• 由字母、数字、下划线和$符组成，数字不能开头。
• 注意:$不轻易使用，在JQ有特殊的意义

num = 23
_num = 100

2.3 关键字

//for、if、var、while、func、true、false等....

2.4数据类型

• 类型名首字母都是大写的 js有以下数据类型 Number(数字)、String(字符串)、Boolean(布尔)、Array(数组)、Object(对象)
  • Number - 包含所有的数字(包括整数和小数),例如: 100, 0.23, -23, 2e5
  • String - 用双引号或者单引号引起来的字符集, 支持转义字符和编码字符
  • Boolean - 只有true和false两个值，分别代表真和假
  • Array - 相当于python中的列表, 用中括号括起来的多个元素。[12, 'abc', true, [1, 2, 3]]
  • Object - 类似python中字典和对象的结合
• typeof函数 查看数据类型
• 类型名(数据) - 类型转换
  • parseFloat(数据) - 将数据转换成浮点数
  • parseInt(数据) - 将数据转换成整数 数据类型不变 js里没整除，可以用parseInt实现
• 语句
  • 一行一般情况下只写一条语句,语句结束后可以有分号也可以没有；如果一行有多条语句，语句之间必须有分号
  • 缩进无要求
  • 大小写敏感

2.5变量

声明变量的语法

• 语法1:
  • 变量名 = 值
• 语法2:
  • var 变量名 / var 变量名 = 值
• 说明
  • 变量名 - 标识符、不能是关键字; 采用驼峰式命名
  • 声明变量如果没有给变量赋值(语法2才支持),变量的默认值是undefined

2.6 运算符

js支持数学运算符、比较运算符、逻辑运算符、赋值运算符、(位运算)

2.7 分之结构

js有if和switch两种分之结构

2.7.1 if分之

• 结构1: if
  if(条件语句){
  满足条件执行的代码块
  }
• 结构2： if-else
  if(条件语句){
  满足条件执行的代码块
  }else{
  不满足条件执行的代码块
  }
• 结构3：if-elif...else
  if(条件语句1){
  满足条件1执行的代码块
  }else if(条件语句2){
  满足条件2执行的代码块
  }

2.7.2 switch

• 语法:
  switch(表达式){
  case 值1:
  代码块1
  case 值2:
  代码块2
  case 值3:
  代码块3
  ...
  default:
  代码块N}
• 执行过程
  先计算表达式的结果，然后让这个结果按顺序从前往后和每个case后面的值进行比较。
  如果哪个case后面的值和表达式的结果相等，就将这个case作为入口，依次后面所有代码块，
  直到执行完最后一个代码块或者遇到break为止。
  如果每个case后面的值都和表达式的结果不相等，直接执行default后面的代码块（default可以不写）

2.8 循环结构

js中循环分为for循环和while循环

2.8.1 for循环

• for-in循环
  for(变量 in 序列){
  循环体}
  让变量依次获取序列中元素的下标(下标/属性名),一个一个取，取完为止，每取一个值执行一次循环体
• c中的for循环
  • for(表达式1;表达式2;表达式3){
    循环体 }
  • 执行过程:
    • 先执行表达式1，再判断表达式2的值是否为true;如果为true执行循环体，执行完循环体再执行表达式3；
    • 再判断表达式2是否为true,如果为true执行循环体，执行完循环体再执行表达式3；
    • 再判断表达式2是否为true,如果为true执行循环体，执行完循环体再执行表达式3；
    • 依此类推，直到表达式2的结果为false，循环结束
  • 相当于python中的以下结构:
    表达式1
    while 表达式2:
    循环体
    表达式3

2.8.2 while循环

• while循环
  while(条件语句){
  循环体}
  执行过程和python一样
• do-while循环
  do{
  循环体
  }while(条件语句)
  执行过程: 执行循环体，判断条件语句是否为true,为true再执行循环体，执行完循环体又判断条件语句是否为true，以此类推，直到条件语句为false循环结束

3 js函数

语法:
function 函数名(参数列表){
函数体}

4 字符串

##5 数组
~~~html

6 对象