JS

JS

js的引入

  • 内嵌式:在head中通过一对script标签定义脚本代码
  • 引入外部脚本文件:在head中通过script标签引入外部脚本文件
    • 一个html中可以有多个script标签
    • script标签如果用于引入外部js文件,中间不要有任何字符,甚至空格和换行

js的简单方法:

方法名说明
console.log()可在控制台输出
typeof()可判断数据类型
prompt()弹窗以供用户输入,返回一个string类型
alter()弹窗显示
Number.parseInt(String)将字符串转换成整数
document.write()向文档写入文本内容,可以是 HTML 代码
JSON.parse()此方法可将json串转换为js对象
JSON.stringify()将一个js对象转换为json字符串

js的函数声明

  • function 函数名 (){}
  • var 函数名 = function(){}

和java相比,js的函数有如下特点

  • 没有访问修饰符
  • 没有返回值类型,如果有值要返回直接return即可
  • 没有异常列表
  • 调用方法时,形参和实参可以在数量上不一致
  • 函数可以作为参数传递给另一个参数

js的数据类型

js是弱类型语言,但不是没有类型。是变量在声明时不指定数据类型,赋值时才确定类型。用var来赋值所有变量

  • 数值类型number :包括整数、小数
  • 字符串类型string
  • 布尔类型boolean
  • 引用类型Object
  • function类型(函数类型)

js的运算符

  • 算术运算符: + - * / %
    • 当除(除等)0时会报错:Infinity
    • 当模(模等)0时会报错:NaN(not a number)
  • 复合运算符: ++ -- += -= *= /= %=
  • 关系运算符:> < >= <= != == ===
    • ==:如果两端的数据类型不一致,会尝试将两端的数据都转换为number再对比
    • ===:如果两端的数据类型不一致,直接返回false,相同则继续对比
  • 逻辑运算符:|| &&
  • 条件运算符:三目运算
  • 按位运算符:| & ^ << >> >>>

js分支结构

  • if后的非空字符串会判断为true
  • 非空对象也会判断为true

js循环结构

    //   var arr = ["北京", "上海", "广州"];
    //   document.write("<ul>");
    //   for (var index = 0; index < arr.length; index++) {
    //     document.write("<li>" + arr[index] + "</li>");
    //   }
    //   document.write("</ul>");
	//使用foreach改写普通for循环
      var arr = ["北京", "上海", "广州"];
      document.write("<ul>");
      for (var index in arr) {
        document.write("<li>" + arr[index] + "</li>");
      }
      document.write("</ul>");

js的对象

  • new Object()
    <script>
      var person = new Object();
      //直接给person对象的name属性创建并赋值为张三
      person.name = "张三";
      person.age = 18;
      //直接给person对象的eat方法创建并创建方法体
      person.eat = function (food) {
        console.log(this.age + "岁" + this.name + "正在吃" + food);
      };
      person.eat("火锅");
    </script>

  • {属性名:属性值,……,函数名:function(){}}
    <script>
      var person = {
        "name": "张三",
        age: 10,
        eat: function (food) {
          console.log(this.age + "岁" + this.name + "正在吃" + food);
        },
      };
      person.eat("火锅");
    </script>

注意,要用逗号将属性值隔开,属性名可用双引号引起,推荐引起