JavaScript物件
- 物件(Object)
- 物件的創建
- 使用{}創建
- 使用Object創建
- 使用Function創建
- 使用class關鍵字
- 物件的原型模型
物件(Object)
物件由花括號分隔，在括號內部，物件的屬性以名稱和值對的形式 (name : value) 來定義，也叫json，
屬性由逗號分隔，空格和折行無關緊要，宣告可橫跨多行，
定義一個物件, 姓名：Keafmd, 年齡：18 ，地址：北京，isEdu:false
樣例代碼：
var Ke = {
'name': 'Keafmd',
'age': 18,
address: '北京',
isEdu:false
}
console.log(Ke)
完整代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
var Ke = {
'name': 'Keafmd',
'age': 18,
address: '北京',
isEdu:false
}
console.log(Ke)
</script>
</head>
<body>
</body>
</html>
效果截圖：
物件的創建
使用{}創建
var person = {
name : 'Keafmd',
sayHi:function(){
console.log('hi, my name is :'+this.name)
}
};
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
var person = {
name : 'Keafmd',
sayHi:function(){
console.log('hi, my name is :'+this.name)
}
};
console.log(person)
person.sayHi()
</script>
<title></title>
</head>
<body>
</body>
</html>
效果截圖：
使用Object創建
var p = new Object();
p.name = 'Keafmd';
p.age = 18;
console.log(p);
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
var p = new Object();
p.name = 'Keafmd';
p.age = 18;
console.log(p);
</script>
<title></title>
</head>
<body>
</body>
</html>
效果截圖：
使用Function創建
function Student(){
this.name = '';
this.age = 0;
}
var stu1 = new Student();
stu1.name = "Keafmd";
stu1.age = 18;
stu1.address = '哈爾濱';
console.log(stu1);
var stu2 = new Student();
console.log(stu2);
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function Student(){
this.name = '';
this.age = 0;
}
var stu1 = new Student();
stu1.name = "Keafmd";
stu1.age = 18;
stu1.address = '哈爾濱';
console.log(stu1);
var stu2 = new Student();
console.log(stu2);
</script>
<title></title>
</head>
<body>
</body>
</html>
效果截圖：
使用class關鍵字
class Human{
constructor(name) {
this.name = name;
}
sayHi(){
console.log('我是： '+this.name);
}
}
var h1 = new Human('Keafmd');
h1.sayHi()
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
class Human{
constructor(name) {
this.name = name;
}
sayHi(){
console.log('我是： '+this.name);
}
}
var h1 = new Human('Keafmd');
h1.sayHi()
</script>
<title></title>
</head>
<body>
</body>
</html>
效果截圖：
物件的原型模型
通過物件可以給物件擴展欄位（屬性、方法）
如果想同一個型別，都添加屬性，則需要用到原型 prototype
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
function Student(){
this.name = '';
this.age = 0;
}
var s1 = new Student();
//給物件擴展方法
// s1.sayHi =function(){
// console.log('打招呼')
// }
//給原型擴展
Student.prototype.sayHi = function(){
console.log('打招呼')
}
s1.sayHi();
var s2 = new Student();
s2.sayHi();
</script>
</head>
<body>
</body>
</html>
效果截圖：
寫作不易，讀完如果對你有幫助，感謝點贊支持！
如果你是電腦端，看見右下角的“一鍵三連”了嗎，沒錯點它[哈哈]
加油！
共同努力！
Keafmd
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/211686.html
標籤：python