程序员社区

JS基础1-JS引入与运算符

js概念及组成

概念:javeScript,基于事件和对象驱动,具有相对安全性的解释型客户端脚本语言
组成:

  • Bom:浏览器对象模型,可对浏览器进行操作,提供独立于内容的,可对浏览器窗口进行互动的
  • Dom:文档对象模型,W3C推荐的处理可扩展的标准编程接口,对元素,属性,属性值进行操作
  • ESMAScipt:ES核心语法,变量,数据类型,流程控制

JS的三种引入方式

  1. 内嵌式在body标签结束之前或者在head标签里面放入
  2. 外链式新建一个js文件在body标签结束之前或者head标签里面放入
  3. 时间属性的方式<元素 on事件类型=“JS代码"></元素>

JS四种输入方式

  1. 警告框alert(‘要弹出的信息’)
  2. 输入框prompt(‘提示信息’)
  3. 网页输出document.write(‘想在网页中显示的内容’)
  4. 控制台输出console.log(‘控制台调试信息’)
    注:\n代表换行 \t代表空格 \’引号\t缩进\b空格\在JS中有特殊含义,没有含义时会被忽略

变量:变化的数据,用于存储程序中的数据

定义变量=声明+赋值

  • var 变量名 = 值
  • let 变量名 = 值
  • const 常量名 = 值
关键字 能否重复声明 能否重复赋值
var
let
const
注:const使用应该值基本不会改变情况下使用,如物理常数,标示文件序列号,或者变量在实际使用中不改变,如果发生改变在改用关键字let

命名规则

  1. 由数字字母下划线$组成,不能数字开头
  2. 不能有关键字和保留字
  3. JS区分大小写,用对应英文,用小驼峰命名

数据类型

好处:合理分配内存,方便同类型变量之间运算
注:JS是一种弱类型语言,是一种不用提前声明类型,在程序运行中,自动确定类型

  • 基本数据类型
  1. 数值型 number现实中所有数字
    注:二进制前加0b,八进制前加0o,十六进制前加0x
英文 含义
InFinity 无穷大,大于任何一个值
-InFinity 无穷小,小于任何一个值
NaN Not a Number,这不是一个数值
  1. 字符串类型 string 所有引号引起来的都是字符串
    注:通常情况下HTML用双引号,JS里面用单引号
  2. 布尔类型 boolean 只有两个值true和false
  3. 空类型 null只有一个值null
  4. 未定义类型undefined只有一个值undefined
    注:常量的初始化值为undefined
  5. 唯一类型 symbol
  6. 大数据类型bigint
    注:查看数据类型typeof(值/变量)
    注:typeof(null)得到结果是object
  • 引入数据类型
    对象类型object

数据类型转换

  • 自动类型转换
  • 强制类型转换
  1. 转换成数值类型
  • parseInt(变量/值)只有数字开头的字符串可转,保留第一位非数字开头的字符的整数部分,其他一律NaN
  • parseFloat(变量值/值)只有数字开头的字符串可转,保留有效小数部分
  • Number( 变量/值)空的或全数字字符串可转,true 1/false 0 null 0 undefined和其他情况为NAN
  1. 转换为布尔类型
    boolean(变量/值)“” 0 NaN null undefined都为false,其他为ture
  2. 转换为字符串string(变量/值)

运算符

  1. 算术运算符+ - * / % ++ —
    注:++a表示先a先加1再进行运算
    a++表示a运算后再加1
 <script>
      var a=1,b=2;
      a = a++ + b;//a=3
      a = ++a + b;//a=4
    </script>
  1. 比较运算符
符号 含义
> 大于
< 小于
>= 大于等于
<= 小于等于
== 等于
=== 全等于
!= 不等于
!== 不全等于
注:=为赋值,==为比较是否相等, ===比较是否全等,包括数值和类型
  1. 逻辑运算符
符号 含义 判定
&& 只有两个都为真时为真
有一个为真为真
取反
  1. 赋值运算符
符号 含义
= 赋值
+= a+=b等价于a=a+b
*= a*=b等价于a=a*b
/= a/=b等价于a=a/b
-= a-=b等价于a=a-b
  1. 三目运算符 条件?表达式1:表达式2;
    注:条件满足则执行表达式1,否则执行表达式2

流程控制

默认流程

分支流程

  • 单分支流程
if(条件){条件成立时执行的代码}
  • 双分支流程
if( 条件){
条件成立时执行的代码
}else{
条件不成立时执行的代码
}
  • 多分支语句
if( 条件){
条件成立时执行的代码
}else if(条件){
条件成立时执行的代码
}
...
else{
条件不成立时执行的代码
}	
  • 分支流程
switch(变量,值,表达式 a){
case 表达式1:
表达式1和a全等时候执行的代码;
break;
case 表达式2:
表达式2和a全等时候执行的代码;
break;
...
default:以上条件都不满足执行的代码}

注:break意为破坏,可以防止switch贯穿

循环流程

语法:for(初始化;循环条件;更新循环变量){
         循环体
}
  1. 循环四要素
  • 1初始化:初始化信息设置,比如循环变量设置
  • 2循环条件:循环要执行需要满足的条件
  • 3更新循环变量
  • 4循环体:要重复执行的代码
    循环执行顺序(1.2.4.3.2.4.3…结束)
    示例
<script>
var rows = Number(prompt('输入行'));
var cols = Number(prompt('输入列'));
document.write('<table border="1" cellspacing="0" cellpadding="20"> ')
  for(i=1;i<=rows;i++){
  document.write(`<tr>`)
  for(j=1;j<=cols;j++){
  document.write('<td></td>')
  }
  document.write('</tr>')
            
  }
  document.write('</table>')
  //本例输出一个n行n列的表格
    </script>
  1. while循环
语法:初始化
      while(循环条件){
      循环体;更新循环变量
      }
  1. dowhile循环
语法:初始化
        do{循环体;
          更新循环变量}
          while(循环条件)

注:dowhile是先执行一次代码后再判定是否满足循环条件(也就是至少会执行一次)

  1. 跳出循环
  • break:终止循环及时满足条件,也不会在执行了
  • continue:终止本次循环后面更新循环变量,继续判定是否满足条件,满足继续执行
  1. 调试debugger
 <script>
        debugger;
        var and=0;
        for(let i=1;i<=100;i++){
            if(i%3==0 && i%5!=0){
                and=and+i
            }
        }
        document.write(and)
    </script>

注:debugger必须写在循环运行之前,调试需要打开控制台打开sources
请添加图片描述

赞(0) 打赏
未经允许不得转载:IDEA激活码 » JS基础1-JS引入与运算符

相关推荐

  • 暂无文章

一个分享Java & Python知识的社区