JavaScript对象(Object)

程序员文章站 2022-03-21 11:36:44

JavaScript对象对象(Object)对象的创建使用{}创建使用Object创建使用Function创建使用class关键字对象的原型模型对象(Object)对象由花括号分隔，在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义，也叫json。属性由逗号分隔，空格和折行无关紧要。声明可横跨多行。定义一个对象, 姓名：Keafmd, 年龄：18 ，地址：北京，isEdu:false样例代码：var Ke = { 'name': 'Keafmd',...

JavaScript对象

对象(Object)

对象(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>

效果截图：
JavaScript对象(Object)

对象的创建

使用{}创建

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>

效果截图：
JavaScript对象(Object)

使用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>

效果截图：
JavaScript对象(Object)

使用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>

效果截图：

JavaScript对象(Object)

使用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>

效果截图：
JavaScript对象(Object)

对象的原型模型

通过对象可以给对象扩展字段（属性、方法）
如果想同一个类型，都添加属性，则需要用到原型 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>

效果截图：
JavaScript对象(Object)
写作不易，读完如果对你有帮助，感谢点赞支持！
如果你是电脑端，看见右下角的“一键三连”了吗，没错点它[哈哈]

加油！

共同努力！

Keafmd

本文地址：https://blog.csdn.net/weixin_43883917/article/details/109582129

JavaScript对象(Object)