下面小编就为大家带来一篇 JS 中多种方式创建对象详解。小编觉得挺不错的。现在分享给大家,给大家一个参考。一起跟随小编过来看看吧
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
1. 内置对象创建
- var girl=new Object();
- girl.name='hxl';
- console.log(typeof girl);
2. 工厂模式, 寄生构造函数模式
- function Person(name){
- var p=new Object();//内部进行实例化
- p.name=name;
- p.say=function(){
- console.log('my name is '+ p.name);
- }
- return p;//注:一定要返回
- }
- var girl=Person('haoxioli');
- girl.say();
3. 构造函数创建
- var Product=function(name){
- this.name=name;
- this.buy=function(){
- console.log('我衣服的牌子是'+this.name);
- }
- }
- var pro=new Product('真维斯');
- pro.buy();
4. 原型创建, 缺点:实例中的每个属性有可能会不一样
- var Role = function() {}
- Role.prototype.name = {
- nickName: '昵称'
- };
- var boy = new Role();
- boy.name.nickName = '刘晓兵';
- console.log(boy.name.nickName); //刘晓兵
- var girl = new Role();
- girl.name.nickName = '郝晓利';
- console.log(boy.name.nickName); //郝晓利,因为实例对象可以修改原型中的引用对象的值
- console.log(girl.name.nickName); //郝晓利
5. 混合模式:原型 + 构造,可以把不让实例修改的属性放到构造函数中,可以修改的放原型中
- var Role = function() {
- this.name = {
- nickName: 'aaa'
- };
- }
- Role.prototype.age = 30;
- var boy = new Role();
- boy.name.nickName = 'boy';
- console.log(boy.name.nickName); //boy
- var girl = new Role();
- girl.name.nickName = 'girl';
- console.log(boy.name.nickName); //boy,实例不会修改构造函数中的值
- console.log(girl.name.nickName); //girl
6. 字面量形式
- var cat={
- name:'lucy',
- age:3,
- sex:'母'
- };//将对象转换成字符串
- console.log(JSON.stringify(cat));//{"name":"lucy","age":3,"sex":"母"}
- var dog='{"name":"john","sex":"公"}';
- console.log(JSON.parse(dog).name);//将字符串转为对象
7. 拷贝模式
- function extend(tar, source) {
- for (var i in source) {
- tar[i] = source[i];
- }
- return tar;
- }
- var boy = {
- name: '醉侠客',
- age: 20
- };
- var person = extend({},
- boy);
- console.log(person.name);
8. 第三方框架
- //先引入包
- <script src='js/base2.js'></script>
- //base2框架,Base.extend及constructor都是固定用法
- var Animal=Base.extend({
- constructor:function(name){
- this.name=name;
- },
- say:function(meg){
- console.log(this.name+":"+meg);
- }
- });
- new Animal('lily').say('fish');
另一个第三方框架
- <script src='js/simplejavascriptinheritance.js'></script>
- //simplejavascriptinheritance框架,Class.extend及init都是固定用法
- var Person=Class.extend({
- init:function(name){
- this.name=name;
- }
- });
- var p=new Person();
- p.name='over';
- console.log(p.name);
以上这篇 JS 中多种方式创建对象详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持 phperz。
来源: http://www.phperz.com/article/17/0221/266605.html