js-高级技术

高级技术:

1、function Person(name,age,job){

this.name=name;

this.age=age;

this.job=job;

}

var person=new Person("zhng",20,"zzzz");

var person=Person("zhng",20,"zzzz"); ---this指的是window对象

2、在使用大量if条件语句的时候:

function createXHR(){

if(typeOf XMLHttpRequest != "undefined"){

createXHR=function(){

return new XMLHttpRequest();

};

}else if(typeOf ActiveXObject !=undefined){

createXHR=function(){

if(typeOf arguments.callee.activeXString !="string"){

var version=["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"],

i,len;

for(i=0,len=versions.length;i<len;i++){

try{

new ActiveXObject(versions[i]);

arguments.callee.activeXString=versions[i];

break;

}catch(ex){

//skip

}

}

}

return new ActiveXObject(arguments.callee.activeXString);

};

}else{

createXHR=function(){

throw new Error("NO XHR object available.");

};

}

return createXHR();

}

If语句的每个分支都会为createXHR变量赋值,有效覆盖了原有的函数。

3、函数绑定

var handler={

message:"event handler",

handlerClick:function(event){

alert(this.message);

}

};

var btn=document.getElementById("my-btn");

EventUtil.addHandler(btn,"click",function(event){

handler.handlerClick(event);

})

EventUtil.addHandler(btn,"click",bind(handler.handlerClick,handler));

EventUtil.addHandler(btn,"click",handler.handlerClick.bind(handler));

4、防篡改的对象:

  1. 不可扩展对象:

var person={name:"zhang"};

//不能再给对象添加属性以及方法

object.preventExtensions(person);

person.age=29;

alert(person.age); //undefined

  1. 密封的对象:

var person={name:"zhang"};

//不能再给对象删除属性以及方法

object.seal(person);

person.age=29;

alert(person.age); //undefined

delete person.name;

alert(person.name); //zhang

  1. 冻结的对象

var person={name:"zhang"};

//既不可扩展也密封

object.freeze(person);

person.age=29;

alert(person.age); //undefined

delete person.name;

alert(person.name); //zhang

person.name="hui";

alert(person.name);//zhang

5、拖放:为了元素能够拖放,必须是绝对定位

var DragDrop=function(){

var dragging=null;

diffX=0;

diffY=0;

function handleEvent(event){

//获取事件和目标

event=EventUtil.getEvent(event);

var target=EventUtil.getTarget(event);

//确定事件类型

switch(event.type){

case "mousedown":

if(target.className.indexOf("draggable")>-1){

dragging=target;

diffX=event.clientX-target.offsetLeft;

diffY=event.clientY-target.offsetTop;

}break;

case "mousemove":

if(dragging!=null){

//指定位置

dragging.style.left=(event.clientX-diffX)+"px";

dragging.style.top=(event.clientY-diffY)+"px";

}break;

case "mouseup":

dragging=null;

break;

}

};

return {

enable:function(){

EventUtil.addHandler(document,"mousedown",handleEvent);

EventUtil.addHandler(document,"mousemove",handleEvent);

EventUtil.addHandler(document,"mouseup",handleEvent);

},

disable:function(){

EventUtil.addHandler(document,"mousedown",handleEvent);

EventUtil.addHandler(document,"mousemove",handleEvent);

EventUtil.addHandler(document,"mouseup",handleEvent);

}

}

}();

时间: 2024-10-11 00:52:44

js-高级技术的相关文章

5天揭秘js高级技术-第一天

一.基础杂记 1. document.write() 1 <script type="text/javascript"> 2 document.write('<h2>我爱你</h2>'); 3 </script> document.write 2. 变量必须声明才能使用: 使用var声明:局部变量: 没有使用var声明:全局变量: 3. 数据类型: String:字符串 ‘’ ,“”; Number:数字; Boolean:布尔型; Un

开发微信全家桶项目 Vue Node MongoDB高级技术栈全覆盖

开发微信全家桶项目 Vue Node MongoDB高级技术栈全覆盖链接:https://pan.baidu.com/s/15-9Ne3vFEFPzJA0wyltxrg 提取码:加Q:1642261812 V信:SH66668888QH 获取 第1章 本地与服务器环境准备介绍微信公众号/小程序/域名/服务器的申请选购流程,在本地与线上服务器分别对项目的运行环境进行搭建部署,如 Node.js/Vue/Yarn/PM2/Nginx/MongoDB 等等,同时会来简单介绍下从本地通过 PM2 利用

&lt;JS高级程序设计3&gt;_PART3

1.ECMAScript中所有数都以IEEE-754 64位格式存储,但位操作符不直接操作64位的值.是先64位转换成32位的整数,再操作,得到结果再转成64位. 2.首位是符号位.之后的31位代表整数的值. 3.用toString(2)打印二进制,得到的是被处理过的二进制. 4.按位非(NOT)~,数转成二进制,取反.相当于把操作数先变负再-1; 5.按位与(AND)&,两个数的二进制,有一个0结果就是0,两个都是1才为1. 6.按位或(OR)|,有一个1结果为1,都是0才为0. 7.按位异或

惰性函数——JS高级

原文地址:http://www.cnblogs.com/galenyip/p/4613430.html 我们先来看一下js的异步提交. XHR我们在原生的时候常常用到,因为常用到,我们更多把封装到了工具库中 先看下他最常用的实现 1 // 旧方法 2 3 function createXHR() { 4 var xhr; 5 try{ 6 xhr = new XMLHttpRequest(); 7 }catch(e) { 8 handleErr(e); 9 10 try { 11 xhr = n

&lt;JS高级程序设计3&gt;_PART4

1.基本数据类型:Undefined,null,Number,String,Boolean.引用数据类型:保存在内存中的对象. 2.JS不允许直接访问内存中的位置,不能直接操作对象的内存空间.所以操作对象时,实际上是操作的对象的引用,而不是实际的对象. 3. var num1 = 1; var num2 = num1; 一个基本类型的变量向另一个赋值时,执行了复制操作,两个变量互不影响. var obj1 = new Object(); var obj2 = obj1; obj1.age = 2

JS高级特性

一.JavaScript的同源策略 参考链接:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Same_origin_policy_for_JavaScript 同源策略限制了一个源(origin)中加载文本或脚本与来自其它源(origin)中资源的交互方式. 同源定义 如果两个页面拥有相同的协议(protocol),端口(如果指定),和主机,那么这两个页面就属于同一个源(origin). 下表给出了相对http://store.c

GridView 高级技术

GridView 高级技术 汇总脚注 GridView 的主要目标是显示一组记录,但是你还可以加入一些有趣的信息,如汇总数据.需要如下的操作: 设置 GridView.ShowFooter 为 true ,这样可以显示脚注行(但没有数据) 在 GridView.FooterRow 中加入内容 本例假设正在处理产品列表,一个简单的汇总可以显示产品总价或均价.第一步是确定何时计算这个信息.如果正使用手工绑定(DataSource),那么可以在数据对象绑定到 GridView 之间就读取它的值并进行计

JS高级前端开发群加群说明

JS高级前端开发群加群说明 一.文章背景: 二. 高级群: 三. 加入方式: 四. 说明: 一.文章背景: 去年年初建了几个群,在不经意间火了,一直排在“前端开发”关键字搜索结果第一名.当然取得这样的成绩或这样一个结果也是情理之中,一方面来说,提倡的各种交流沟通方法大部分是正确有效或被大家认可的,另外一方面说,这么多人聚在一起,跟大伙的参与分享是分不开的,尤其是各群的管理,是我们的灵魂精神的支柱.另外在国内行业前进的道路上,尽自己的绵薄之力帮助他人,引领氛围,进而影响行业,也是略感欣慰.有时候精

读书笔记 - js高级程序设计 - 第十五章 使用Canvas绘图

读书笔记 - js高级程序设计 - 第十三章 事件 canvas 具备绘图能力的2D上下文 及文本API 很多浏览器对WebGL的3D上下文支持还不够好 有时候即使浏览器支持,操作系统如果缺缺乏必要的绘图驱动程序,则浏览器即使支持了也没用   <canvas> var drawing = document.getElementById("drawing"); if( drawing.getContext ){ drawing.getContext("2d"

分享Java企业级开发必备高级技术(WebLogic、Tomcat集群,Apach调优)

Java自面世后就非常流行,发展迅速,对C++语言形成有力冲击.在全球云计算和移动互联网的产业环境下,Java更具备了显著优势和广阔前景,那么滋生的基于java项目也越来越多,对java运行环境的要求也越来越高,很多java的程序员只知道对业务的扩展而不知道对java本身的运行环境的调试,例如虚拟机调优,服务器集群等,所以也滋生本门课程的产生. Java企业级开发必备高级技术(WebLogic.Tomcat集群,Apach调优),刚刚买的,这个教程讲的很好,高清完整版,现低价转两个播放码,可以先