浅谈对Javascript的理解

最新推荐文章于 2024-07-03 16:17:13 发布

fattyDaddy

最新推荐文章于 2024-07-03 16:17:13 发布

阅读量3.2k

点赞数 1

文章标签：开发语言前端 ecmascript javascript html

本文链接：https://blog.csdn.net/weixin_42596719/article/details/121535658

版权

javascript（H）

概念：一门客户端脚本语言

运行在客户端浏览器中，每一个浏览器都有JavaScript的解析引擎
脚本语言：不需要编译，直接就可以被浏览器解析执行了

功能：

可以用来增户和html页面的交互过程，可以来控制html元素，让页面有一些动态的效果，增强用户体验。

JavaScript发展史：

1992年，Nombase公司，开发出第一门客户端脚本语言，专门用于表单校验。命名为：C--，后来更名为：ScriptEase
1995年，Netscape（网景）公司，开发了一门客户端脚本语言：LiveScript。后来，请来了Sun公司的专家，修改LiveScript，命名为JavaScript
1996年，微软抄袭了javascript开发出了JScript语言
1997年，ECMA（欧洲计算机制造商协会），ECMAScript，就是所有客户端脚本语言的标准。

JavaScript = ECMAScript + JavaScript自己特有的东西（BOM+DOM)

ECMAScript：客户端脚本语言的标准

基本语法

1.与html结合方式

内部js

定义<Script></Script>标签，标签内容就是js代码

<Script></Script>标签可以放在html的任意位置，但是要注意命令执行的先后顺序，也可以定义多个

外部JS

定义<Script></Script>标签,通过src属性引入外部的js文件

eg：<Script src="js/XX.js"></Script>

2.注释

单行注释：//注释内容
多行注释：

/*

注释内容

*/

3.数据类型

1. 原始数据类型（基本数据类型）：
    + number：数字；整数/小数/NaN（not a number 一个不是数字的数字类型）
    + string：字符串；字符串"abc""a"'abc‘（单引号和双引号都可以）
    + blooean：true和false
    + null：一个对象为空的占位符
    + undefined：未定义；如果一个变量没有给初始化值，则会被默认赋值为undefined
2. 引用数据类型：对象

4.变量

变量：一小块存储数据的内存空间
Java语言是强类型语言，而JavaScript是弱类型语言
- 强类型语言：在开辟变量存储空间时，定义了空间将来存储数据的数据类型。只能存储固定类型的数据）
- 弱类型语言：在开辟变量存储空间时，不定义空间将来的存储数据类型，可以存放任意类型的数据

JS语法

var 变量名 = 初始化值；

//定义number类型
var num =1;
var num2 =1.2;
var num3 =NaN;

//输出到页面上
document.write(num+" <br>");
document.write(num2+"<br>");
document.write(num3+"<br>");

//定义string类型
var str = "abc";
var str2 = "edf";
document.write(str+"<br>");
document.write(str2+"<br>");

//定义boolean
var flog = true;
document.write(flog+"<br>");

//定义null,undefined
var obj = null;
var obj2 = undefined;
var obj3 = ;
document.write(obj+"<br>");
document.write(obj2+"<br>");
document.write(obj3+"<br>");

typeof(变量名)可以查看数据类型

5.运算符

一元运算符

只有一个运算数的运算符

++，--，+（正号），-（负号）

++和--：自增和自减
- ++（--）在前，先自增（自减），再运算
- ++（--）在后，先运算，再自增（自减）
+（-）：正负号
- 注意：在js中，如果运算数不是运算符所要求的类型，那么js引擎会自动将运算数进行类型转换
  - string转number：按照字面值转换。如果字面值不是数字，则转为NaN(不是数字的数字)
  - boolean转number：true转为1，false转为0

eg：++在后，先赋值，再自增

var num = 3；
var a = num ++；
doucument.write(num);//4
doucument.write(a);//3

var a = ++ num；
doucument.write(num);//4
doucument.write(a);//4

算数运算符

+，-，*，/，%

赋值运算符

=，+=，-=

比较运算符

＞，＜，>=，<=，==，===(全等于)

比较运算符：
- 比较方式：
  1. 类型相同，直接比较（如果是字符串，按照字典顺序比较，按位逐一比较，直到得出大小为止）
  2. 类型不同，先进行类型转换，再比较
    
    *===，全等于。在比较之前，先判断类型，如果类型不一样，则直接返回false

逻辑运算符

&&与，||或，！非

逻辑运算符：
- &&：与（短路）如果左边条件为false，右边就不会再参与运算了
- ||：或（短路）
- ！：非
  - 其他类型转boolean：
    1. number：0或NaN为假，其他为真
    2. string：除了空字符串(""),其他都是true
    3. null&undefined：都是false
    4. 对象，所有对象都是true

var flog = true；
document.write(flog+"<br>");
document.write(!flog+"<br>")

三元运算符

？，：

eg：

var a = 3；
var b = 4；

var c = a > b ? 1:0;

语法：
- 表达式？值1：值2；
- 判断表达式的值，如果是true则取值1，如果是false则取值2

6.流程控制语句

if...else...

switch

在java中，switch语句可以接收的数据类型：byte int shor char 枚举 string

switch(变量)：

case值：
在js中，switch语句可以接收任意类型的语句

eg:

<script>
    var a = 1/abc/true/null/空值

    switch(a){
        case 1:
            alert("number");
            break;
        case abc:
            alert("string");
            break;   
        case true:
            alert("boolean");
            break; 
        case null:
            alert("null");
            break;
        case undefined:
            alert("undefined");
            break;
    }  
</script>

while

//1~100求和

var sum = 0；
var num = 1；

while(num <=100){
    sum += num;
    num ++;
}
alert(sum);

do...while
for

//1~100求和

var sum = 0 
for (var i = 1; i <=100; i++){
    sum += i
}
alert(sum);

7.特殊语法

语句以;结尾，如果一行只有一条语句则;可以省略（不建议）
变量的定义使用var关键字，也可以不使用
- 用var：定义的变量是局部变量
- 不用var：定义的变量是全局变量(不建议)

基本对象

Function：函数对象

<script>
    /*
        Function:函数（方法）对象
        1.创建
            1.var fun = new Function(形式参数列表，方法体)；
            2.function 方法名称(形式参数列表){
            方法体
            }
            3.var 方法名 = function(形式参数列表){
            方法体
            }
        2.方法：
        3.属性：
        4.特点：
            1.方法定义式，形参的类型不用写，返回值类型也可以不写
            2.方法是一个对象，如果定义名称相同的方法，会覆盖
            3.在js中，方法的调用只与方法的名称有关，和实际的参数列表无关
            4.在方法声明中有一个隐藏的内置对象（数组），arguments,封装所有的实际参数
        5.调用
            方法名称(实际参数列表)
    */
            //1.创建方式1
            var fun1 = new function("a","b","alert(a)");
            //调用方法
            fun1(3,4);
            //2.创建方式2
            function fun2(a , b){
            alert(a + b);
            }
            fun2(3,4)
            //3.创建方式3
            var fun3 = function(a,b){
            alert(a + b)
            }
            fun3(3,4)
</script>

Array：数组对象

1.创建

var arr = new Array(元素列表)；
var arr = new Array(默认长度)；
var arr = [元素列表]；

eg:

var arr1 = new Array(1,2,3);
var arr2 = new Array(5);
var arr3 = new Array(1,2,3,4);

document.write(arr1+"<br>");
document.write(arr2+"<br>");
document.write(arr3+"<br>");

方法

join（参数）：将数组中的元素按照指定的分隔符拼接位字符串

push（）：向数组的末尾添加一个或更多的元素，并返回新的长度
属性

length：数组的长度

特点
js中，数组元素的类型是可变的

eg：var arr = [1,"abc",true]

js中，数组的长度是可变的

fattyDaddy

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
浅谈对Javascript的理解

javascript（H）概念：一门客户端脚本语言运行在客户端浏览器中，每一个浏览器都有JavaScript的解析引擎脚本语言：不需要编译，直接就可以被浏览器解析执行了功能：可以用来增户和html页面的交互过程，可以来控制html元素，让页面有一些动态的效果，增强用户体验。 JavaScript发展史： 1992年，Nombase公司，开发出第一门客户端脚本语言，专门用于表单校验。命名为：C--，后来更名为：ScriptEase 1995年，Net
复制链接

扫一扫