一.javascript数组
数组（array）是按次序排列的一组数据，每个值的位置都有编号（从 0 开始），整个数组用方括号表示。
Js 中定义数组的三种方式如下（也可先声明再赋值）：
var arr=[值 1,值 2,值 3]; //隐式创建
var arr=new Array(值 1,值 2,值 3); //直接实例化
var array=new Array(size); //创建数组并指定长度
1.基本操作:
数组的长度可以通过 length 属性来获取，并可以任意更改
数组名.length
数组名.length = 新长度
数组中的每一个元素都可以被访问和修改，甚至是不存在的元素，无所谓越界
访问方式:
数组名[下标]
数组名[下标] = 新值
2.数组的遍历:
数组的遍历即依次访问数组的每一个元素 ，JS 提供三种遍历数组的方式：
1)普通for 循环遍历:
for(var i=0; i<=数组.length-1; i++){
}
//如：
for(var idx=0;idx<arr.length;idx++){
console.log(arr[idx]);
}
2)for…in:
for(var 下标(名称任意) in 数组名){
数组名[下标]是获取元素
} //下标(名称任意)
//如：
for(var idx in arr){
console.log(arr[idx]);
}
3)forEach:
数组名.forEach(function(element,index){
}) // element(名称任意)：元素， index(名称任意)：下标
//如：
arr.forEach(function(elem,idx){
console.log(idx+"-->"+elem);
});
三者的区别:
for --> 不遍历属性
for in -->不遍历索引中的 undefined
foreach -->不遍历属性和索引中的 undefined
数组在使用的时候建议大家规矩来用。在存放数据时，从下标 0 开始顺序的存放数组元素。
如果下标：
1.为非负整数(包括整数字符串)：自动从 0 开始,不存在添加 undefined
2.为负数、小数、非数字符串：这些内容不计算在长度内，当成"属性"处理，相当于自定义属性。
3. 数组提供的操作方法:
Array 对象为我们提供了一些方法，可以很方便地操作数组:
push 添加元素到最后
unshift 添加元素到最前
pop 删除最后一项shift 删除第一项
reverse 数组翻转
join 数组转成字符串
indexOf 数组元素索引
slice 截取（切片）数组，原数组不发生变化
splice 剪接数组，原数组变化，可以实现前后删除效果
concat 数组合并
二.javascript函数
函数，即方法。就是一段预先设置的功能代码块，可以反复调用，根据输入参数的不同，
返回不同的值。函数也是对象。
1.函数的定义
有三种函数定义的方式：函数声明语句、函数定义表达式、Function 构造函数
1)函数声明语句
function 函数名([参数列表]) { }
调用：函数名([参数列表]);
2)函数定义表达式
var 变量名/函数名 = function([参数列表]) { }
调用：变量名/函数名([参数列表]);
3)Function 构造函数
var 变量名 = new Function(“参数1”,“参数2”,“最后一个参数为是函数体”);
调用：变量名/函数名([参数列表]);
注意：
1、js 中的函数没有重载，同名的函数，会被后面的函数覆盖。
2、js 函数中允许有不定数目的参数
实例:
<script type="text/javascript">
// 函数声明语句
function f1(a) {
console.log(a);
}
f1(1);
// 函数定义表达式
var f2 = function(){
console.log("函数定义表达式...");
}
f2();
// Function 构造函数
var f3 = new Function('x','console.log(x)');
f3("Hello");
function f4() {
return true;
}
var flag = f4();
console.log(flag);
function f1() {
console.log("覆盖...");
}
f1();
</script>
2.函数的参数、调用和return语句
函数的参数:
实参可以省略，那么对应形参为 undefined
若函数形参同名（一般不会这么干）：在使用时以最后一个值为准。
可以给参数默认值：当参数为特殊值时，可以赋予默认值。
参数为值传递，传递副本 ；引用传递时传递地址，操作的是同一个对象。
函数的调用:
常用调用方式：函数名([实参]);
存在返回值可以变量接收，若接收无返回值函数则为 undefined
1、函数调用模式
2、方法调用模式
3、间接调用模式
call()和 apply()方法可以用来间接地调用函数。
任何函数可以作为任何对象的方法来调用，哪怕这个函数不是那个对象的方法。
两个方法都可以指定调用的实参。
call()方法使用它自有的实参列表作为函数的实参，apply()方法则要求以数组的形式传入参数
匿名函数立即调用:
（1）匿名函数：function ([参数]){}
（2）调用：(function ([形参]) {})([实参]);
在函数只被使用一次的情况下可以使用这种方式，简便省事.
return 语句:
作用：在没有返回值的方法中，用来结束方法。
有返回值的方法中，一个是用来结束方法，一个是将值带给调用者。
3.函数的作用域
函数的作用域
1、全局变量与局部变量同名问题（就近原则）
2、如果没使用var修饰符声明的变量是全局变量
3、函数中变量名的提升
<script type="text/javascript">
// 1、全局变量与局部变量同名问题（就近原则）
var box = 1;
function f1(box) {
// 局部变量
var box = 10;
var b = 20;
console.log(box);
console.log(this.box);
a = 2; // 全局变量
}
f1(box);
console.log(box);
// console.log(b); // 无法获取函数中的局部变量
// 2、如果没使用var修饰符声明的变量是全局变量
console.log(a);
// 3、函数中变量名的提升
function f2(x) {
// 变量名提升
//console.log(temp);
if (x > 1) {
var temp = x+1;
}
console.log(temp);
}
f2(10);
f2(20);
</script>
三.javascript闭包
闭包就是能够读取其他函数内部变量的函数。
由于在 Javascript 语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。
它的最大用处有两个：
一个是前面提到的可以读取函数内部的变量
另一个就是让这些变量的值始终保持在内存中
以及还可以避免变量名冲突的问题。
闭包的构成：
1、外部函数嵌套内部函数
2、内部函数使用外部函数的环境
3、外部函数返回内部函数
实例1:
<script type="text/javascript">
// 1、外部函数嵌套内部函数
function out() {
var msg = "Hello!";
// 2、内部函数使用外部函数的环境
function inside() {
console.log(msg);
}
// 3、外部函数返回内部函数
return inside;
}
// 先调用外部函数，得到内部函数
var out = out();
console.log(out);
//调用函数
out();
</script>
实例2:
/*
* 浇花
* 水壶 500ml水
* 每次浇水 50ml
*/
<script type="text/javascript">
// 往水壶中加水
function initWater(water) {
// 给指定的花浇水
function waterFlower(flower) {
// 浇水，每次少50ml
water = water - 50;
if (water <= 0) {
// 自动加水
water = 100;
}
document.write("给"+flower+"浇水50ml，还剩"+water+"ml！<br>");
}
return waterFlower;
}
// 初始化水壶
var water = initWater(200);
// 开始浇水
water("梅花");
water("牡丹");
water("樱花1");
water("樱花2");
water("樱花3");
</script>
四.javascript对象
对象的创建:
JS 创建自定义对象，主要通过三种方式：
1.字面量形式创建对象、
2.通过 new Object 对象创建 、
3.通过 Object 对象的 create 方法创建对象
1.字面量形式创建:
var 对象名 = { };//创建一个空的对象
var 对象名 = {键:值,键 2:值 2,…}
2.通过 new Object 对象创建:
var 对象名 = new Object();
3.通过 Object 对象的 create 方法创建对象:
var 对象名 = Object.create(null); // 创建空模板的对象
var 对象名 = Object.create(对象); // 以指定对象为模板创建对象
对象的序列化和反序列化:
序列化对象，将对象转为字符串 JSON.stringify(object)
反序列化，将一个 Json 字符串转换为对象。 JSON.parse(jsonStr)
<script type="text/javascript">
// 字面量形式创建
var obj1 = {};
var obj2 = {name:"zhangsan",age:18};
console.log(obj1);
console.log(obj2);
obj2.pwd = "123456";
console.log(obj2);
// 通过 new Object 对象创建
var obj3 = new Object();
console.log(obj3);
obj3.name = "admin";
// 通过 Object 对象的 create 方法创建对象
var obj4 = Object.create(null);
console.log(obj4);
console.log(obj4.name);
var obj5 = Object.create(obj2);
console.log(obj5);
console.log(obj5.name);
var obj = '{"name":"hello","age":12}';
console.log(obj);
console.log(obj.name);
// 反序列化，将JOSON格式字符串转成对象
var ob = JSON.parse(obj);
console.log(ob);
console.log(ob.name);
console.log(obj2);
// 序列化，将对象转换成json格式的字符串
var str2 = JSON.stringify(obj2);
console.log(str2);
</script>
五.javascript evel()函数
eval()
可借助 eval()动态函数，将参数字符串解析成 js 代码来执行，只接受原始字符串作为参数
可将 json 串转为 json 对象
1）第一种解析方式：得到的 json 对象名就是 jsonObj eval("var jsonObj = " + jsonStr);
2）第二种解析方式：对象中有多个属性 var jsonObj = eval("(" + jsonStr + “)”); 由于 json 是以{ }的方 式来开始以及结束的，在 eval 中会被当成一个语句块来处理，故必须强制将它转换成一种表达式。加上 圆括号是使 eval 函数在处理时强制将括号内的表达式转化为对象而不作为语句来执行。
3）第三种解析方式：对象中只有一个属性
<script type="text/javascript">
var josnStr = '{"name":"zhangsan","age":18,"pwd":"123456"}';
// 得到的 json 对象名就是 jsonObj
eval("var jsonObj=" + josnStr);
// 对象中有多个属性
var jsonObj2 = eval("("+josnStr+")");
console.log(jsonObj2);
// 对象中只有一个属性
var josnStr2 = '{"name":"zhangsan"}';
var jsonObj3 = eval("(" + josnStr2 + ")");
console.log(jsonObj3);
</script>
六.javascript内置对象
<!--
String:
◦ charAt(idx)：返回指定位置处的字符
◦ indexOf(Chr)：返回指定子字符串的位置，从左到右。找不到返回-1
◦ substr(m,n)：返回给定字符串中从 m 位置开始，取 n 个字符，如果参数 n 省略，则意味着取到字符串末尾。
◦ substring(m,n)：返回给定字符串中从 m 位置开始，到 n 位置结束，如果参数 n 省略，则意味着取到字符串末尾。
◦ toLowerCase()：将字符串中的字符全部转化成小写。
◦ toUpperCase()：将字符串中的字符全部转化成大写。
◦ length: 属性，不是方法，返回字符串的长度。
Math:
◦ Math.random()
◦ Math.ceil() ：天花板 大于最大整数
◦ Math.floor() :地板 小于最小整数 String
Date:
//获取
◦ getFullYear()年, getMonth()月, getDate()日,
◦ getHours()时,getMinutes()分,getSeconds()秒
//设置
◦ setYear(), setMonth(), …
◦ toLoacaleString()
说明：
1.getMonth()：得到的值：0~11（1月~12月,需要加1）
2.setMonth()：设置值时 0~11
3.toLocaleString()：可根据本地时间把 Date 对象转换为字符串，并返回结果。
-->
实例:
<script type="text/javascript">
var str = "fghjkljfdbnGHFJBHKk";
console.log(str);
console.log(str.charAt(3));
console.log(str.indexOf("l"));
console.log(str.substr(2,5));
console.log(str.substring(2,5));
console.log(str.toLowerCase());
console.log(str.toUpperCase());
console.log(str.length);
console.log(Math.random());
console.log(Math.ceil(1.1));
console.log(Math.floor(1.1));
console.log("================");
var mydate = new Date();
console.log(mydate);
console.log(mydate.toLocaleString());
function formatDate(mydate) {
// 格式化时间
var year = mydate.getFullYear();
var month = mydate.getMonth() + 1;
var day = mydate.getDate();
var hour = mydate.getHours();
var minute = mydate.getMinutes();
var second = mydate.getSeconds();
var d = year + "-" + parseDate(month) + "-" + parseDate(day);
d += " " + parseDate(hour) + ":" + parseDate(minute)+ ":" + parseDate(second);
console.log(d);
// 将数值小于10的数前面加上0
function parseDate(str) {
if (str < 10) {
str = "0" + str;
}
return str;
}
}
formatDate(mydate);
</script>
七.javascript this
谁调用函数，this就指向谁
在函数中使用 this
在函数中使用 this 属于全局性调用，代表全局对象，通过 window 对象来访问。
在对象的方法中使用 this
在对象中的函数使用 this，代表当前的上级对象。
<script type="text/javascript">
function test () {
console.log(this);
this.x = 1;
console.log(this.x);
}
test();
console.log(x);//相当于定义在全局对象上的属性
var obj = {
name : '张三',
age : 20,
sayHello : function () {
console.log(this.name)
console.log(this)
}
}
obj.sayHello();
</script>
4870
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
