javascript基础

最新推荐文章于 2024-09-16 08:47:17 发布

小白奋斗史

最新推荐文章于 2024-09-16 08:47:17 发布

阅读量277

点赞数

分类专栏：前端基础文章标签： javascript 跨平台浏览器

本文链接：https://blog.csdn.net/Path_to_God/article/details/53147020

版权

前端基础专栏收录该内容

6 篇文章 0 订阅

订阅专栏

JavaScript

js简介

## js是基于对象和事件驱动的语言,应用于客户端 ##
    *基于对象:js已经提供好了一些对象,可以直接使用
    *事件驱动:和网页的交互操作,如鼠标操作
    *客户端指的是浏览器
## js的三个特点 ##
    *交互性
    *安全性:js不能访问本地硬盘里的文件
    *跨平台性:只要浏览器支持js, 就可以在浏览器中运行js
## js和java的区别 (没关系,就行雷锋和雷峰塔)##
    *java是sun公司,现在是oracle; js是网景公司
    *java跨平台依靠虚拟机; js只需要支持js的浏览器
    *java是强类型语言; js是弱类型语言
## js构成 ##
    *ECMAScript: 由ECMA组织指定的语法,语句,类型等
    *BOM: 浏览器对象模型, 对浏览器进行操作
    *DOM: 文档对象模型, 把整个页面规划成由节点层级构成的文档。

js和html的结合

*第一种,使用html的标签<script type="text/javascript"> js代码 </script>
    `<script type="text/javascript">
        alert("aaa");       //浏览器弹框
    </script>`
*第二种,使用html标签引入外部的js文件, <script type="text/javascript" src="js文件路径"></script>
    **注意:引入外部js文件后不用在标签内写js代码,因为不会执行
    `<script type="text/javascript" src="1.js"></script>`

js的变量声明和数据类型

## 1.js声明变量都用 var 关键字 ##
## 2.js的原始数据类型 ##
    * string, 字符串类型, var str = "abc";
    * number, 数字类型, var num = 10;
    * boolean, 布尔类型, var flag = true;
    * null, 特殊的引用,为空, var data = null;
    * undefined, 定义变量但是没有赋值, var a;
## typeof(变量名): 查看当前变量类型 ##
    *alert(typeof(str));

js的引用类型和类型转换

## 引用类型 ##
    *Object对象,所有对象都是从这个对象继承而来
    *Boolean对象,boolean原始类型的引用类型
    *Number对象,number原始类型的引用类型
## 类型转换 ##
    *转换成字符串: toString
    *转成数字: parseInt(), parseFloat()
    *强制类型转换
        **Boolean(value):强转成Boolean型
        **Number(value):强转成Number型
        **String(value):强转成字符串

js的语句

*js的if, switch, while, do-while, for和java类似
*document.write(); 向页面输出内容, 可以是变量, 可以是html代码
    `document.write(i);
    document.write("<br/>");
    `
*js和html结合的99乘法表
    `<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> html和js的结合-99乘法表 </title>
 </head>

 <body>

 </body>

 <script type="text/javascript">
    /*for(var i = 1; i <= 9; i++) {
        for(var j = 1; j <= i; j++) {
            document.write(j + "*" + i + "=" + i*j);
            document.write("&nbsp;");
        }
        document.write("<br/>");
    }*/

    document.write("<table border='2'>");
    for(var i = 1; i <= 9; i++) {

        document.write("<tr>");
        for(var j = 1; j <= i; j++) {
            document.write("<td>");
            document.write(j + "*" + i + "=" + i*j);
            document.write("</td>");
        }
        document.write("</tr>");

    }
    document.write("</table>");
 </script>

</html>
`

js的运算符

*js的算术运算符,赋值运算符,比较运算符,逻辑运算符和java相同
*js的运算符和java不同的内容
    **js不区分小数和整数: 如 var a = 123/1000*1000; a值为123, java中值为0
    **字符串相加和相减操作: 相加操作和java相同,都是字符串拼接;相减操作是真正的减法运算, 如果字符串不是数字提示"NaN"
    **boolean的运算,true为1, false为0进行运算
    ** js中"=="比较的是值; "==="比较的是值和类型

js的数组

*js定义数组方式
    **var arr1 = [];
    **var arr2 = [10, "abc", true]; //可以是任一类型
    **var arr3 = new Array(3); //定义数组长度
    **var arr4 = new Array(4,5,6); //长度为3,元素为4,5,6
*数组长度:js中数组长度可变,最大值为下标+1, 如果没有赋值默认空字符串

js的全局变量和局部变量

## 全局变量 ##
    *js中如果在script标签定义变量,则在所有script标签中都可以使用该变量
## 局部变量 ##
    *js的方法中定义一个变量,该变量只能在方法中使用

js的全局函数

* eval(): 把字符串当成js代码执行
     ** var str = "alert('123456');";
     //alert(str);
     eval(str);

* isNaN() 检查某个值是否是数字
     ** 如果是数字返回 false,如果不是一个数字返回 true。

* parseInt() 解析一个字符串并返回一个整数
     ** var str1 = "123";
     alert(parseInt(str1)+1);

* encodeURI() 把字符串编码为 URI
     ** var str2 = "abc测试中文";
     var encodestr2 = encodeURI(str2);
     document.write(str2);
     document.write("<br/>");
     document.write(encodestr2);

* decodeURI() 解码某个编码的 URI
     ** var decodestr2 = decodeURI(encodestr2);