JavaScript重点笔记

JavaScript笔记总结

1.变量

JavaScript 是弱类型语言。

变量类型是动态的，可以存放任意类型的数据。

语法：var 变量名 = 初始化值;

var i = 1;
var f = 1.1f;
var s = "abc"

命名规则

• 变量必须以字母开头
• 变量也能以 $ 和 _ 符号开头
• 变量名称对大小写敏感（y 和 Y 是不同的变量）
• 不允许使用js关键字和保留关键字

注意：所有变量的声明，会自动提升到代码(当前作用域)的最顶部。

---

2.数据类型

2.1基本数据类型

基本数据类型包括：number，string，boolean，null，undefined

数字

JS只有number一种数字类型。数字可以带小数点，也可以不带：

var a = 1;     
var b = 1.0; 

布尔值

布尔只能有两个值：true 或 false：

var x = true;
var y = false;

字符串

字符串可以是引号中的任意文本。可以使用单引号或双引号：

var a = "hello";
var a = 'hello';

null

表示空，不存在。

从逻辑角度上看，null是一个空的对象指针。而这也正是使用typeof操作符检测null值，会返回“object”的原因。

undefined

表示未定义。

注意：

• 声明一个变量，但未赋值，输出则是undefined
• 函数没有明确返回值，如果用变量接受，输出则是undefined
• undefine + number = NaN

2.2引用数据类型

对象类型Object type，比如：Object 、Array 、Function 、Data等，以及自定义的。

object

对象，是一组数据和功能（函数）的集合。可以用new操作符后跟要创建的对象类型的名称来创建。也可以用字面量表示法创建。

var person = {name:'zhangsan'} // 方式1： 字面量的方式
var obj1= new Object();        // 方式2： 构造方法

---

3.函数

3.1函数的定义

定义方式一

语法：function 函数名(参数列表){ 函数体；}

function study（）{
    console.log("hello");
}

定义方式二

语法：var 函数名 = function(参数列表){ 函数体；}

var study = function(){
    console.log("hello");
}

定义方式三

语法：参数跟函数体都必须在字符串内，Function的F必须大写new Function(arg1, arg2, …, argN, function_body);

var study = new Function("name", "time","console.log(name+'每天学习'+time+'分钟');console.log('继续保持')");

3.2函数的调用

调用方式一
语法： 函数名(参数值)

study("zhangsan",180);

调用方式二

语法： 函数名.call(调用对象，参数值)

study.call(this,"zhangsan",180);

调用方式三

参数需要封装到数组中

语法： 函数名.apply(调用对象，参数值数组)

study.apply(this,['zhangsan',180] );

调用方式四

bind会返回新的函数，需要调用才会执行，所以后面需要(),其它跟call用法一样。

语法： 函数名.bind(调用对象，参数值)()

study.bind(this,"zhangsan",10 )(); 

3.3 函数参数

JS中的参数都会封装到arguments中，在函数体中可以通过这个参数拿到定义参数以外的参数值。

var study = function(name , time){
    // 传统方式只能拿到定义的参数
    console.log(name);
    console.log(time);
    // 通过arguments可以定义参数以外的参数
    console.log(arguments.length);
    console.log(arguments[0]);
    console.log(arguments[1]);
    console.log(arguments[2]);
    console.log(arguments[3]);
    
    console.log(name+'每天学习'+time+'分钟');
}

study("zhangsan",180,1,"a");

4.数组

用来装元素的集合。

JS中数组下标越界不会异常，访问会返回 undefined。

数组定义

// 方式1 
var arr1 = [1,2,3,true,2.1,'hello',null ];
// 方式2 
var arr2 = new Array(1,2,3,true,2.1,'hello',null);

console.log(arr1[100]);// undefined

5.对象

对象由 花括号{} 分隔，属性由 逗号, 分隔。

在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。

下面的例子中，对象 (person) 有三个属性：firstname、lastname 以及 id：

var person = {firstname:"John", lastname:"Doe", id:5566};

空格和折行无关紧要。声明可横跨多行：

var person = {
    firstname : "John",
    lastname : "Doe",
    id    : 5566
};

对象属性有两种寻址方式：

name = person.lastname;
name = person["lastname"];

在对象中定义一个方法：

var person = {
    firstname : "John",
    lastname : "Doe",
    id    : 5566 ,
    talk : funciton(){
    	document.write("HelloWorld！")
	}
};

6.判断变量的数据类型

typeof 方法

可以使用 typeof 操作符来检测变量的数据类型，括号可加可不加。

typeof(1) // number
typeof(1.11) // number
typeof(NaN) // number

typeof "ABC" // string
typeof 'ABC' // string

typeof true // boolean
typeof false // boolean

typeof undefined // undefined

typeof null // object
typeof [1,2,3,4]; // object
typeof {name:'John', age:34} // object
typeof new Date() //  object

typeof function () {}  // function

isArray 方法

注意：isArray 只能用来判断 Array！

var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";

// 判断是否支持该方法
if (Array.isArray) { 
    // 检验该对象是否为数组
    if(Array.isArray(cars)) {
        document.write("true") ;
    }
}

instanceof 操作符

注意：instanceof 只能用来判断 Object ！

var arr = new Array("a","b","c");

if (arr instanceof Array) {
    document.write("该对象是一个数组。") ;
}

7.流程控制语句

if…else…

只有当指定条件为 true 时，该语句才会执行代码。

if (condition) {
    当条件为 true 时执行的代码
}

在条件为 true 时执行代码，在条件为 false 时执行其他代码。

if (condition) {    
	当条件为 true 时执行的代码}
else {
    当条件不为 true 时执行的代码
}

选择多个代码块之一来执行。

if (condition1) {
    当条件 1 为 true 时执行的代码
} else if (condition2) {
    当条件 2 为 true 时执行的代码
} else {
  当条件 1 和 条件 2 都不为 true 时执行的代码
}

switch

在 Java 中，switch语句可以接受的数据类型：byte int short char 枚举(1.5) String(1.7)。

在 JavaScript 中，switch语句可以接受任意的原始数据类型。

switch(n) {
    case 1:
        执行代码块 1
        break;
    case 2:
        执行代码块 2
        break;
    default:
        匹配不存在时做的事情
}

for

语句 1 （代码块）开始前执行

语句 2 定义运行循环（代码块）的条件

语句 3 在循环（代码块）已被执行之后执行

for (语句1 ; 语句2 ; 语句3) {
   循环体
}

语句 1

通常我们会使用语句 1 初始化循环中所用的变量 (var i=0)。

语句 1 是可选的，不使用语句 1 也可以。

您可以在语句 1 中初始化任意（或者多个）值：

var i=2,len=cars.length;
for (; i<len; i++){ 
    document.write(cars[i] + "<br>");
}

语句 2

通常语句 2 用于评估初始变量的条件。

语句 2 同样是可选的。

如果语句 2 返回 true，则循环再次开始，如果返回 false，则循环将结束。

如果您省略了语句 2，那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。

语句 3

通常语句 3 会增加初始变量的值。

语句 3 也是可选的（比如当循环内部有相应的代码时）：

var i=0,len=cars.length;
for (; i<len; ){ 
    document.write(cars[i] + "<br>");
    i++;
}

for In

遍历数组，则变量为索引：

var nums = [1, 3, 5];

for (var x in nums) {
    document.write(nums[x]+ "<br />");
}

for of

遍历数组，则变量为元素：

var nums = [1, 3, 5];

for (var x of nums) {
    document.write( x + "<br />");
}

while

while 循环会在指定条件为真时循环执行代码块。

while (条件)
{
    需要执行的代码
}

do/while

do/while 循环会在检查条件是否为真之前执行一次代码块，然后如果条件为真的话，就会重复这个循环。

do
{
    需要执行的代码
}
while (条件);

break & continue

break 语句可用于跳出循环。

for (i=0;i<10;i++)
{
    if (i==3)
    {
        break; 
    }
    x = x + "The number is " + i + "<br>";
}
// 该数字为 0
// 该数字为 1
// 该数字为 2

continue 语句跳出循环后，会继续执行该循环之后的代码（如果有的话）。

for (i=0;i<6;i++)
{
    if (i==3)
    {
        countinue; 
    }
    x = x + "The number is " + i + "<br>";
}
// 该数字为 0
// 该数字为 1
// 该数字为 2
// 该数字为 4
// 该数字为 5