博客列表 >JavaScript中创建对象的方式(字面量或构造函数)--2018年9月14日13时20分

JavaScript中创建对象的方式(字面量或构造函数)--2018年9月14日13时20分

coolperJie
coolperJie原创
2018年09月25日 13:51:42650浏览

对于前端的开发,JavaScript是必不可少的一门编程语言,而它到底是什么呢?对于前端开发又有什么用处呢?接下来就详细的介绍一下:

(1).javascript是最流行的,而且是唯一的写"前端脚本"的编程语言;

(2).前端主要是指:html,css,javascript,以及相关的开发框架,函数库等,共同特征就是指可以直接在浏览器中运行;

(3).脚本语言的一个基本特征是,可以使用标签,以元素的形式直接嵌入到html文档中,例如<script></script>,<?php ?>;


(4).javascript功能极其强大,强大到令人发指,前后端几乎通吃,但它最主要的功能仍是实现用户与页面的交互操作。

大致的介绍了一下后就该进入今天的重头戏了,那就是JavaScript对象的创建创建创建,以下代码详细的讲解了对象创建的集中方式:

<!DOCTYPE html>
<html>
<head>
 <title>javascript基础创建对象的方式</title>
</head>
<body>
<script type="text/javascript">
 //字面量创建对象
 let obj0 = {
  name: '王豪杰',
  age: 24,
  sex: 'male',
  getName: function (){ return this.name;}
 }
 console.log(obj0.name);
 console.log(obj0.age);
 console.log(obj0.getName());

 //构造函数创建对象
 //php中,类是创建对象的模板,而对象是类的实例 js中没有类,有原型
 //函数(是用来创建对象的)

 function createObj(name,age){
  var obj = new Object();
  obj.name = name;
  obj.age = age;
  return obj;
 }
 var obj1 = createObj('wang1',23);
 var obj2 = createObj('wang2',24);
 var obj3 = createObj('wang3',25);
 var obj4 = createObj('wang4',26);
 //构造函数(由工厂模式演变而来)
 //原型(所有实例可共享的属性和方法)
 function Stu(name,age){
  this.name = name;
  this.age = age;
 }
 Stu.prototype.getName = function () {
   return this.name;
  };
 Stu.prototype.sex = 'male';
 var stu1 = new Stu('小明',18);
 var stu2 = new Stu('小红',17);
 console.log(stu1);
 console.log(stu2);
 
</script>
</body>
</html>

说明:其中字面量的方式创建对象,就好比是一个数组以关联数组的方式添加属性方法,调用时只需要使用创建的对象访问对应的属性方法就可以访问;而构造函数的方式创建js对象就是由工厂模式演变而来,js中没有类只有原型,原型中的属性和方法可被所有的实例化对象共享,创建对象是需要用到 关键字 new 实例化对象,而构造函数中的this就是当前所实例化的js对象,值得一提的是,为了防止重复的属性和方法使代码变得简洁,可以把属性和方法定义到原型上,语法为:构造函数.prototype.属性或方法。

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议