!!将一个值方便快速转化为布尔值

console.log( !!window===true );

不声明第三个变量实现交换

var a=1,b=2;
a=[b,b=a][0];//执行完这句代码之后 a的值为2 b的值为1了

&&和||的用法 (学会了立马感觉高大尚了吧)

var day=(new Date).getDay()===0;
//传统if语句
if (day) {
alert('Today is Sunday!');
};
//运用逻辑与代替if
day&&alert('Today is Sunday!');//也就是说只有day为真的情况才执行后面的代码alert 一句简单的代码就实现了上面的if功能 强大吧
 if (!a) {
a = {};
}
//上面的三句话可以用下面的一句话替换哦
a = a || {}; //解释这句话一下哦 如果有a这个变量的声明的话 那么它还是原来的对象 如果没有就给它创建一个对象

顺便写一下下面的例子,

与其这样书写:if(string.length > 0){..}
不如这样书写:if(string.length){..}

NAN不等于任何值,包括它自身

大家都知道在任何编程语言中,如果被除数为0则会报错,而在js里面不会,它返回的值为NAN,NaN表示一个不能产生正常结果的运算结果,我们可以用isNaN(number)来检测是不是NAN,但是大家也许都不知道NAN不等于任何值,包括它自身。

利用script标签保存任意信息

将script标签设置为type='text'然后可以在里面保存任意信息,之后可以在JavaScript代码中很方便地获取。

页面代码如下所示:

<script type="text" id="angelaScript">
<h1>这个标题1是不会显示出来的,可以用这种方式保存信息哦!</h1>
</script>
<script type="text/javascript">
console.log(document.getElementById('angelaScript').innerHTML);
</script>

结果显示如下图所示:

js当中Switch的一些用法

看上图运行的效果,总结一句哦!

  • 1)switch参数变量与case后面的比较是全等比较,也就是说===的比较
  • 2)并非每一个case后面都需要书写break,如果不写的话,它会顺序往下执行的
  • 3)switch语句不光可以使用数字、字符做条件表达式,还可以使用字符串!

看下面的switch的使用,你瞬间觉得switch这么厉害!

了解作用域,清楚明白当前的this是谁

你可能不知道的js数组

  • 数组的length属性不可枚举
  • JS的数组可以用字符串形式的数字下标来访问,因为数组的元素其实是数组对象的属性。
  • delete可以用来从数组中移除元素,但由于一个元素就是一个属性,delete会在数组中遗留一个“空洞”;被delete删除的元素为undefined,使用splice方法可能是一个更好的办法。例如要删除arr数组的第3个元素,可以使用这样的语句:arr.splice(2,1);不过对于大型数组来说,这个函数的效率可能不高。

html中设置了id的元素居然是js的全局变量哦

html页面代码如下所示

    <div id="angelaDiv">
</div>
<script type="text/javascript">
console.log(angelaDiv);
</script>

在chrome控制台看到的结果如下图所示

字符串居然能用下标访问

大家都知道字符串是不可变的,在js中也是如此。也就是说一旦字符串被创建,就无法改变。但是我相信很少人知道在js当中居然可以用下标来访问字符串当中的某一个字符,虽然可以用下标读取但去不能修改哦(虽然修改操作不会报错,但是却不起作用)

字符串的一些方法

  • string的substring函数的用法和slice一样,但是它不能处理负数参数。ECMAscript中也没有对substr方法进行标准化,所以如果要取一个字符串的子串,就用slice方法吧!
  • string的split(separator,limit)方法把string分割成片段,来创建一个字符串数组。可选参数limit可以限制被分割的片段数量。separator参数可以是一个字符串或一个正则表达式,并且来自分组捕获的文本将会被包含在被分割后的数组中
var s = 'str1 , str2 , str3';s.split(/\s(,)\s/,4);
//输出结果:["str1",",","str2",","]

把浏览器当成编辑器

浏览器地址栏输入以下代码,立马就把浏览器变成notepad了,厉害吧!

data:text/html, <html contenteditable>

垂直居中

大家都知道css里面用text-align:center加上margin:0 auto就可以实现水平居中了,但是垂直居中却没有相应的css属性来设置,而如果要设置元素能够垂直居中必须得将容器设置为display:table,然后将子元素也就是要垂直居中显示的元素设置为display:table-cell,然后加上vertical-align:middle来实现。

看代码吧!下面的代码利用css3的transform来实现垂直居中和水平居中

.center-vertical {
position: relative;
top: 50%;
transform: translateY(-50%);
}
.center-horizontal {
position: relative;
left: 50%;
transform: translateX(-50%);
}

如果您觉得本篇博文对您有所收获,觉得小女子还算用心,请点击右下角的 [推荐],谢谢!

我总结的js方面你可能不是特别清楚的小知识的更多相关文章

  1. js制作带有遮罩弹出层实现登录小窗口

    要实现的效果如下 点击“登录”按钮后,弹出登录小窗口,并且有遮罩层(这个名词还是百度知道的,以前只知道效果,却不知道名字) 在没有点击“登录”按钮之前登录小窗口不显示,点击“登录”按钮后小窗口显示,并 ...

  2. JS的基本类型(小知识)

    一:js中的基本类型: 基本类型:boolen, string ,number,null,undefined 引用类型:object,和函数 二.undedifned和null的区别: 1 undef ...

  3. JS框架设计读书笔记之-小知识

    这一篇写一点小知识 JS中0.1+0.2为什么不等于0.3? 关于这个问题之前也很疑虑,老师也只是笼统的讲这是JS的语言问题,但是内部具体的情况却没有讲,看了书才发现原理如此简单. 简单来讲,计算机识 ...

  4. js中级小知识1

    首先我们复习之前的小知识,本期博客与之前有关 js数据类型 基本数据类型:string    undefined         null         boolean          numbe ...

  5. JS:关于JS字面量及其容易忽略的12个小问题

    简要 问题1:不能使用typeof判断一个null对象的数据类型 问题2:用双等号判断两个一样的变量,可能返回false 问题3:对于非十进制,如果超出了数值范围,则会报错 问题4:JS浮点数并不精确 ...

  6. 自定义博客cnblogs样式的必备前端小知识——js、jq

    JQ.JS相关小知识 任意元素自动点击 $(".editicon").trigger('click') 添加子元素 append() - 在被选元素的结尾插入内容 prepend( ...

  7. js 小知识

    在iframe 页面获取父级页面的 html var obj = window.parent.document.getElementById('modaliframe'); 解决Jquery 的在一个 ...

  8. JS中的事件类型和事件属性的基础知识

    周末无聊, 这几天又复习了下JS搞基程序设计3, 想着好记性不如浪笔头哇, 要么把这些东西写下来, 这样基础才能更加扎实么么哒, 知道的同学也可以直接过一下,当做复习,  小姨子再也不用担心我的学习啦 ...

  9. 总结的js性能优化方面的小知识

    前言 一直在学习javascript,也有看过<犀利开发Jquery内核详解与实践>,对这本书的评价只有两个字犀利,可能是对javascript理解的还不够透彻异或是自己太笨,更多的是自己 ...

随机推荐

  1. 新玩具---Amazon Kindle PaperWhite 2

    自从将闲置了一段时间的K3 Keyboard 3G送人后,就一直用Nexus7平板上装Kindle程序来读书,用着也挺好,没有出现很多人说的费眼问题,说来也奇怪上学毕业之后,一直从事编程相关的工作有七 ...

  2. JavaScript返回上一级,并重新加载页面

    window.location.href = document.referrer;

  3. pageEncoding与contentType属性

    1图例分析 由图中可以看出,这个两个属性没有任何关系. 把这两个设置成不同的编码格式对中文显示不会产生任何影响 2.原因分析 pageEncoding规定了以什么编码方式存储和读取,使两者保持一致性, ...

  4. Android四大组件之Activity详解——传值和获取结果

    废话不多说,先来看效果图 项目源码: http://download.csdn.net/detail/ginodung/8331535 程序说明: 在MainActivity中输入用户名和密码,然后提 ...

  5. Maven的set.xml标签详解

    文件存放位置 全局配置: ${M2_HOME}/conf/settings.xml 用户配置: ${user.home}/.m2/settings.xml note:用户配置优先于全局配置.${use ...

  6. Java反射机制学习与研究

    Java反射机制:可以获取正在运行时的Java对象. 1.判断运行时对象对象所属的类. 2.判断运行时对象所具有的成员变量和方法. 3.还可以调用到private方法,改变private变量的值. S ...

  7. Shell脚本编程中的几个问题

    条件语句 正确的写法: if [ $1 = "-f" ] #注意这里,前后方括号和中间的内容之间必须有空格! then commands fi 错误的写法: if [$1 == & ...

  8. 在 ASP.NET 中执行 URL 重写的方法

    由于需要我们经常会想将动态的页面做成伪静态的,或者在get传值的时候使其简洁明了(实现“可删节”的URL),这时我们需要用到URL重写,微软的MSDN上有详细的原理和使用介绍.我这里就将一种简单的使用 ...

  9. [转] Java序列化与反序列化

    原文地址:http://blog.csdn.net/wangloveall/article/details/7992448 Java序列化与反序列化是什么?为什么需要序列化与反序列化?如何实现Java ...

  10. java环境变量设置

    java环境变量设置 1.打开我的电脑--属性--高级--环境变量 2.新建系统变量JAVA_HOME 和CLASSPATH 变量名:JAVA_HOME 变量值:C:\Program Files\Ja ...