js基础进阶
首先声明本次随笔大部分来源于huizhi网,单纯用于自己记笔记
1 数据类型
数据类型分为:基础类型和对象类型。
基础类型:Number、String、Boolean、Null、Undefined
对象类型:object
JavaScript不支持创建任何自定义的类型,所有的值都是上述中六种数据类型之一
1.1 number 类型 包括浮点类型和NaN(Not a Number)
1.2 string 类型
1.3 转移字符
1.4 boolean 类型 返回只有true 和 false (注意 一定是小写)
1.5 Null 和 undefined
Null和Undefined类型都只有唯一的特殊值,即null和undefined。不过null是关键字而undefined不是。
你也可以认为undefined是表示系统级的、出乎意料的或类似错误的值的“空值”;而null表示程序级的、意料之中的值的“空值”。如果你想吧两者赋值给变量或者属性等,最好的选择是null
2 对象(类似于python的字典)
对象(object)是JavaScript的基本数据类型之一。对象是一种复合值:它把多个值(原始值或者其他对象)聚合在一起,可以通过名字访问这些值。对象也可看做是 属性的无序集合,每个属性都是一个名/值对。属性名是字符串,因此我们可以把对象 看成是从字符串到值的映射。
2.1 创建对象
2.1.1 方式一 使用new操作符后跟object 构造函数
var obj = new Object(); obj.name = "MangGuo"; obj.age = 25;
2.2.2 方式二 使用对象字面量表示法
var obj = { name : "MangGuo", //name是属性名,"MangGuo"是值 age : 25 }
在对象字面量中,使用逗号来分隔不同的属性,因此"mangGuo"后面是一个逗号。但是,在age属性的值25的后面不能添加逗号,因为age是这个对象的最后一个属性。
使用对象字面量创建对象需要注意:当属性名中含有空格、特殊字符或者是保留字的时候一定要加上引号,其他情况下可加可不加。如下
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
var obj = { "name" : "huizhi",<br> "hui zhi" : "hubwiz", //属性名中有空格 "hui-zhi" : "hubwiz", //属性名中有特殊字符 "for" : "baoliuzi" //属性名是保留字 } document.write(obj.name); //输出obj对象属性名为name的值
2.2 访问属性
访问对象的属性有两种方式:点或者中括号操作符。点操作符在我们上一页当中已经应用到了。
var cat = { "name": "tom", "sex": "man", "color": "yellow" } var name1 = cat.name; //通过点操作符来访问对象属性 var name2 = cat["name"]; //通过中括号操作符来访问对象属性
2.3 删除属性
语法:delete 对象名.属性名;
2.4 hasOwnProperty()函数
对象是属性的集合,我们经常会检测集合中成员的所属关系——判断某个属性是否属于某个对象。这个时候就用到了我们前文提到的:hasOwnProperty 函数。
语法:object.hasOwnProperty(proName);
2.5 原型
每一个对象都连接到一个原型对象,并且可以从中继承属性。所有通过字面量创建 的对象都具有同一个原型对象,并可以通过Object.prototype获取对原型 对象的引用。通过new关键字后跟构造函数创建的对象的原型,就是构造函数的prototype 属性的值。
比如通过new Object()创建的对象和字面量创建的对象一样也继承自 Object.prototype。
var sum = { name: "汇智网", type: "加法" } Object.prototype.add = function(){ alert("原型对象的方法"); } sum.add(); // =>原型对象的方法
2.6 遍历属性
我们除了检测属性的存在,我们还经常对属性进行遍历。通常我们会用:for/in
for / in 语句可用来遍历一个对象的所有属性名。它会将所有的属性(包括函数和原型中的属性)
var cat = { "name": "小白", "type": "汇智网", "eat": function(){ alert("吃老鼠"); } } Object.prototype.color = "白色"; var name; for(name in cat){ document.write(cat[name] + "\n"); }
3 数组
3.1 创建数组
Array类型是Javascript中比较常用的类型,它和其他语言的数组有很大的区别,虽然它们数组的数据都是有序列表。但是JavaScript的数组可以保存任意类型的数据(包括它本身)。且大小是动态的,可以随着数据的添加而自动增长。
3.1.1 创建的第一种方式
var arr = new Array(); var arr = new Array("cat","dog","mouse");
3.1.2 创建的第二种方式
var arr = []; var arr = ["cat", "dog", "mouse"];
3.2 数组长度 每个数组都有一个长度,要想获得这个长度,我们通过数组的length属性来获取。 length属性值代表数组中元素的个数
3.3 稀疏数组
稀疏函数就是从0开始的不连续索引的数组。
var arr = new Array(3); arr.length; // arr[0] = 1; arr[100] = 98; arr.length; //length为101
3.4 遍历数组
数组就是对象,所以我们可以用 for/in 来遍历数组。可惜 for/in 不能保证属性的顺序,但是大多数情况下都希望按照 阿拉伯数组顺序来产生元素。
要想解决这个问题,我们可以用最常规的 for 来遍历数组。如下示例:
var arr = [1,22,3,333,322,444]; for(var i = 0;i < arr.length; i++){ document.write("第" + i + "元素:" + arr[i] + "\n"); }
4 函数
4.1 第一种创建方式 函数声明
alert(sum(3,11)); //弹出14 function sum(x, y) { return x + y; }
4.2 第二种创建方式 函数表达式
alert(sum(3,11); // unexpected identifier 意外标识符错误 var sum = function (x, y) { return x + y; }
语法: var funcName = fucntion(参数){ 代码 }
两种方式都定义了一个函数,那它们两者的区别是什么?
上述中第二段代码运行会产生错误,因为在执行到函数所在的语句之前,变量sum 中不会保存有对函数的引用;而且由于第一行代码就会报错,也不会执行到下一行。
4.3 函数的调用方式
4.3.1 方法调用模式 当一个函数被保存为对象的一个属性时,我们称它为一个方法, myObj.sum();
4.3.2 函数调用模式 函数调用模式即通常的函数调用,属于全局性调用, sum(x, y);
4.3.3 函数调用模式JavaScript中函数还可以是构造器. 将函数作为构造器来使用的语法就是在函数调用前面加上一个new关键字
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
var add = function() { this.name = "汇智网"; this.sum = function (a, b){ return a + b; } } // 构造器调用模式 var obj = new add(); //obj是一个对象 obj.sum(1,2); //=>3
上述中的代码创建了一个构造函数add,然后使用构造函数创建对象obj。这里使用了new关键字。然后使用对象调用sum()方法。
4.3.4 JavaScript中函数也是对象,也可以拥有方法。其中call()和apply()用来间接的调用函数。称之为apply调用模式。
apply方法让我们构建一个参数数组传递给调用函数。它也允许我们选择this的值。 apply方法接收两个参数,第一个是要绑定给this的值,第二个就是一个参数数组。
语法:函数名.apply(对象, 参数数组);
var add = function (a, b) { return a + b; } add.apply(null,[1,2]); //=>3
call方法与apply方法类似,区别在call第二参数不是一个数组而是需要列举出来。比如上述中的代码用call方法来实现,如下
var add = function (a, b) { return a + b; } add.call(null,1,2); //=>3