js学习笔记31----工厂方式

工厂方式构造对象:

1.原料---构造函数,创建一个对象

2.加工---属性,方法

3.出厂---返回结果

示例代码:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>工厂方式</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script>
           function createPerson(name,sex){  //构造函数:创建一个对象
                //1.原料
                var obj = new Object();

                //2.加工
                obj.name = name;
                obj.sex = sex;

                obj.showName = function(){
                    alert(‘我的名字叫‘+this.name);
                }
                obj.showSex = function(){
                    alert(‘我是‘+this.sex+‘的‘);
                }

                //3.出厂
                return obj;
            }
            var p1 = createPerson(‘sese‘,‘女‘);
            var p2 = createPerson(‘JJ‘,‘男‘);
            p1.showName();
            p1.showSex();
            p2.showName();
            p2.showSex();
        </script>
    </head>
    <body>
    </body>
</html>

工厂方式的问题:

1.没有new;

2.每个对象都有一套自己的函数——浪费资源。

函数的叫法:

函数:独立的,自由的。

方法:属于一个对象的函数。

事件处理函数:用于处理一个事件的函数。

构造函数:创建一个对象的函数 = 类。

时间: 2024-10-14 03:37:15

js学习笔记31----工厂方式的相关文章

JS学习笔记-OO疑问之对象创建

问一.引入工厂,解决重复代码 前面已经提到,JS中创建对象的方法,不难发现,基本的创建方法中,创建一个对象还算简单,如果创建多个类似的对象的话就会产生大量重复的代码. 解决:工厂模式方法(添加一个专门创建对象的方法,传入参数避免重复) function createObject(name,age){ var obj =new Object(); //创建对象 obj.name = name; obj.age = age; obj.run = function(){ return this.nam

JS学习笔记-OO疑问之封装

封装是面向对象的基础,今天所要学习的匿名函数与闭包就是为了实现JS的面向对象封装.封装实现.封装变量,提高数据.系统安全性,封装正是面向对象的基础. 匿名函数 即没有名字的函数,其创建方式为 function(){...} 单独存在的匿名函数,无法运行,可通过赋值给变量调用或通过表达式自我执行来实现运行. 1.赋值给变量为一般的函数使用方式 var run = function(){ return '方法运行中'; }; alert(run()); 2.通过表达式自我执行 (function(a

js学习笔记知识点

AJAX用法安全限制JSONPCORS面向对象编程创建对象构造函数原型继承class继承 AJAX 用法 AJAX不是JavaScript的规范,它只是一个哥们"发明"的缩写:Asynchronous JavaScript and XML,意思就是用JavaScript执行异步网络请求 在现代浏览器上写AJAX主要依靠XMLHttpRequest对象: 'use strict'; function success(text) { var textarea = document.getE

JS学习笔记-数组

ECMAScript中没有提供类和接口等的定义,但它却是一门面向对象的语言,由于它能够通过其它 方式实现类似高级语言的面向对象功能,这些内容将在后面的文章中进行一步步的总结.此篇仅对JS中对象作简要说明,重点汇总一些类似于对象的数组的经常用法. 对象 创建 上篇提到创建对象的两种方式: 使用new运算符创建Object var obj = new Object(); 使用字面量方式创建 var   obj = {}; 这里值得注意的是在使用字面量(常量)创建Object时不会调用构造函数. 属性

Node.js学习笔记【1】入门(服务器JS、函数式编程、阻塞与非阻塞、回调、事件、内部和外部模块)

笔记来自<Node入门>@2011 Manuel Kiessling JavaScript与Node.js Node.js事实上既是一个运行时环境,同时又是一个库. 使用Node.js时,我们不仅仅在实现一个应用,同时还实现了整个HTTP服务器. 一个基础的HTTP服务器 server.js:一个可以工作的HTTP服务器 var http = require("http"); http.createServer(function(request, response) { r

JS学习笔记03-初识继承

<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="UTF-8"> <title>test</title> <style type="text/css"> </style> </head> <body> <script type="text/javascr

JS学习笔记--轮播图效果

希望通过自己的学习收获哪怕收获一点点,进步一点点都是值得的,加油吧!!! 本章知识点:index this for if else 下边我分享下通过老师教的方式写的轮播图,基础知识实现: 1.css代码 <style> ul, ol { padding:0; margin:0; } li { list-style:none; } #box { width:600px; height:350px; border:10px solid #ccc; margin:0 auto; position:r

Vue.js学习笔记:在元素 和 template 中使用 v-if 指令

f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <script src="https://cdn.bootcss.com/vue/2.2.

[Pro Angular.JS]学习笔记1.1:设置开发环境

可以使用yeoman.io,很方便.我已经写了一篇随笔,介绍如何使用.这里也有一篇介绍的文章:http://www.cnblogs.com/JoannaQ/p/3756281.html 代码编辑器,在Mac下用了一下WebStorm,太恶心了.另外发现书的作者使用的开发环境是Windows + VS Express 2013,为了方便学习,我也使用VS Express 2013 Update2.VS2013用起来蛮舒服的,把WebStorm比得跟驼屎一样.也许是因为我没用习惯吧. 1.安装Nod