`
weakfi
  • 浏览: 96979 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

js随记

阅读更多

一、关于var spot={} 和 var spot= function(){} 的区别

var dog={}

 

 相当于创建一个空的Object对象:

 

var dog = new Object()

 

 

下面这种定义方式:

var Dog= function(name){this.name = name} 
 

相当于定义一个叫做Dog的Class对象(实际在JS中没有类的概念),更贴切的说法是一个创建对象的模板,通过下面这种方式新建一个空的Dog对象可以说明这个问题:

 

var myDog  = new Dog('wangwang');

“new”运算符执行的操作很简单。首先,它创建一个新的空对象。然后执行紧随其后的函数调用,将新的空对象设置为该函数中“this”的值。

 

二、如何用JS模拟私有属性

正常情况下,无法从函数以外访问函数内的本地变量。函数退出之后,由于各种实际原因,该本地变量将永远消失。但是,如果该本地变量被内部函数的闭包捕获,它就会生存下来。这一事实是模拟 JavaScript 私有属性的关键。假设有一个 Person 类:

 

function Person(name, age) {
    this.getName = function() { return name; };
    this.setName = function(newName) { name = newName; };
    this.getAge = function() { return age; };
    this.setAge = function(newAge) { age = newAge; };
}
 

 参数 name 和 age 是构造函数 Person 的本地变量。Person 返回时,name 和 age 应当永远消失。但是,它们被作为 Person 实例的方法而分配的四个内部函数捕获,实际上这会使 name 和 age 继续存在,但只能严格地通过这四个方法访问它们。因此,您可以:

var ray = new Person(“Ray”, 31);
alert(ray.getName());
alert(ray.getAge());
ray.setName(“Younger Ray”);
// Instant rejuvenation!
ray.setAge(22);
alert(ray.getName() + “ is now “ + ray.getAge() + "years old");

 三、原型

 首先需要理解什么是原型,什么是原型链,还有对象创建过程的步骤(下面这一段是引用):

 

我们已经知道,用 var anObject = new aFunction() 形式创建对象的过程实际上可以分为三步:第一步是建立一个新对象;第二步将该对象内置的原型对象设置为构造函数prototype引用的那个原型对象;第三步就是将该对象作为this参数调用构造函数,完成成员设置等初始化工作。对象建立之后,对象上的任何访问和操作都只与对象自身及其原型链上的那串对象有关,与构造函数再扯不上关系了。换句话说,构造函数只是在创建对象时起到介绍原型对象和初始化对象两个作用。

 

用原型有什么好处:

1、代码可以比较优雅,有逻辑性,比如下面这两段代码的作用是一样的,可以第二段显然比较易读:

 

hello = function(){};
var person = function(){
   this.hello = hello;
}

var a = new person();
var b = new person();
a.hello();
b.hello();
 

 

var person = function(){
  
}

person.prototype.hello=function(){}

var a = new person();
var b = new person();
a.hello();
b.hello();

 2、共享代码,如果直接在function定义块里面定义一个内部方法,则由这个function新建的对象不能共享这个内部方法,相反,会为每个对象创建新的内部方法对象:

 

var person = function(){
   this.hello = function(){} 
}

var a = new person();
var b = new person();

console.log(a.hello == b.hello);   //false

 用原型之后:

 

var person = function(){
}
person.prototype.hello = function(){}

var a = new person();
var b = new person();

console.log(a.hello == b.hello); // true
 

 

 四、闭包

http://blog.csdn.net/hitman9099/archive/2009/01/28/3854171.aspx

 

 

 五、匿名函数

编写匿名函数的3种方式:

1、函数字面量:首先声明一个函数对象,然后执行它。 

 

(function(){ alert(1); } ) ( ); 

 2、优先表达式:由于Javascript执行表达式是从圆括号里面到外面,所以可以用圆括号强制执行声明的函数。 

(function(){ alert(2); } ( ) ); 

 3、void操作符:用void操作符去执行一个没有用圆括号包围的一个单独操作数。 

void function(){ alert(3); }() 
最主要的作用:避免全局变量的污染。

 

 

 

分享到:
评论

相关推荐

    NativeJS随记 - 浅析JavaScript Events

    标题中的“NativeJS随记 - 浅析JavaScript Events”表明这篇博客主要讨论的是JavaScript中的事件处理机制。JavaScript事件是Web开发中的重要组成部分,它允许我们响应用户的交互或浏览器的内部变化。在这里,我们将...

    微信小程序小手随记个人记账软件系统

    它有自己的框架和语言WXML(Weixin Markup Language)和WXSS(Weixin Style Sheets),以及JavaScript处理业务逻辑。开发者可以利用这些工具创建交互式的用户界面。 - **UI设计**:前台小程序的界面设计遵循微信小...

    随记(ajax效果的增删改查)

    新人一枚,网上搜了很多关于ajax增删改查的例子,都不是自己要的效果,自己写的,虽然花了点时间,并且很基础,但是增删改查还是全的。希望可以帮到您哦。这个是我自己没有休整过的,注释较白话,大神什么的勿喷。

    AJAX 随记

    <script type="text/javascript" src="ajax.js"> Welcome. ('ajax/get1.jsp', 'd1');">d1 ('ajax/get2.jsp', 'd2');">d2 <div id="a">d2 ``` 在这个例子中,当用户点击`d1`或`d2`时,对应的JSP页面(如`ajax/get1....

    angular 服务随记小结

    Angular是目前流行的前端JavaScript框架之一,它的一个核心特性是提供了强大的依赖注入(Dependency Injection,DI)机制。依赖注入是一种设计模式,允许我们声明和管理应用程序的依赖关系,使得代码解耦且更加容易...

    javascript-whatever:无论我想到什么JavaScript

    描述中的“无论我想到什么JavaScript”则表明这个项目可能是作者随想随记的JavaScript知识点汇集,可能包含各种各样的主题,如DOM操作、事件处理、异步编程、ES6及更高版本的新特性、性能优化、错误处理等。...

    BFNotes:BF随记微信小程序,已于2020年11月10日上线,用于记录日常随礼,收礼等

    在微信小程序的开发中,JavaScript结合了微信小程序提供的WXML(微信小程序标记语言)和WXSS(微信小程序样式语言),共同构建了BFNotes的用户界面和业务逻辑。 WXML负责定义小程序的结构,类似于HTML,但具有更...

    handbook:放置我的笔记、搜集、摘录、实践,保持好奇心。看文需谨慎,后果很严重

    这里就是个随记,涉猎技术知识点广而不精,不能保证正确,看文需谨慎,后果很严重。 精华置顶 awesome-mac - 收集分享大量非常好用的Mac应用程序。 awesome-uikit - 搜集基于 React/Vue/Angular 的UI组件库管理平台...

    oblog博客网站源码(经测试)

    新增管理员自定义js调用管理.调用信息更加方便. 9. 新增标签批量随机调用用户头像.可作为博客推荐.($show_rnduser$) 10.新增随记访问博客功能.做链接到Rnd_blogger.asp即可.(可以加在友情链接的广告里)

    php mvc技术实现大全

    - Smarty 学习随记!.txt:Smarty是一个流行的PHP模板引擎,它允许开发者将PHP代码与HTML分离,实现视图的独立性。 - PHP网站MVC架构模式中的种种误区.txt:文档可能列举了在使用PHP MVC时常见的错误和陷阱,帮助...

    undeadway.github.io:我的便签

    【描述】中的“各种不成体系的随手小笔记”表明,这个平台上的内容可能涵盖广泛,没有特定的结构或分类,更多的是随想随记,反映出个人思维的灵动性和多样性。这些笔记可能包括技术问题的解决方案、灵感闪现的想法、...

    接口测试工具:Postman

    - **自动化测试**:编写测试脚本,实现对一组接口的批量测试,可以使用Postman的内置测试命令或自定义JavaScript代码。 - **集成CI/CD**:Postman可以与Jenkins、GitLab CI/CD等持续集成工具集成,将接口测试自动...

Global site tag (gtag.js) - Google Analytics