JavaScript学习笔记(一),js变量、以及函数的调用

简介: JavaScript学习笔记(一),js变量、以及函数的调用

一、 JavaScript的简介

1.简称为js。

JScript-------微软的脚本语言。

javaScript------网景公司的一个脚本语言。


2.javascript和java没有关系。他们是两种编程语言。

Java是服务器端的编程语言,js是前端的技术。


3.Js的代码可以减轻服务器端的压力。把要执行的一些代码分摊到浏览器上交给js去处理。


二、 Js的第一个案例

  1. js代码要写在html的head里面。(开发规范)
  2. 打印:
    a) Alert弹出框
    b) Console.log();在控制台上打印。 F12打开js的控制台
    c) Document.write(“hello world”);打印到html里面,用的少。
<!-- js代码书写的地方 -->
  <script type="text/javascript">
    alert("hello world");
    console.log("hello world");
    document.write("hello world");  
  </script>
  </head>

三. 注释:

跟java一样,都用//和/**/

注意注释写在js的标签< script>里面。

四 Js的变量

Js是一种弱类型的语言。

  1. 所有的变量都用var声明。
  2. 一个变量可以被赋值为任意数据类型,并且可以在多个类型之间切换。
  3. Js的变量可以不声明,直接使用。(不建议这样做。)
  4. 每个指令后面的分号可以省略。(不建议省略)

注意:

  • js不会提示编译错误,因为js不用编译。Js是解释一行运行一行。中间代码有错误了,上面的代码还是会运行出来的。
  • 要时常观察控制台,页面不提示错误,并不表示没有错误。要看js的控制台。

4.2、 Js变量的类型

string类型

  • A.js中是不区分字符串和字符的。
    ’a’= = ”a” ,’abc’ ==”abc”
  • B.Js中也不区分双引号和单引号。
  • C.不管是双引号还是单引号都表示字符串。
  • D.字符串比较使用 = =

Number类型,数字类型。

  • Boolean:真和假。
    0,””,null,undefine都是假
    非0,非“”都是真

Object类型

  • Undefined:只声明未赋值
  • Null:声明了并且赋值为null了就是null。
    函数可以查看变量类型typeof();

字符串跟数字的转换:

parseInt(“字符串”):可以把字符串转换为数字,进行运行。parseFloat()转换小数


parseInt可以找到第一个非数字位前面的数字。

parseInt(“123a”)= = = =123 parseInt(“a1234”)= = =nan parseInt(“12a3”)= = =12

parseInt(“12.3”)= = = =12 parseFloat(“12.3.4”)===12.3


Nan:not a number非数字。

isNaN():判断参数是不是非数字

  <script type="text/javascript">
    var a="hello world";
    console.log(a+"的类型"+typeof(a));
    var b=1;
    console.log(b);
    var d=new Date()
    console.log(d)
    var x=null;
    alert(x);*/
    //var a="a12bc";
    //alert(a=='a12bc');
    if(isNaN(a)){
      alert("a是非数字")
    }else{
      alert("a是数字");
    }
  <script>

五、 函数

定义函数

语法:

function 函数名(参数名1,参数名2...){
  函数体;
  return 返回值;
}
Var 变量名=function(参数名1,参数名2...){
  函数体;
  return 返回值;
}

例如:

  function add(n1,n2){
      //console.log(n1+n2);
      var result=n1+n2;
      return result;
    }
  var r=add(1,2);
  alert(r);

5.2 函数的调用

var result=函数名(实参);

例子:

Var result=add(1,1);
Alert(result);

注意:

  • 函数调用时,形参的个数和实参的个数可以不一致。
  • 2.形参多的话,多出来的就是undefined。
  • 3.形参少的话,多余的实参就会丢失。
  • 4.js中没有函数重载的概念。

  • 上面代码只会弹出aaaaaaaaa
  • 5,调用函数和定义函数的位置没有关系
    比如调用函数可以写在函数声明的上方

5.3 可以将一个函数赋值给一个变量

语法:

Var 变量名=function(){};

结论:

Js中没有对函数和变量进行严格的区分。一个函数可以转换为一个变量。

注意:

如果使用这种写法需要将add的赋值放在调用的上面。所以上面的代码提示add未定义。


5.4 匿名函数的使用场景:

Html中的每一个标签都被js封装成了一个个对象。我们可以通过js代码获取到html的标签对象。Var obj=document.getElmentById(“id属性的值”);//dom对象

得到标签对象后,我们就可以对这个标签对象进行操作。操作包括获取标签的属性值,也包括修改标签的属性值。


注意:

Js代码运行时是从上往下运行的。所以如果我把获取标签的代码写在head标签里面的话,是获取不到标签对象的。这时候就报错set property value of null

解决办法:有两个

  1. 把script标签写在body下面,
  2. Window.οnlοad=function(){写要执行的代码};

Window.onload是等页面全部加载完之后再执行js中的代码,所以这时就已经获取到username的id值就不会再报错set property value of null了!

例如:

5.5 把一个函数作为另外一个函数的参数

对应的代码:

将函数作为另一个函数的参数,

其实框架技术,比如jQuery就是利用这种方式封装代码的

对应的效果:

简写为:

使用场景:

jquery框架中会有很多类似于fun的方法。已经写死到框架里面了。我们需要定义自己的函数,传给fun方法。这样fun方法里面就可以实现一些个性化的代码了。

目录
相关文章
|
14天前
|
JavaScript 前端开发
【JavaScript】——JS基础入门常见操作(大量举例)
JS引入方式,JS基础语法,JS增删查改,JS函数,JS对象
|
2月前
|
JavaScript 前端开发 Java
springboot解决js前端跨域问题,javascript跨域问题解决
本文介绍了如何在Spring Boot项目中编写Filter过滤器以处理跨域问题,并通过一个示例展示了使用JavaScript进行跨域请求的方法。首先,在Spring Boot应用中添加一个实现了`Filter`接口的类,设置响应头允许所有来源的跨域请求。接着,通过一个简单的HTML页面和jQuery发送AJAX请求到指定URL,验证跨域请求是否成功。文中还提供了请求成功的响应数据样例及请求效果截图。
springboot解决js前端跨域问题,javascript跨域问题解决
|
2月前
|
JavaScript 前端开发 Java
[JS]同事:这次就算了,下班回去赶紧补补内置函数,再犯肯定被主管骂
本文介绍了JavaScript中常用的函数和方法,包括通用函数、Global对象函数以及数组相关函数。详细列出了每个函数的参数、返回值及使用说明,并提供了示例代码。文章强调了函数的学习应结合源码和实践,适合JavaScript初学者和进阶开发者参考。
48 2
[JS]同事:这次就算了,下班回去赶紧补补内置函数,再犯肯定被主管骂
|
2月前
|
JavaScript 前端开发
Moment.js与其他处理时间戳格式差异的JavaScript库相比有什么优势?
Moment.js与其他处理时间戳格式差异的JavaScript库相比有什么优势?
|
2月前
|
前端开发 JavaScript
如何在 JavaScript 中访问和修改 CSS 变量?
【10月更文挑战第28天】通过以上方法,可以在JavaScript中灵活地访问和修改CSS变量,从而实现根据用户交互、页面状态等动态地改变页面样式,为网页添加更多的交互性和动态效果。在实际应用中,可以根据具体的需求和场景选择合适的方法来操作CSS变量。
|
2月前
|
前端开发 JavaScript 数据处理
CSS 变量的作用域和 JavaScript 变量的作用域有什么不同?
【10月更文挑战第28天】CSS变量和JavaScript变量虽然都有各自的作用域概念,但由于它们所属的语言和应用场景不同,其作用域的定义、范围、覆盖规则以及与其他语言特性的交互方式等方面都存在明显的差异。理解这些差异有助于更好地在Web开发中分别运用它们来实现预期的页面效果和功能逻辑。
|
2月前
|
前端开发 JavaScript UED
如何使用 JavaScript 动态修改 CSS 变量的值?
【10月更文挑战第28天】使用JavaScript动态修改CSS变量的值可以为页面带来更丰富的交互效果和动态样式变化,根据不同的应用场景和需求,可以选择合适的方法来实现CSS变量的动态修改,从而提高页面的灵活性和用户体验。
|
2月前
|
前端开发 JavaScript 开发者
除了 Generator 函数,还有哪些 JavaScript 异步编程解决方案?
【10月更文挑战第30天】开发者可以根据具体的项目情况选择合适的方式来处理异步操作,以实现高效、可读和易于维护的代码。
|
2月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API
使用JavaScript和Node.js构建简单的RESTful API
|
3月前
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。