JS基础整理
使用JS的三种方式
1、直接在html标签中,使用事件属性,调用js代码
<button onclick="alert('弹框')">弹框!</button>
2、在页面的任意位置,使用script标签,插入js代码
<script type="text/javascript">
//js代码
</script>
3、引入外部js文件
<script src="new_file.js" type="text/javascript"></script>
【注意事项】
①js代码可以放在代码的任何位置使用,但是放置的位置不同,将影响js执行的顺序
②引入外部js的script标签中,不再包含任何的js代码
js中的变量
1、变量的声明:
var num=1;//使用var声明的变量属于局部变量,只在当前作用域有效
num="谔谔企鹅"//不用var声明的变量,默认是全局变量,在这个js文件可用
var a=1,b,c=3;//使用一行代码,声明多个语句 其中b为undefined
【js中变量声明的注意事项】
①js中声明变量关键字只有var一个,变量的类型取决于所赋的值
如果声明后未赋值,则为undefined类型
②js中同一个变量,可以在多次赋值中,被修改数据类型
③变量可以使用var声明,也可以直接赋值声明。
区别:使用var声明的作用域为局部变量
④在js中,一个变量可以多次使用var声明,声明相当于赋值。
⑤js变量名 区分大小写
2、js中的数据类型:
undefined:使用var声明,但是没有赋值
null: 表示空的引用
Boolean:真假
number:数值类型,包括整型和浮点型
string:字符串
object:对象
3、常用数值函数
①isNaN:用于检测一个变量是不是非数值(not a namber)
isNaN在检测时,会先调用number函数,尝试将变量转为数值类型,如果最终结果能够转为数值,则不是NaN
②Namber函数:将各种数据类型转为数值类型
undefined 无法转换,返回NaN
null 转为 0
Boolean true 1 false 0
字符串 如果是纯数值字符串,可以转换 “123” -->123
如果有 数字 字母 无法转换
如果是空字符串 转为0
③parseInt():将字符串转为数值类型
字符串如果是空字符串 不能转 返回NaN
如果是纯数值类型可以转换,且小数点直接舍去 “123.8”-->123
如果字符串包含非数值字符,则将非数值字符前面的整数进行转换 “1a1”-->1
④parefloat:转换机制与pareint()相同
不同的是:转小数,有小数点 123.4-->123.4
”123“-->123
⑤typeof:检测一个变量的数据类型
字符串返回的是string 数值 返回的是number true返回Boolean 未定义返回undefined 对象/null返回object 函数 返回function
JS中常用的输入输出语句
1、alert():弹窗输出
2、prompt:弹窗输入 接收两部分参数:①输入提示内容,②输入框的默认内容,两部分都可以省略。
输入的内容默认都是字符串。
3、document.write : 在浏览器内容打印
4、console.log: 浏览器控制台打印
JS中函数的声明与调用
1、函数声明的格式
function 函数名(参数1,参数2){
//函数体代码
return 返回值;
}
函数调用:
①直接调用,函数名(多个参数);
②通过事件调用,
<button onclick="func(prompt(),'444'))">点你呀</button>
2、函数声明与调用的注意事项:
①函数中有没有返回值,只取决于函数中有没有return。无需声明
没有返回值,接收为undefined
②js中,函数的形参列表与实参列表,没有任何关联
函数参数实际个数,取决于实参列表
3、js中,函数是变量的唯一作用域: (其他地方声明变量都为全局变量)
函数的形参是属于函数的局部变量
4、函数的声明与调用语句没有先后之分,可以先调用后声明
【代码的执行顺序】
js代码执行分为两个阶段,检查编译阶段,代码执行阶段
检查编译阶段:检查语法错误,变量的声明 函数的声明
代码执行阶段,变量的赋值,函数的调用执行
func();
var func=function(){
alert(99);
}
先执行var func
再执行func();
func=function(){
alert(99);
}
所以函数的调用 要放在 声明后
function func(){
alert(1);
}
func();
匿名函数的声明与使用
1、匿名函数表达式:
var func=function(){}
2、直接将匿名函数,赋值给一个事件
window.onload=function(){}//文档就绪函数,确保函数中的代码在html加载完 之后执行
window.onload=function(){
document.getElementById("div").onclick=function(){}
}
3、自执行函数
①!function(){}():开头用! 表示自执行语句
②(function(){}()):用()将匿名函数声明与调用包裹在一起
③(function(){})():用()将匿名函数声明包裹
JS基础整理的更多相关文章
- js基础整理总结
变量和变量作用域 变量和函数声明提升定义 Var a=100; Function test(){ 这时候由于变量声明提升,a变量已经声明,值为undefined Console.log(a); Var ...
- JS基础整理面试题
1.DOM和BOM的区别 DOM:document object model;文档对象模型,提供操作页面元素的方法和属性BOM:browser object model;浏览器对象模型,提供一些属性和 ...
- 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 ...
随机推荐
- 如何kill掉tomcat服务
一般我们使用tomcat使用的都是8080端口,今天我在使用eclipse的时候连续启动了两次tomcat,发现被占用了. 第一想法便是重启eclipse,重启后发现tomcat的8080仍然是已经被 ...
- centos7系统部署cobbler批量安装系统
系统环境: 一.开启两个网卡.一个仅主机模式,一个桥接模式,主机模式对内提供cobbler服务 [root@localhost ~]# ip a 1: lo: <LOOPBACK,UP,LOWE ...
- Numpy的基本概念
来源:https://www.numpy.org/devdocs/user/quickstart.html 轴:即维度 eg. [1, 2, 1],有一个轴 [[ 1, 0, 0],[ 0, 1, 2 ...
- “浅入浅出”函数防抖(debounce)与节流(throttle)
函数防抖与节流是日常开发中经常用到的技巧,也是前端面试中的常客,但是发现自己工作一年多了,要么直接复用已有的代码或工具,要么抄袭<JS高级程序设计>书中所述"函数节流" ...
- [转] 使用Node.js实现简易MVC框架
在使用Node.js搭建静态资源服务器一文中我们完成了服务器对静态资源请求的处理,但并未涉及动态请求,目前还无法根据客户端发出的不同请求而返回个性化的内容.单靠静态资源岂能撑得起这些复杂的网站应用,本 ...
- line-gradient 之渐变角度
MDN上对于linear-gradient的定义如下: CSS linear-gradient() 函数用于创建一个表示两种或多种颜色线性渐变的图片.其结果属于<gradient>数据类型 ...
- 实例分析ASP.NET在MVC5中使用MiniProfiler监控MVC性能的方法
这篇文章主要为大家详细介绍了ASP.NET MVC5使用MiniProfiler监控MVC性能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 MiniProfiler ,一个简单而有效的迷你剖析器 ...
- 对接携程供应商php加密解密类
php加密解密类 <?php class Aes{ private $key = '6b4d63211b4ba869'; private $iv = 'dbbf079b95004f65'; pu ...
- .Karma+Jasmine+karma-coverage
单元测试(模块测试)是开发者编写的一小段代码,用于检验被测代码的一个很小的.很明确的功能是否正确.通常而言,一个单元测试是用于判断某个特定条件(或者场景)下某个特定函数的行为. Karma是一个基于N ...
- tp5.0.7 修复getshell漏洞
这里 接手项目用的是 tp5.0.7 突然想到前段事件的tp bug 事件 就试了下 发现确实有这种情况 参考帖子: https://bbs.ichunqiu.com/thread-48687-1-1 ...