当前位置:  编程技术>WEB前端
本页文章导读:
    ▪AS3数字取整      AS3 数字取整方法 int()去掉小数点  trace(int(3.14));   //输出3  trace(int(-3.14));   //输出-3  Math.round()方法:  Math.round()可以四舍五入对数字取整  trace(Math.round(39.88));&nb.........
    ▪Javascript基础与面向对象基础~第二讲 Javascript中的变量及变量的类型      回到目录前言javascript脚本语言,它的成功很大程度上体现在它对各大浏览器的兼容性上,各大浏览器都按着ECMAScript的标准走,这也使得javascript成为前端工程的一种必要筹码,你的JS牛,你的.........
    ▪jQuery 插件 仿百度搜索框智能提示 调用简单!      因公司需要做一个仿百度搜索框,并且带Value值的, 网上找了下只有Text, 都没带Value的 所以做了个.直接贴代码。(function($) { var timeid; var lastValue; var options; var c; var d; var t; $.fn.autoCo.........

[1]AS3数字取整
    来源: 互联网  发布时间: 2013-11-06

AS3 数字取整方法
int()去掉小数点
 trace(int(3.14));   //输出3
 trace(int(-3.14));   //输出-3
 Math.round()方法:
 Math.round()可以四舍五入对数字取整
 trace(Math.round(39.88));   //输出40
 trace(Math.round(58.33));   //输出58
 Math.floor()方法:
 Math.floor()可以向下取整
 trace(Math.floor(39.88));   //输出39
 trace(Math.floor(58.33));   //输出58
 Math.ceil()方法:
 Math.ceil()可以向上取整
 trace(Math.ceil(39.88));    //输出40
 trace(Math.ceil(58.33));    //输出59
 toFixed()方法:
 toFixed()方法四舍五入取指定位数的小数点,当其中参数为0时表示不留小数点
 var temp:Number=3.1415926
 //toFixed()中的参数就是需要取的小数位数,0表示不留小数点
 var temp:Number=3.1415926
 trace(temp.toFixed(2));  //输出3.14
 trace(temp.toFixed(0));     //输出3
 temp=18.888;
 trace(temp.toFixed(0));     //输出19
 ==============================
 Math.round()方法取小数位数:
 比如说3.14159要精确到.001位,则先3.14159/.001,然后再Math.round(3.14159/.001),最后在把结果乘以需要精确的位数Math.round(3.14159/.001)*.001
 trace(Math.round(3.14159/.001)*.001);   //输出3.142
 trace(Math.round(3.14159/.01)*.01); //输出3.14
 如果不想四舍五入,那直接改round()方法为floor()或者ceil()方法即可
 toFixed()方法取小数位数:
 直接指定toFixed()中的参数即可,比如要留两位小数,则toFixed(2)
 var temp:Number=3.1415926
 trace(temp.toFixed(1));     //输出3.1
 temp=18.888;
   //===========[color=ize:24px]性能分析================
   无论刚入门的还是有一定AS3编程基础的,对Math类应该都不陌生了,但Math类的性能又知多少呢?请看下文吧。
   1、Math.floor()
 通俗的讲这是一个取整函数。
  其实官方解释是
 返回由参数 val 指定的数字或表达式的下限值。 下限值是小于等于指定数字或表达式的最接近的整数。
 性能测试:
  var num:Number = Math.PI;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   Math.floor(num);
 }
 trace(getTimer() - time);
 // 结果:1865
 var num:Number = Math.PI;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   int(num);
 }
 trace(getTimer() - time);
 // 结果:69
   结果很明显,int比floor快,可能大家就要说了,那Adobe傻X写个这样接口干什么?其实这就是我想说的对于floor的使用误区。
 仔细看官方解释,其实floor不是一个真正我们所理解的取整函数,他是去找最接近自己,且比自己小或者等于的整数,那这是什么意思呢?
  var num:Number = - Math.PI;
 trace(int(num));
 trace(Math.floor(num));
 // 结果1:-3
 // 结果2:-4
   这个例子很明确表示,当目标数字是负数时,int和floor所得出的结果不一样。
  int()的官方解释
 将给定数字值转换成整数值。 从小数点处截断十进制值。
 相信看到这,你已经很明白了。
 但是实际上,如果你这样去使用int(),跟floor输出的结果相同:
  var num:Number = - Math.PI;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   if(num < 0){
     int(num) - 1;
   }else{
     int(num);
   }
 }
 trace(getTimer() - time);
 // 结果:132
  
 2、Math.pow()
 对于这个方法,我也不知道说什么好了,先看性能测试吧:
  var a:int = 3;
 var b:int = 4;
 var c:int = 5;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   c * c == a * a + b * b;
 }
 trace(getTimer() - time);
 // 结果:95
 var a:int = 3;
 var b:int = 4;
 var c:int = 5;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   Math.pow(c,2) == Math.pow(a,2) + Math.pow(b,2);
 }
 trace(getTimer() - time);
 // 结果:7999
   勾三股四弦五大家应该比较多,但是用"*"乘法运算和pow的性能比较那是非常明显啊。
 难道大家又想说Adobe傻逼了?这儿我为它平反吧。
  var num:Number = Math.PI;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   Math.pow(num,10000);
 }
 trace(getTimer() - time);
 // 结果:6682
   先不说"*"乘法运算比pow快,就上面这段你能把它换算成使用"*"乘法运算吗?
 而且pow其实是可以这样用的:(数学学得好都知道开方其实是可以转换成乘方来算的)
  trace(Math.pow(27,1/3));
 trace(Math.pow(256,1/4));
 trace(Math.pow(3125,1/5));
   而开方函数Adobe只提供了sqrt一个开平方根的接口(经测试Math.sqrt(9)比Math.pow(9,1/2)快,但开立方等就得靠pow了)。
  
 3、Math.round()
 这个方法跟floor一样的,先看性能测试:
  var num:int = Math.PI;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   Math.round(num);
 }
 trace(getTimer() - time);
 // 结果:1931
 var num:int = Math.PI;
 var length:int = 10000000;
 var time:int = getTimer();
 for(var i:int = 0; i < length; i ++){
   int(num + 0.5)
 }
 trace(getTimer() - time);
 // 结果:68
   四舍五入其实加个0.5在取整,这样也是可以的,只不过用这个算法,存在跟第一个同样的问题,当目标数值为负时,两种方式结果不一样,需要加个判断,目标数值为负就把结果-1。

游戏开发论坛:http://jiushun8.com/forum.php?mod=viewthread&tid=2660&extra=page%3D1

作者:dong2008hong 发表于2013-1-22 9:35:25 原文链接
阅读:0 评论:0 查看评论

    
[2]Javascript基础与面向对象基础~第二讲 Javascript中的变量及变量的类型
    来源:    发布时间: 2013-11-06

回到目录

前言

javascript脚本语言,它的成功很大程度上体现在它对各大浏览器的兼容性上,各大浏览器都按着ECMAScript的标准走,这也使得javascript成为前端工程的一种必要筹码,你的JS牛,你的薪水可能就是5位数,呵呵!

有人说JS就是脚本语言,一个个方法,一个个小插件,但我并不这样认为,对于任何一种开发语言来说,它都可以是面向对象的,都可以遵循着面向对象的原则去走,只有这样,你开发出现的代码才是健壮的,可读性强的,看着舒服的。

javascript中的变量

javascript中的变量可以分为全局变量与局部变量,当你不去var声明时,它会默认被声明为全局变量,加上var它就是当前方法中的局部变量,对于全局变量来说,它的作用域就是当前页面,它对于当前页面的所有<script>块都是可见的,而对于局部变量它的作用域就是当前方法块。定义如下:

<script>
variableGlobal = 1; //全局的
var variableGlobal2="1"; //定义在所有function方法之外的,用var声明的变量,也是全局的
function sub(){
var a="1" //局部变量
}
</script>

<script>
alert(variableGlobal )
</script>

javascript中变量的数据类型

开发语言中的数据类型都很类似,对于JS来说它有整型,浮点型,布尔型,数据类型,json类型,对象类型组成,它们之间可以进行相应的运算,如整型与整型之间,整型与浮点型之间,整型与字符型之间。

几种常见的类型及它们的变量如何去定义

    //注意:javascript语言中,对大小写是敏感的

var variableInt = 1; //整形变量
var variableString = "1"; //字符型变量
var variableBool = true; //布尔型变量
var variableFloat = 1.01; //浮点型变量(有的语言里叫它单精度型)
var variableArray = [1, 2, 3, "one", "two", "three"]; //数组型变量
var variableJson = [{ ID: "1", Name: "zzl" }, { ID: "2", Name: "ninali"}]; //Json对象型变量
var variableObject = { ID: 1, Name: "zzl", Age: 30, IsMarry: true }; //JS对象型变量

类型之间的转换

var stringToInt = parseInt(variableString);
var strintToFloat = parseFloat(variableString);
console.log(stringToInt);
console.log(strintToFloat);

各种类型的变量之间的运算

     console.log(variableInt + variableInt); //整型計算
console.log(variableInt + variableString); //整形与字符型计算
console.log(variableInt + variableFloat); //整形与单精度型计算
console.log(variableBool);
console.log(!variableBool); //对布尔型的逻辑非运算
console.log(variableBool && false); //对布尔型的逻辑与运算
console.log(variableBool || false); //对布尔型的逻辑或运算
for (var i = 0, max = variableArray.length; i < max; i++) {//对数组的遍历
console.log(variableArray[i]);
}
for (var i = 0, max = variableJson.length; i < max; i++) {//对JSON对象的遍历
console.log("ID索引为:" + variableJson[i]["ID"] + "对应的Name为:" + variableJson[i]["Name"]);
}
console.log("js对象中,ID属性是" + variableObject.ID + "Name属性是" + variableObject.Name)//输出js对象的值

OK,对于变量的介绍就到这里吧,大家动手自己写写代码,感觉一下吧,呵呵!

感谢阅读!

回到目录

本文链接


    
[3]jQuery 插件 仿百度搜索框智能提示 调用简单!
    来源:    发布时间: 2013-11-06

因公司需要做一个仿百度搜索框,并且带Value值的, 网上找了下只有Text, 都没带Value的 所以做了个.

直接贴代码。

(function($) {
var timeid;
var lastValue;
var options;
var c;
var d;
var t;

$.fn.autoComplete = function(config) {
c = $(this);
var defaults = {
width: c.width(), //提示框的宽度 默认跟文本框一样
maxheight: 150, //提示框的最大高度
top: 6, //与文本框的上下距离
url: "", //ajax 请求地址
type: "post", //ajax 请求类型
async: false, //是否异步请求
autoLength: 0, //文本长度大于0 就请求服务器
getValue: function(value){ }, //当回车 或 鼠标点击选中值的时候执行
clearValue: function(){ }, //当重新请求时清空Value值
getText: function(text){ } //当回车 或 鼠标点击选中值的时候执行
};
options = $.extend(defaults, config);
var p = c.position();
d = $('<div id="autoComplete_Group"></div>');
c.after(d);
d.css({ "left": p.left, "top": p.top + c.height() + options.top, "width": options.width, "max-height": options.maxheight });
t = $('<table cellspacing="0" cellpadding="2"></table>');
d.append(t);
d.append('<input />');

c.bind("keydown", keydown_process);

c.bind("keyup", keyup_process);

c.bind("blur", blur_process);

d.bind("focus", focus_div);

d.bind("mouseout", mouseout_div);
}

function blur_process()
{
timeid = setTimeout(function(){
d.hide();
},200);
}

function mouseout_div()
{
t.find(".nowRow").removeClass("nowRow");
}

function focus_div()
{
clearTimeout(timeid);
c.focus();
}

function keydown_process(e)
{
if(d.is(":hidden")){
return;
}

switch(e.keyCode)
{
case 38:
e.preventDefault();
var p = t.find(".nowRow").prev();
if(p.length > 0){
d.setScroll(options.maxheight, p);
p.mouseover();
}else{
p = t.find("tr:last");
if(p.length > 0){
d.setScroll(options.maxheight, p);
p.mouseover();
}
}
break;
case 40:
e.preventDefault();
var n = t.find(".nowRow").next();
if(n.length > 0){
d.setScroll(options.maxheight, n);
n.mouseover();
}else{
n = t.find("tr:first");
if(n.length > 0){
d.setScroll(options.maxheight, n);
n.mouseover();
}
}
break;
case 13:
e.preventDefault();
var n = t.find(".nowRow");
if(n.length > 0){
options.getValue(n.find("input:hidden").val());
c.val(n.text());
options.getText(c.val());
lastValue = "";
d.hide();
}
break;
}
}

function keyup_process(e)
{
if(e.keyCode == 38 || e.keyCode == 40 || e.keyCode == 13 || e.keyCode == 37 || e.keyCode == 39){
return;
}

if(c.val().length > options.autoLength){
if(c.val() == lastValue){
return; //判断是否跟上一次的值相等, 考虑到用户正在打字 避免相同的值多次请求
}

lastValue = c.val(); //记录请求值
options.clearValue(); //清空值
getData(c, function(data){
if(data.length == 0){
d.hide();
return;
}
t.find("tr").remove();
$.each(data, function(
    
最新技术文章:
▪css white-space:nowrap属性用法(可以强制文字不...
▪IE里button设置border:none属性无效解决方法
▪border:none与border:0使用区别
▪html清除浮动的6种方法示例
▪三个不常见的 HTML5 实用新特性简介
▪css代码优化的12个技巧
▪低版本IE正常运行HTML5+CSS3网站的3种解决方案
▪CSS Hack大全-教你如何区分出IE6-IE10、FireFox、Chr...
▪ie6,ie7,ie8完美支持position:fixed的终极解决方案
▪小技巧处理div内容溢出
▪html小技巧之td,div标签里内容不换行
▪纯CSS实现鼠标放上去改变文字内容
▪li中插入img图片间有空隙的解决方案
▪CSS3中Transition属性详解以及示例分享
▪父div高度不能自适应子div高度的解决方案
▪告别AJAX实现无刷新提交表单
▪从零学CSS系列之文本属性
▪HTML 标签
▪CSS3+Js实现响应式导航条
▪CSS3实例分享之多重背景的实现(Multiple background...
▪用css截取字符的几种方法详解(css排版隐藏溢...
▪页面遮罩层,并且阻止页面body滚动。bootstrap...
▪CSS可以做的几个令你叹为观止的实例分享
▪详细分析css float 属性以及position:absolute 的区...
▪IE6/IE7/IE8/IE9中tbody的innerHTML不能赋值的完美解...
▪CSS小例子(只显示下划线的文本框,像文字一...
▪可以给img元素设置背景图
▪不通过JavaScript实现的自动滚动视差效果
▪div+CSS 兼容小摘
▪CSS的inherit与auto使用分析
 


站内导航:


特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

©2012-2021,,E-mail:www_#163.com(请将#改为@)

浙ICP备11055608号-3