JavaScript——对象
程序员文章站
2022-04-25 07:51:46
...
JavaScript——对象
一、内部对象
标准对象
typeof 123
"number"
typeof '123'
"string"
typeof true
"boolean"
typeof NaN
"number"
typeof []
"object"
typeof {}
"object"
typeof Math.abs
"function"
typeof undefined
"undefined"
date
基本使用
var now = new Date(); //Sat Jan 04 2020 10:47:06 GMT+0800 (中国标准时间)
now.getFullYear(); //年
now.getMonth(); // 月 0~11 代表月
now.getDate(); // 日
now.getDay(); // 星期几
now.getHours(); // 时
now.getMinutes(); // 分
now.getSeconds(); // 秒
now.getTime(); // 时间戳 全世界统一 1970 1.1 0:00:00 毫秒数
console.log(new Date(1578106175991)) //时间戳转为时间
转换
now = new Date(1578106175991)
Sat Jan 04 2020 10:49:35 GMT+0800 (中国标准时间)
now.toLocaleString // 注意,调用是一个方式,不是一个属性!
ƒ toLocaleString() { [native code] }
now.toLocaleString()
"2020/1/4 上午10:49:35"
now.toGMTString()
"Sat, 04 Jan 2020 02:49:35 GMT"
JSON
- JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。
- 简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。
- 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。
在JavaScript 一切皆为对象、任何js 支持的类型都可以用JSON来表示。
格式:
- 对象都用 {}
- 数组都用 []
- 所有的键值对 都是用 key:value
JSON字符串 和 JS 对象的转化
<script>
var user = {
name: "张三",
age: 3,
sex: '男'
}
//对象转化为json字符串 {"name":"张三","age":3,"sex":"男"}
var jsonUser = JSON.stringify(user);
console.log(jsonUser);
//json 字符串转化为对象 参数为 json 字符串
var obj = JSON.parse('{"name":"张三","age":3,"sex":"男"}');
console.log(obj);
</script>
JSON 和 JS 对象的区别
var obj = {a: 'hello',b:'hellob'};
var json = '{"a": "hello","b":"hellob"}'
二、面向对象编程
原型对象
面向对象:
-
类: 模板 原型对象
-
对象: 具体的实例
在JavaScript中有些区别。
原型:
var Student = {
name: "张三",
age: 3,
run: function () {
console.log(this.name + " run....");
}
};
var xiaoming = {
name: "xiaoming"
};
//原型对象(类似于xiaoming继承了Student)
xiaoming.__proto__ = Student;
于是xiaoming的原型就是Student,包含Student的属性和方法。
点击图中的原型,你会发现会无止境的出现。
以上的这种继承十分随意;
<script>
var Student = {
name: "张三",
age: 3,
run: function () {
console.log(this.name + " run....");
}
};
var xiaoming = {
name: "xiaoming"
};
//原型对象(类似于xiaoming继承了Student)
xiaoming.__proto__ = Student;
var Bird = {
fly: function () {
console.log(this.name + " fly....");
}
};
// 小明的原型 是 Student,但是又可以被更改为其它的,很随意
xiaoming.__proto__ = Bird;
</script>
找原型其实质就是找父类,于是就出现了Class继承。
class 继承
class
关键字,是在ES6引入的
原来的方法:
function Student(name) {
this.name = name;
}
// 给student新增一个方法
Student.prototype.hello = function () {
alert('Hello')
};
现在:
1、定义一个类,属性,方法
<script>
// 定义一个学生的类
class Student{
constructor(name){
this.name = name;
}
hello(){
alert('hello')
}
}
var xiaoming = new Student("xiaoming");
var xiaohong = new Student("xiaohong");
xiaoming.hello()
</script>
2、继承
<script>
// 定义一个学生的类
class Student{
constructor(name){
this.name = name;
}
hello(){
alert('hello')
}
}
class XiaoStudent extends Student{
constructor(name,grade){
super(name);
this.grade = grade;
}
myGrade(){
alert('我是一名小学生')
}
}
var xiaoming = new Student("xiaoming");
var xiaohong = new XiaoStudent("xiaohong",1);
</script>
查看对象原型:
原型链
无论怎么走,原型总会到Object。
每个对象都会走到Object,之后便在Object处形成了原型链,一直循环,走不出去。该图很好的解释了为何原型无止境。
上一篇: javascript动态添加与删除表格行
推荐阅读
-
提高javascript效率 一次判断,而不要次次判断_javascript技巧
-
language = "JavaScript"和 type="JavaScript “ 区别
-
Textbox控件注册回车事件及触发按钮提交事件具体实现_javascript技巧
-
在Javascript中使用String.startsWith和endsWith
-
利用Javascript判断操作系统的类型实现不同操作系统下的兼容性_javascript技巧
-
JavaScript异步编程Promise模式的6个特性_javascript技巧
-
Javascript功能扩展
-
js实现延时加载Flash的方法_javascript技巧
-
一份老外写的XMLHttpRequest代码多浏览器支持兼容性_javascript技巧
-
Javascript 代码也可以变得优美的实现方法_javascript技巧