js基础整理总结
- 变量和变量作用域
变量和函数声明提升定义
Var a=100;
Function test(){
这时候由于变量声明提升,a变量已经声明,值为undefined
Console.log(a);
Var a=10;
}
- 字符串
数据类型检测方法:typeof()
函数用法
indexOf 获取索引值
charAt 根据索引值获取单个字符
concat连接字符串
subStr获取部分字符串
substring获取部分字符串
slice获取部分字符串
split(”,”)分割
join合并
字符串大小写转换
toLowerCase (小)
toUpperCase (大)
- 数组
shift unshift 从数组开头开始添加或者删除
pop push 从数组末尾添加或者删除
concat:返回一个新数组,是将参数添加到原数组中构成的
排序 sort 从小到大 reverse 从大到小排序
slice(start,end) 数组截取
join(“|”) 数组拼接成字符串1|2|3|4|5
splice(start,deleteCount,val1,val2,...):
从start位置开始删除deleteCount项,并从该位置起插入val1,val2,..
- 数据类型
- 日期
console.log('获取日期')
date = new Date();
console.log(date.getFullYear()) //获取完整的年份
console.log(date.getYear()) //获取当前年份
console.log(date.getMonth()) //获取当前月份
console.log(date.getDate()); //获取几号
console.log(date.getDay()); //获取星期几
console.log('获取时间')
date = new Date();
console.log(date.getHours()) //获取小时
console.log(date.getMinutes()); //获取分
console.log(date.getSeconds()); //获取秒
console.log(date.getMilliseconds()); // 获取毫秒
console.log(date.getTime()); // 获取相对于1970-01-01的毫秒值
//设置时间
date = new Date();
date.setFullYear(9999); // => 9999年
date.setMonth(11); // => 11:月;实际为12月份(月份从0开始计算)
date.setDate(25); // => 25:日
date.setHours(15); // => 15:时
date.setMinutes(30); // => 30:分
date.setSeconds(40); // => 40:秒
date.setMilliseconds(333); // => 333:毫秒
console.log(date); // => 9999年12月25日 15点30分40秒 333毫秒
- 循环语句
- 数学对象
Math
round(x) 把数四舍五入为最接近的整数。
random() 返回 0 ~ 1 之间的随机数。
- 事件
点击事件
Onclick
Click
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button id="btn1">aa</button>
<button id="btn2">bb</button>
<button id="btn3" onclick="change()">cc</button>
<button id="btn4">ee</button>
<button id="btn5" onclick="change()">ff</button>
</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
//点击事件 onclick是事件,而click是方法
$(function () {
//第一种方法addEventListener添加的事件 removeEventListener() 方法来移除
var btn1=document.getElementById('btn1');
var btn2=document.getElementById('btn2');
btn1.addEventListener('click',change);
btn2.addEventListener('click',function(){alert(this.id)},false);
//第二种方法
//click本身是方法作用是触发onclick事件,只要执行了元素的click()方法,就会触发onclick事件。
$("#btn4").click(function(){
$("#btn3").click();
}) ;
//click方法中的function代码会在onclick事件执行完后执行,此时click方法起到追加事件的作用
$("#btn5").click(function
() {
alert("click btn5");
});
//
document.getElementById("btn3").onclick();
//
document.getElementById("btn3").click();
});
function change() {
alert("onclick btn3");
}
</script>
</html>
鼠标移上离开事件
Onmouseenter鼠标移上
Onmouseleave鼠标离开
dbclick事件:迅速连续的两次点击时触发
mousedown事件:按下鼠标时触发
mouseup事件:松开鼠标时触发
toggle事件:鼠标点击切换事件
hover事件鼠标指针悬停
mouseover事件:鼠标从一个元素移入另一个元素时触发
mouseout事件:鼠标移出元素时触发
焦点事件
focus() 获取焦点
blur() 失去焦点
<input type="text"><span>请输入你的电话号码?</span>
$("input").focus(function(){
$("span").css("display","inline").fadeOut(2000);
});
//失去焦点
$("input").blur(function(){
alert("输入框失去了焦点");
});
常见题目
1.将一个变量放在外面和放在函数中的区别:
将一个变量放在外面,一般称之为全局变量:当前页面内有效
将一个变量放在一个函数中,一般称之为局部变量:只在函数内有效
2. ”==”和“===”的不同
==表示相等:只要值相等就可以了,数据类型不一定相等(会自动做类型转换)
1==‘1’(相等)
===表示全等于:比较的时候必须值和数据类型都相等才相等
1===‘1’(不相等)
3.函数
知道函数其实就是一个工具,我们只需要学会使用工具就可以实现某个功能
这就是封装性
4. split() join() 的区别
前者是切割成数组的形式,后者是将数组转换成字符串
5.题目
5.1写个函数将string的每个字符之间加个空格返回,例如:
addSpace(“hello world”) // -> ‘h e l l o w o r l d’
5.2已知有字符串”get-element-by-id”,写一个function将其转化成驼峰表示法getElementById
5.3 写一个函数,实现如下功能:
字符串反转,如将 '12345678' 变成 '87654321'
js基础整理总结的更多相关文章
- JS基础整理面试题
1.DOM和BOM的区别 DOM:document object model;文档对象模型,提供操作页面元素的方法和属性BOM:browser object model;浏览器对象模型,提供一些属性和 ...
- JS基础整理
使用JS的三种方式 1.直接在html标签中,使用事件属性,调用js代码 <button onclick="alert('弹框')">弹框!</button> ...
- SVG.js 基础图形绘制整理(二)
一.折线 var draw = SVG('svg1').size(300, 300); //画折线 //使用字符串点 // var polyline=draw.polyline('0,0 100,50 ...
- Three.js基础
Three.js基础探寻一 Three.js基础探寻一 1.webGL 一种网络标准,定义了一些较底层的图形接口. 2.Three.js 一个3Djs库,webGL开源框架中比较优秀的一个.除了w ...
- js基础进阶--图片上传时实现本地预览功能的原理
欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...
- Three.js基础探寻一
1.webGL 一种网络标准,定义了一些较底层的图形接口. 2.Three.js 一个3Djs库,webGL开源框架中比较优秀的一个.除了webGL以外,Three.js还提供了基于Canvas.SV ...
- Three.js基础探寻二——正交投影照相机
本篇主要介绍照相机中的正交投影照相机. 第一篇传送门:Three.js基础探寻一 1.照相机 图形学中的照相机定义了三维空间到二维屏幕的投影方式. 针对投影方式照相机分为正交投影照相机和透视投影照相机 ...
- 前端工程师面试问题归纳(一、问答类html/css/js基础)
一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...
- [转帖]nginx基础整理
nginx基础整理 https://www.cnblogs.com/guigujun/p/6588545.html 目录结构如下: Nginx基础知识 Nginx HTTP服务器的特色及优点 Ngin ...
随机推荐
- (转)Java线程面试题 Top 50
原文链接:http://www.importnew.com/12773.html 本文由 ImportNew - 李 广 翻译自 javarevisited.欢迎加入Java小组.转载请参见文章末 ...
- 使用Jersey实现图片服务器与应用服务器分离
现在模拟一下Jersey从客户端发送图片到服务器. 1.Tomcat准备 (1)解压一个新的Tomcat作为图片服务器,然后修改端口号(有3处). (2)然 ...
- VS 2017 Git failed with a fatal error的解决办法
前几天,满怀欣喜的从VS2015更新到了VS2017,经过这几天的试用,整体来说感觉还是挺不错的.昨天推送项目到远程服务器的时候,发现出现了推送失败的错误,错误如图: 按照提示,我看到输出窗口的输入内 ...
- 1134: 零起点学算法41——多组测试数据(a+b)III
1134: 零起点学算法41--多组测试数据(a+b)III Time Limit: 1 Sec Memory Limit: 64 MB 64bit IO Format: %lldSubmitt ...
- 给指针malloc分配空间后就等于数组吗?【转】
首先回答你的问题:严格的说不等于数组,但是可以认为它是个数组一样的使用而不产生任何问题. 不过既然这样,那它应该算是个数组吧.所以,一般我们都用“动态数组”这种名字来称呼这种东西. 要讲清楚这个东西, ...
- mysql 免安装版 + sqlyog 安装 步骤 --- 发的有点晚
总有些朋友不会安装mysql,其实软件安装不是学习mysql的重点,基本上也就安装一次,工作后一般公司里也不会让你安装,如果非要安装,百度一下就行了.安装版本百度上有许多,下面就提供一个免安装版的步骤 ...
- JavaEE开发使用Maven管理的SpringMVC工程
前几篇博客已经陆陆续续的聊了一些Spring的东西,今天博客我们就来聊一下SpringMVC.SpringMVC目前在JavaEE开发中可谓占据一席之地,用起来也是比较顺手的.低耦合,高内聚,利用一些 ...
- Azure WAF防火墙工作原理分析和配置向导
Azure WAF工作原理分析和配置向导 本文博客地址为:http://www.cnblogs.com/taosha/p/6716434.html ,转载请保留出处,多谢! 本地数据中心往云端迁移的的 ...
- SEO,搜索引擎优化原理方法等整体把握
SEO 搜索算法: 全文文字 title 标签,title里面的文字 link 链接 link 链接里的文字 站点信任度 最佳实践: 一.设置title 准确的描述当前网页的内容 提高站点内title ...
- 1.6 OWIN集成
OWIN集成 安装 使用 如果在应用程序里既使用ASP.NET MVC也使用ASP.NET Web API,需要在工程里安装Abp.Owin包. 安装 添加Abp.Owin包到主工程里(一般是web工 ...