后浪小萌新JS ---JS基础语法

一、认识js

什么是js

js是JavaScript的缩写, 是一门专门用来控制前端页面的编程语言(属于脚本语言)

js是web标准中的行为标准 - 主要负责网页中内容的修改

js代码写在哪儿

内联的js将js代码写在标签的事件属性中
内部的js将js代码写在script标签中
外部的js将js代码写在js文件中, 然后在html中用script标签导入

注意: 同一个script标签只能在导入外部js和写内部js两个功能中选一个

js能干什么

  1. 修改 / 获取 标签内容
  2. 修改 / 获取 标签的属性
  3. 修改标签的样式
  4. 在网页中插入html代码

js怎么写(语法)

大小写敏感

命名采用驼峰式命名

js中的标识符: 由字母、数字、下划线和$组成, 数字不能开头

二、变量

定义变量

语法:

  1. 变量名 = 值
  2. var 变量名 = 值
  3. let 变量名 = 值
  4. const 变量名 = 值

四种方法的区别

  1. 前三种方式定义的变量, 变量的值可以修改; 用const定义的变量的值不能修改
  2. 变量名 = 值 - 这儿的变量是全局变量(不管在哪儿定义)
  3. var 变量名 = 值 - 在函数中定义是局部变量, 没有定义在函数中就是全局
  4. let 变量名 = 值 - 在{}中定义的是局部变量, 没有定义在{}中的是全局

同时定义多个变量

变量名1 = 变量名2 = 变量名3 = … = 值

var/let/const 变量1,变量2,变量3,…

举例:

   var a1,b1,c1 = 20
   console.log(a1, b1, c1)    // undefined undefined 20
   
   var b1,b2,b3   
   console.log(b1, b2, b3)    // undefined undefined undefined
   
   var c1=100, c2=200, c3=300
   console.log(c1, c2, c3) // c1=100, c2=200, c3=300

三、运算符

数学运算 : +、-、*、/、%、**、++、- -

                 ++(自增1)、–(自减1)

                 变量++、++变量

注意: ++/–放在前面和后面的时候的不同,放在后面先赋值后加减,放在前面先加减后赋值

比较运算符 : >、<、>=、<=、==、!=、===、!==

                     结果都是布尔值

注意: 布尔值为小写,false true
          == 类型不同值相同为true, 比较会自动转化成相同的数据类型
          === 值和数据类型要一样为true
          js中的比较运算符, 不支持连写表示范围,不会报错,只会判断前一部分范围

逻辑运算符 : && (逻辑与运算)、|| (逻辑或运算)、! (逻辑非运算)

                     js也有短路操作短路操作

赋值运算符: =、+=、-=、/=、*=、%=

三目运算符 : ?:

表达式?值1:值2 - 判断表达式的结果是否为true, 如果是, 整个运算表达式的结果是值1否则是值2

注意:不同运算符的优先级和python一样

四、分支结构

if分支结构

语法:

第一种

if(条件语句){
代码块
}

第二种

if(条件语句){
满足条件要执行的代码块
}else{
不满足条件要执行的代码块
}

if(条件语句1){
代码块1
}else if(条件语句2){

}else if(条件语句3){

}

else{
不满足条件要执行的代码块
}

switch

语法:
switch(表达式){
case 值1: {
代码块
}

case 值2:{
代码块
}

defualt:{
代码块N
}
}

说明:

  1. switch和case是关键字
  2. case语句后面的{}可以省略
  3. 表达式可以是任何有结果的表达式
  4. 值也必须是有结果的表达式, 通常会直接写一个固定的数据

执行过程:

先计算表达式的值, 然后让表达式的值依次和每个case后面的值进行比较, 哪个case后面的值和表达式的值相等, 就以这个case作为入口, 依次执行和这个case以及它后面所有的代码块, 直接执行完或者遇到break就结束

如果没有哪个case后面的值和表达式的值相等, 就将defualt作为入口

注意: defualt不是一定要放在最后

五、循环结构

while循环

语法:

第一种

while(条件语句){
循环体
}

注意: 可能一次都不循环

第二种

do-while循环
do{
循环体
}while(条件语句)

注意: 循环体至少循环一次

for循环

  1. for-in

    for(变量 in 序列){
    循环体
    }

注意: 序列: 字符串、数组、对象
         字符串、数组在for循环中取的是下标(索引)
         对象在for循环中取的是key

  1. 标准for
    for(表达式1;表达式2;表达式3){
    循环体
    }

    表达式1
    while(表达式2){
    循环体
    表达式3
    }

执行过程:

先执行表达式1, 然后判断表达式2的结果是否为true, 如果为true就执行循环体, 执行完循环体再执行表达式3;再判断表达式2是否为true, 为true又执行循环体, 执行完循环体再执行表达式3;以此类推, 如果判断表达式2的结果是false整个循环就结束

关键字 continue 和 break

六、函数

函数的定义

语法:

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

注意: 有默认值的参数可以放在没有默认值参数的前面

** 函数的调用**

语法:

函数名(实参列表)

注意:js中使用关键字参数传参无效,只能使用位置参数
         调用函数的时候如果不给没有默认值的参数传参, 不会报错, 这个参数的值会undefined

arguments

js中每个函数中都有一个局部变量arguments, 用来接受这个函数在调用的时候传的所有的实参

匿名函数

语法:

函数名 = function (参数列表){
函数体
}

箭头函数

(参数列表)=>{函数体}

©️2020 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页