JavaScript基础知识

旧城等待， 2022-07-15 19:08 273阅读 0赞

最近开始学JavaScript，本文为学习过程中做的一些笔记。

#### 异步执行1：async ####

在script标签中指定async属性可以让该标签引用的js文件异步执行，如下：

由于async属性只有一个值async，所以也可以省略属性值，简写为：

不过为了代码规范，还是不要偷懒把它写上比较好。那么什么叫异步执行呢？就是浏览器无须等待该js代码执行完就可以继续执行html页面接下来的代码，如果不指定该属性，在该js文件中的代码执行完之前该js标签之后的内容都不会被浏览器执行。  
ps:如果把代码直接写在script标签之中，async属性是无效的

#### 异步执行2：defer ####

该属性与async功能类似，不同的是async会在js文件一下载完后就执行，而defer当js文件下载完后不会立即执行，而是等到整个html页面加载完后再执行，代码示例如下：

#### 基础语法 ####

*  //单行注释
 *  /*多行注释*/
 *  ===：数据类型和值都相同才为true
 *  ==：判断值相等，判断的时候可能会发生类型转换

### 数据类型 ###

*  typeof x:得到变量x的数据类型
 *  四种基本数据类型：Number,String,Boolean,Undefine  
    
    
     *  Number数据类型  
        
        
         *  八进制：var num = 01;
         *  十六进制：var num = 0x1;
         *  浮点数1：var num = 0.01;
         *  浮点数2：var num = 5e-123;
         *  最大值：Number.MAX\_VALUE
         *  最小值：Number.MIN\_VALUE
         *  无穷大：Infinity
         *  无穷小：-Infinity
         *  正数除以0会得到Infinity，负数除以0会得到-Infinity
         *  非数值：NaN
         *  isNaN():判断一个变量是否为数字
     *  String数据类型  
        
        
         *  可以用双引号，也可以用单引号
         *  获取字符串的长度：str.length
         *  可以用+号进行字符串拼接
         *  和Java的String类型类似，JavaScript的String类型也是不可变的，拼接后会创建一个新的String对象，原来的String对象可能成为垃圾，JavaScript也有垃圾回收机制，会在某个时机进行垃圾回收
     *  Boolean数据类型  
        
        
         *  只有true和false两个值
         *  所有类型的值都可以转化为Bealean:var b = Bealean(“a”);
         *  空字符串(“”)，NaN，0，null，undefined转换为false
     *  Undefined类型  
        
        
         *  只有一个值：undefined

### 类型转换 ###

*  转换成字符串  
    
    
     *  toString()方法：除了undefined和null，其它的都有该方法；数值类型调用该方法可以传一个参数指定进制
     *  String()：undefined和null也可以转换
     *  使用+进行字符串拼接
 *  转换成数值类型  
    
    
     *  Number()：可以把任何类型转换成数值类型，
     *  parseInt(),parseFloat()：只能把字符串转换成数值类型
     *  Number(),parseInt(),parseFloat()的区别  
        
        
         *  Number()不能转换类似“123a”的字符串，而parseInt(),parseFloat()可以
         *  parseInt()会把”1.01”转换成1，而Number(),parseFloat()会转换成1.01
         *  parseInt()可以传两个参数，第二个参数指定进制，parseFloat()只能传一个参数
 *  转换成布尔类型  
    
    
     *  Boolean()函数
     *  控制流语句会隐式转换成布尔类型
     *  使用两个!!：var b = !!”abc”;

### 操作符 ###

*  &&（||同理）  
    
    
     *  如果a&&b，a和b转换成布尔值都是true,则该表达式的值为第二个操作数(b)
     *  如果a&&b，a和b有一个操作数转换成布尔值是false，则该表达式的值为第一个为false的操作数

### 变量的作用域 ###

*  用var声明变量，不用var声明的变量是全局变量
 *  在函数中用var声明的变量为局部变量，只在函数中有效
 *  JavaScript没有块级作用域，即在\{\}中声明的变量在\{\}外仍有效，包括在if,for,while等中声明的变量

### 流程控制 ###

*  if,switch,for,while,do…while都和Java是类似的

### 数组 ###

数组的两种创建方式：

//方式一
    var array1 = new Array();
    array[0] = 'yini';
    array[1] = 'gongyi';
    //方式二
    var array2 = ['yini','gongyi'];

JavaScript中没有数组越界的问题，访问越界的数组元素得到的是undefined，可以直接为越界的数组元素赋值

### 函数 ###

函数的两种定义方式：

//方式1
    function funName(parm1,parm2,...){ //body } //方式2 var funName2 = function(parm1,parm2...){ //body }

*  如果函数中没有return语句，则该函数返回值为undefined
 *  JavaScript中形参和实参的个数可以不相等，如果实参的个数少于形参，少传的那些实参的值为undefined，如果实参的个数多于形参，多余的实参不会传给函数
 *  JavaScript没有重载的概念，只要出现了同名的函数，就会把之前的函数覆盖掉，不管两个函数的参数个数是否相同
 *  函数也是一种数据类型，使用typeof funName，放回的结果为：function
 *  函数也可以作为实参传给函数

### 对象 ###

对象的创建和使用方式：

//直接创建对象
    var obj = new Object();
    obj.name = "xiaoming";
    obj.say = function (){ 
         console.log("i am " + this.name);
    }
    obj.say();
    //使用构造函数的方式创建对象
    function Student(name,age){ 
         this.name = name;
         this.age = age;
         this.display = function(){ 
               console.log("i am "+this.name+",my age is " + this.age)
         }
    }
    var stu = new Student("xiaoming",20);
    stu.display();
    //使用对象字面量的方式创建对象
    var o = {
         name:"xiaoming",
         age:16
    }
    o.age
    //使用JSON对象
    var o1 = {
        "name":"xiaoming",
        "age":16
        "1":21
    }
    o1.age;
    o1["age"];

*  为了规范，构造函数的第一个字母一般为大写
 *  构造函数的本质就是一个函数
 *  对象字面量和JSON只有一个区别：JSON中的属性必须用双引号括起来
 *  可以使用for(var key in obj)的方式来遍历对象
 *  对象的属性可以是数字，但属性为数字时只能通过obj\[key\]的方法访问，不能使用obj.key
 *  简单类型和复杂（引用）类型的区别  
    
    
     *  引用类型s1,s2,当使用s1=s2时，s1,s2将指向同一块内存
     *  简单类型在栈中分配类型，复杂（引用）类型在堆中分配内存
     *  简单类型作为函数参数是值传递，引用类型作为函数参数是引用传递
     *  instanceof关键字可以判断一个对象是否某个复杂类型的实例

### DOM(Document Object Model) ###

### 输入输出及用户交互 ###

*  alert():弹出提示框
 *  prompt(“”):弹出输入框
 *  console.log(“”):输出到浏览器的控制台