使用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基础整理的更多相关文章

  1. js基础整理总结

    变量和变量作用域 变量和函数声明提升定义 Var a=100; Function test(){ 这时候由于变量声明提升,a变量已经声明,值为undefined Console.log(a); Var ...

  2. JS基础整理面试题

    1.DOM和BOM的区别 DOM:document object model;文档对象模型,提供操作页面元素的方法和属性BOM:browser object model;浏览器对象模型,提供一些属性和 ...

  3. SVG.js 基础图形绘制整理(二)

    一.折线 var draw = SVG('svg1').size(300, 300); //画折线 //使用字符串点 // var polyline=draw.polyline('0,0 100,50 ...

  4. Three.js基础

    Three.js基础探寻一 Three.js基础探寻一   1.webGL 一种网络标准,定义了一些较底层的图形接口. 2.Three.js 一个3Djs库,webGL开源框架中比较优秀的一个.除了w ...

  5. js基础进阶--图片上传时实现本地预览功能的原理

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...

  6. Three.js基础探寻一

    1.webGL 一种网络标准,定义了一些较底层的图形接口. 2.Three.js 一个3Djs库,webGL开源框架中比较优秀的一个.除了webGL以外,Three.js还提供了基于Canvas.SV ...

  7. Three.js基础探寻二——正交投影照相机

    本篇主要介绍照相机中的正交投影照相机. 第一篇传送门:Three.js基础探寻一 1.照相机 图形学中的照相机定义了三维空间到二维屏幕的投影方式. 针对投影方式照相机分为正交投影照相机和透视投影照相机 ...

  8. 前端工程师面试问题归纳(一、问答类html/css/js基础)

    一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...

  9. [转帖]nginx基础整理

    nginx基础整理 https://www.cnblogs.com/guigujun/p/6588545.html 目录结构如下: Nginx基础知识 Nginx HTTP服务器的特色及优点 Ngin ...

随机推荐

  1. 对于JavaBean+Servlet+SqlServer的代码总结和打包调用

    日期:2019.3.24 博客期:049 星期日 说起来我已经说过很多次前台的应用技术了呢!这一次我是要将这一部分打包,做成配套的制作工具: 当前我已经打包成功,想要下载的同学可以进入我的GitHub ...

  2. VisualStudio相关序列号

    VisualStudio相关序列号   Visual Studio 2019 Enterprise:BF8Y8-GN2QH-T84XB-QVY3B-RC4DF   Visual Studio 2019 ...

  3. OpenStack—neutron组件介绍与安装

    neutron介绍 Neutron 概述:传统的网络管理方式很大程度上依赖于管理员手工配置和维护各种网络硬件设备:而云环境下的网络已经变得非常复杂,特别是在多租户场景里,用户随时都可能需要创建.修改和 ...

  4. 微信小程序rich-text 文本首行缩进和图片居中

    微信小程序开发使用rich-text组件渲染html格式的代码,常常因为不能自定义css导致文本不能缩进,以及图片不能居中等问题,这里可以考虑使用js的replace方法,替换字符串,然后在渲染的同时 ...

  5. 洛谷 P1414 又是毕业季II

    题目链接 https://www.luogu.org/problemnew/show/P1414 题目背景 “叮铃铃铃”,随着高考最后一科结考铃声的敲响,三年青春时光顿时凝固于此刻.毕业的欣喜怎敌那离 ...

  6. [原创]Vivado SDK Initializing s/w repositories不动

    21:56:16 INFO : Launching XSDB server: xsdb.bat C:/Xilinx/SDK/2015.4/scripts/xsdb/xsdb/xsdb-server.t ...

  7. 函数式编程 - 函数缓存Memoization

    函数式编程风格中有一个"纯函数"的概念,纯函数是一种无副作用的函数,除此之外纯函数还有一个显著的特点:对于同样的输入参数,总是返回同样的结果.在平时的开发过程中,我们也应该尽量把无 ...

  8. 西风 West Wind Html帮助构建器

    https://helpbuilder.west-wind.com/ 示例文档: https://helpbuilder.west-wind.com/docs/_03101e5wp.htm

  9. C++11 带来的新特性 (2)—— 统一初始化(Uniform Initialization)

    1 统一初始化(Uniform Initialization) 在C++ 11之前,所有对象的初始化方式是不同的,经常让写代码的我们感到困惑.C++ 11努力创造一个统一的初始化方式. 其语法是使用{ ...

  10. Django:django-cors-headers 报错no module named "corsheaders"

    django跨域使用 pip install django-cors-headers 然后在settings文件中加上参数设置 # app配置 INSTALLED_APPS = [ 'django.c ...