JS笔记 (浅入）

一、引入方式

1. 内部脚本<script> 代码 </script>
2. 外部脚本<script src= "路径"></script>

二、注意点

1. JS內部区分大小写
2. 每个语句后的分号可有可无（知道就行）

三、输出方式

window.alert()      //弹出警告框
document.write()     //HTML输出
console.log（）   //控制台输入  浏览器按f12打开控制台

四、变量

1. var

   JS为弱类型语言，变量可以存不同类型的值。并且允许重复定义同一个名字的变量，表示覆盖原有的值。

   注意：var定义的变量为全局变量，无论在哪里定义

2. let

   与var一致，唯一不同点是，它有局部变量的概念。

   关于变量的修饰词语const，用const修饰变量->表示一个常量。

五、数据类型

原始数据类型

1. number
2. string
3. boolean
4. null
5. undefined

关于typeof 运算符号： typeof a可以获得a变量的数据类型。

注意 typeof null的结果是object，这是早期的一个错误，但现在已被解释通顺，“因为null是对象的一个占位符，所以返回的是object”。

六、运算符

新加的 ： ===全等运算符

区别：==比较时会进行类型转换；而===比较不会类型转换，类型不同直接是false.

七、类型转换

parseInt("字符串")用于将字符串转换成数字，从前到后，遇到非数字结束，如果没有数字返还NAN(not a number)。

0 ，NAN ，“” ，null , undefined 可以自动类型转换为布尔类型的false，其他的全部为true。

八、函数

JS是弱类型语言，不需要指定任何的形参和返回值类型

定义(两种形式)：

function functionName(参数1.参数2){
   //代码
}

var functionName = function(参数1.参数2){
   //代码
}

调用：

var result = functionName(参数1.参数2);

JS中函数调用可以传递任意个数的参数，但是多余的参数不会接收（没有用）。

九、JS对象

1. Array数组

   1）定义：

   var 变量名 = new Array（元素列表）;

   var 变量名 =[元素列表];

   2）访问：

   变量名[下标]

   3）特点：

   类似java集合（注意是类似集合不是数组），长度可变，类型可变。可以访问数组中没有赋值的空间，得到的是undefined。

   4）属性与方法：

   --length (输入for后选择第二个提示，可方便for循环遍历所有元素)

   --forEach(),传入一个函数，遍历数组中有值的元素。可用java中的lambda表达式（在JS中叫做箭头函数）。

   --push(),添加元素到数组的尾部，可进行多传参。

   --splice（），删除指定下标的元素，也可以多传参，相当于多次调用。

2. String

   1. 定义：

      和java基本一致，但它可以用单引号也可以是双引号。

   2. 属性方法：
      length

      chatAt() :得到索引对应的元素

      indexof()：寻找指定子串在原串的开始索引位置

      trim（）：去除字符串左右两侧的所有空格

      substring(0,5):截取0到5（不含5）之间的字符串

自定义对象

定义

var 对象名 = {
  属性名1：属性值 1
    属性名2：属性值 2
    属性名3：属性值 3
    属性名4：属性值 4
    属性名5：属性值 5
    
    //函数定义
    方法名： function（参数）{
      //函数内部
  }

  //函数的简写形式
  方法名（参数）{
        //函数内部
    }
}

调用

对象名.属性名

对象名.方法名（参数）

1. JSON

   JSON的本身是一个文本（即字符串），定义方式和自定义对象差不多，但所有的key（属性名和函数名）都要是字符串。广泛用于网络数据传输。

   在JSON中，数字可以直接写，字符串用双引号，true false直接写，数组写在[ ] ,对象写在{ }，null直接写。

   JSON转JS对象 JS对象 = JSON.parse(JSON对象)

   JS对象转JSON JSON对象 = JSON.stringify(JS对象)

2. BOM

   1. Window浏览器窗口对象(Window.可省略)

      1. history :历史记录

      2. location:窗口框架

      3. navigator

      4. alert();警告框

      5. confirm():显示一段消息和一个确认按钮的警告框

         有返回值，确认为true。否则为false。

      6. setinterval():按照一定的周期调用函数

         （可以直接定义函数当作调用）

         首参数为函数，第二参数为间隔的毫秒值。

      7. setTimeout():延时调用

         首参数为函数，第二参数为延时的毫秒值。

   2. Navigator

   3. Screen

   4. History

   5. Location

      Location.href设置或者返回URL(网站地址)

3. DOM

通过获取以下信息，可以对HTML源代码进行修改，从而实现用户与页面的交互。

1. Document:文档对象

   通过document其中的get方法可获对应的对象

2. Element:元素对象 标签

3. Attributr:属性对象

4. Text:文本对象

5. Comment：注释对象

十、事件绑定

直接在对应标签内部加上即可，需要传递一个调用的函数。

1. onclick 鼠标点击事件
2. onblur 失去焦点
3. onfocus 获得焦点
4. onload 加载完毕
5. onsubmit 提交表单
6. onkeydown 按下键盘的按键
7. onmouseover 鼠标悬浮
8. onmouseout 鼠标移开