首页 JavaScript

# 对象

# 创建与调用对象的方式

# 字面量创建对象

1
2
3
4
5
6
7
8
var my = {
    name: 'peter',
    age: 19,
    sex: 'male',
    money: 9000
};

alert(my.name);

# 对象名 [‘方法名’]

1
2
3
4
5
6
7
8
var my = {
    name: 'peter',
    age: 19,
    sex: 'male',
    money: 9000
};

alert(my['name']);

# new Object () 创建对象

1
2
3
4
var obj = new Object();
obj.name = '张三';
obj.age = 19;
obj.sex = 'male';

# 通过构造函数创建对象

1
2
3
4
5
6
7
8
9
10
11
12
function Star(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.sing = function () {
        console.log(this.name + 'sing a song which name is ' + age + ' ' + sex);
    }
}

var ldh = new Star('刘德华',19,'男');
console.log(ldh);
ldh.sing();

构造函数首字母必须大写，随后使用 new 构造函数来创建对象

构造函数中使用 this.变量名 表示对象的属性，用 this.function 表示对象的方法

# new 关键字的执行过程

  1. new 构造函数在内存中创建了一个新的空对象
  2. this 指向刚刚创建的空对象
  3. 执行构造函数里面的代码，给这个空对象添加属性和方法
  4. 返回这个对象

# 遍历对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function Star(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.sing = function () {
        console.log(this.name + 'sing a song which name is ' + age + ' ' + sex);
    }
}

var ldh = new Star('刘德华', 19, '男');
for (var i in ldh) {
    console.log(i);         //循环输出对象中的所有变量名
}

for (var k in ldh) {
    console.log(ldh.k);     //循环输出所有变量的值
}

# 内置对象

内置对象是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能 (属性和方法)

# Math

Math 数学对象不是一个构造函数，所以不需要 new 来调用，而是直接使用里面的属性和方法

1
2
3
4
5
console.log(Math.PI);           //3.141592653589793
console.log(Math.max(1,99,2));  //99
console.log(Math.max(-1, -10)); //-1
console.log(Math.max(1, 3,99, 'pink老师'));//NaN
console.log(Math.max());        //-Infinity

# Date

构造函数 :

1
2
3
4
new Date();			//没有参数, 返回当前系统的当前时间
new Date(value);
new Date(dateString);
new Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);

需要注意的是，只能通过调用 Date构造函数 来实例化日期对象，一常规函数调用它 (即不加 new 操作符), 将会返回一个字符串，而不是一个日期对象，另外，不像其他 JavaScript 类型，Date 对象没有字面量格式

# 日期格式化

方法名说明代码
getFullYear()获取当年dObj.getFullYear()
getMonth()获取当月 (0 - 11)dObj.getMonth()
getDate()获取当天日期dObj.getDate()
getDay()获取型机器 (周日 0 到 周六 6)dObj.getDay()
getHours()获取当前小时dObj.getHours()
getMinutes()获取当前分钟dObj.getMinutes()
getSeconds()获取当前秒钟dObj.getSeconds()

# 获取日期的总的毫秒形式 (时间戳)

1
2
3
4
5
6
7
8
var date = new Date();
console.log(date.valueOf())		//当前时间距离1970.1.1的毫秒总数

//简单的写法(最常用的写法)
var date1 = +new Date();		//+new Date()  返回的就是总的毫秒数

//h5新增的 获取总毫秒数
console.log(Date.now());

# 倒计时

1
2
3
4
5
6
targetTime = +new Date('2022-3-13 12:0:0');
        nowTime = +new Date();
        residueDays = parseInt((targetTime - nowTime) / 60 / 60 / 24 / 1000);
        residuHours = parseInt((targetTime - nowTime) / 60 / 60 % 24);
        residueMinutes = parseInt((targetTime - nowTime) / 60 % 60);
        console.log(residueDays + ' ' + residuHours + ' ' + residueMinutes);

# Array

# 遍历数组元素
1
2
3
4
5
var myarray = [1, 2, 3, 4, 5, 6, 7, 8];

for (var i = 0; i < myarray.length; i++) {
    console.log(myarray[i]);
}
# 数组尾部添加一个元素
1
2
3
4
5
var myarray = [1, 2, 3, 4, 5, 6, 7, 8];

myarray.push(9);

console.log(myarray);
# 数组尾部删除一个元素
1
2
3
4
5
var myarray = [1, 2, 3, 4, 5, 6, 7, 8];

myarray.pop()

console.log(myarray);
# 数组头部添加一个元素
1
2
3
4
5
var myarray = [1, 2, 3, 4, 5, 6, 7, 8];

myarray.unshift(0)

console.log(myarray);
# 数组头部删除一个元素
1
2
3
4
5
var myarray = [1, 2, 3, 4, 5, 6, 7, 8];

myarray.shift()

console.log(myarray);
# 创建数组的两种方式

  • 字面量创建数组

    1
    var myarray = [1, 2, 3, 4, 5];

  • 利用 new Array () 创建数组

    1
    var myarray = new Array(5);
# 检测是否为数组的两种方式

  • instanceof

    1
    2
    3
    4
    var myarray = [1, 2, 3, 4, 5];
    console.log(myarray instanceof Array);		//true
    var obj = new Object();
    console.log(obj instanceof Array);		//false

  • Array.isArray (参数)

    1
    2
    var myarray = [1, 2, 3, 4, 5];
    console.log(Array.isArray(myarray));		//true
# 数组转换为字符串

  • toString () —— 将数组转化为字符串，默认以逗号分隔

    1
    2
    3
    var myarray = [1, 2, 3, 4, 5];

    console.log(myarray.toString());

  • join (分隔符) —— 将数组转化为字符串，可设置元素分隔符

    1
    2
    3
    var myarray = [1, 2, 3, 4, 5];

    console.log(myarray.join(' '));

# 字符串对象

# 截取字符串

方法名说明
concat(str1, str2, str3…)concat () 方法用于连接两个或多个字符串，拼接字符串，等效于 + , + 更常用
substr(start, length)从 start 位置开始 (索引号), length 取的个数
slice(start, end)从 start 位置开始，截取到 end 位置，end 取不到 (start 和 end 都为索引号)
substring(start, end)从 start 位置开始，截取到 end 位置，end 值取不到，基本和 slice 相同，但是不接受负值

  • concat

    1
    2
    3
    4
    5
    6
    var str1 = 'my ';
    var str2 = 'world!';

    console.log(str1.concat(str2));

    //my world!

  • substr

    1
    2
    3
    4
    5
    var str = 'hello my world';

    console.log(str.substr(0, 5));

    //hello

  • slice

    1
    2
    3
    4
    5
    var str = 'hello my world';

    console.log(str.slice(1,8));

    //ello my

  • substring

    1
    2
    3
    4
    5
    var str = 'hello my world';

    console.log(str.substring(0, 8));

    //hello my

# 替换字符串

  • replace (‘被替换的字符’, ‘替换之后的字符’)

    1
    2
    3
    4
    5
    6
    7
    var str = 'hello my world';

    console.log(str.replace('world', 'girlfriend'));

    console.log(str);

    //replace方法会返回新的字符串, 原来的str字符串并不会发生改变

# 字符串转换为数组

  • split (‘分隔符’)

    1
    2
    3
    var str = '1, 2, 3, 4, 5, 6';

    console.log(str.split(','));

# 简单类型与复杂类型

简单类型又叫做基本数据类型或者值类型，复杂类型又叫做引用类型

  • 值类型：简单数据类型，在存储时变量存储的是值本身，因此叫做值类型，string, number, boolean, undefined, null
  • 引用类型：复杂数据类型，在存储时变量中存储的仅仅是地址 (引用), 因此叫做引用数据类型，通过 new 关键字创建的对象 (系统对象，自定义对象), 如 Object, Array, Date 等

堆栈空间分配区别 :

  • 栈：由操作系统自动分配释放存放函数的参数值，局部变量的值等，其操作方式类似于数据结构中的栈，简单数据类型存放在栈里面
  • 堆：存储复杂类型 (对象), 一般有程序员分配释放，若程序员不释放，由垃圾回收机制回收，复杂数据类型存放在堆里面