js的简单介绍及基本用法

1. JS的简介概述: JavaScript, 是一门弱类型语言, 用来给页面增加动态功能的.//弱类型语言: 对数据的数据类型划分不精细(不明确).
        特点:A. JavaScript 是一种轻量级的编程语言。B. JavaScript 是可插入 HTML 页面的编程代码。C. JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。D. JavaScript 很容易学习。
    JS的组成:
        ECMAScript:    定义了JS的基本对象和语法.BOM: Browser Object Model, 浏览器对象模型.DOM: Document Object Model, 文档对象模型.2. JS的引入方式:A: 直接嵌入到HTML页面中.    写在<head>标签中的<script><script>//JS代码</script>
    B: 写在.js文件中,然后再页面中引入该.js文件.           写在<head>标签中的<script><script src="引入的.js文件的路径">//JS代码</script>3. ECMAScript的核心语法基础语法:A: JS是区分大小写的.B: JS是弱类型语言, 所有的变量值都用var类型的变量接收.var v1 = "abc";var v2 = 123;var v3 = false;var v4 = null;var v5;var v6 = new Array();C: 每行语句末尾的分号可写可不写, 建议写上.D: JS中的注释方式和Java中的注释方式类似.//单行注释/*多行注释*/E: 由{}括起来的内容是代码块.变量的命名规则:A: 变量名的组成必须是: 数字, 大小写字母, _, $四部分中组成.B: 数字不能开头.JavaScript中值的数据类型:原始值:        //可以理解为Java中基本类型的值//存储在栈中, null除外(存储在堆中)String:        //JS中没有字符的概念, 字符串用''或者""括起来效果是一样的.Number:        //所有的小数和整数都是: Number值.Boolean:    //值只有两个: false, trueNull:        //值只有一个: nullUndefined:    //值只有一个: undefined
            我们可以通过typeof关键字, 来校验变量或者值是什么类型的值:格式: typeof 值或者变量名如果返回值是string, 说明是String类型的原值值.如果返回值是number, 说明是Number类型的原始值.如果返回值是boolean, 说明是Boolean类型的原始值.如果返回值是undefined, 说明是Undefined类型的原始值.如果返回值是object, 说明是一个引用类型的值或者Null类型的原始值.引用值:        //可以理解为Java中的引用类型的值.//存储在堆中./*JS中是没有类的, JS是基于对象的.可以理解为是: 面向对象.*/var b1 = false;                //原始值var b2 = new Boolean(true);    //引用值,   Boolean 对象是 Boolean 原始类型的引用类型。var s1 = "abc";                //原始值var s2 = new String("abc");    //引用值,   String 对象是 String 原始类型的引用类型。var n1 = 123;            //原始值var n2 = new Number(123)    //引用值,          Number 对象是 Number 原始类型的引用类型。
                和Java中的代码对比:int a = 10;                            //Java中的基本类型Integer ii = new Integer(10);        //Java中的引用类型Integer ii2 = 10;                    //JDK1.5的新特性: 自动装箱.4. JavaScript中的类型转换转成字符串: 变量名.toString();转成数字: parseInt(值), parseFloat(值);强制类型转换:Boolean(给定的值); //把给定的值转成boolean类型, 值是非空字符串, 非零数字, 非null的情况下返回true, 其他返回false.String(给定的值); //把给定的值转成字符串.//类似于 值.toString()这种方式.Number(给定的值); //把给定的值转成数字. 如果给定的值是false和true, 那么则分别转成0和1.    5. JavaScript中的运算符JavaScript中的运算符和Java运算符基本一致.算术运算符:+, -, *, /, %, ++, --
        赋值运算符:=, +=, -=, *=, /=, %=
        比较运算符:>, <, >=, <=, != , ==, ===(全等于)/*==和===解释: ==: 只校验值是否相等.===(全等于): 既校验值是都相等, 也校验值的类型是否相同.*/逻辑运算符:    &&, ||, !条件运算符:    //和Java中的三元运算符一样.var num = num1 > num2 ? num1 : num2;逗号运算符://相当于同时声明多个变量.var num1 = 1, num2 = 2, num3 = 3;6. JavaScript中的语句和Java中非常类似, 需要注意的是: for循环的初始化条件的类型要写成var.7. JavaScript的事件的概述概述: 前面编写的JS代码都是直接在<script>标签中直接写的, 按照执行的顺序来讲, 只要页面加载到代码, 就会执行.这样写不够灵活, 一般JS的代码是由 用户某些行为 的触发来执行的.这些用户的行为, 就是事件.常用事件:onclick:         //鼠标单击事件ondblclick:        //鼠标双击事件onmouseover:    //鼠标悬浮事件onmousemove:    //鼠标移动事件onmouseout:        //鼠标移除事件onkeyup:        //键盘抬起事件onfocus:        //获取鼠标焦点事件onblur:            //失去鼠标焦点事件onchange:        //改变事件. 一般用于下拉列表, 可以用来做菜单联动.onsubmit:        //提交事件.    可以用来做表单数据校验.onload:            //页面加载事件//JS事件一般结合 JS函数一起使用.8. JavaScript的自定义函数函数的定义格式:格式一: 普通定义格式, 直接写.//注意: 直接写参数即可, 不需要写数据类型.function 函数名(参数1, 参数2){}//示例: 计算两个数字的和function sum(a,b){return a + b;}格式二: 匿名函数//把函数绑定到事件上.onload = function() {}9. JavaScript的全局函数eval(): 将字符串当成脚本来执行. //Ajax会用.var s = "alert('aaa')";eval(s);parseInt();        转成整数parseFloat();     转成小数toString();      转成字符串encodeURIComponent(); 把字符串编码为 URI 组件。decodeURIComponent(); 解码一个编码的 URI 组件。//缓存数据可以存在Cookie里边, 但是Cookie默认是不能存中文的, 就可以通过这两个方法对字符串进行编码和解码.10. JavaScript的对象及数组RegExp: 正则对象. 正则的校验有两种方式: String#match();//字符串.match("正则表达式");
            RegExp#test();//正则表达式.test(字符串);
    数组的定义:直接定义:var arr = [1,2,3,"abc",true];对象方式定义:var arr = new Array();arr[0] = 1;arr[1] = 2;var arr2 = new Array(3);//下边只能是0,1,2var arr3 = new Array("a","b","c");11. JavaScript的BOM对象BOM的概述:    //Browser Object Model, 浏览器对象模型.
    浏览器对象的分类:Window: Window是浏览器对象中最顶层的对象, 使用这个对象的时候可以window.xxx也可以将window省略. //即: window.alert()和alert()效果一样.
            alert();     警告框confirm();    确认框open(); 打开一个新的浏览器窗口或查找一个已命名的窗口close(); 关闭浏览器窗口。prompt();    //提示用户录入数据
            setInterval();    设置定时, 循环执行.//用法: setInterval("表达式", 间隔时间-毫秒);
            setTimeOut();    设置定时, 执行一次.//用法: setTimeOut("表达式", 间隔时间-毫秒);
            clearInterval(); 清除定时clearTimeOut(); 清除定时History:浏览器的历史对象.Location:浏览器的控制页面跳转对象.Navigator:  Screen: 12. DOM对象简介概述: document Object Model, 文档对象模型.//所谓的文档模型指的就是: 把整个页面加载到内存形成树状结构, 也叫DOM树./*记忆:DOM对象是把整个文档(.html文件)加载到内存, 文档中的(元素标签,属性,文本)都是对象,通过操作对象来实现, 修改或者修饰HTML页面的效果.*/树状结构的特点:1. 有且只有一个根节点.2. 每个节点都有一个父节点和任意个子节点, 根节点除外.3. 没有子节点的节点叫: 叶子节点.DOM树的特点:1. 所有的元素标签都用: Element表示.2. 元素标签的属性用: Attribute表示.3. 文本内容用: Text表示.4. 元素标签, 属性, 文本统称为: 节点(Node).13. DOM对象的功能  //document对象的功能: 就是把整个页面加载到内存后形成的对象.
    获取:document.getElementById("元素的id属性值");                //根据id获取元素, 获取的是一个.document.getElementsByName("元素的name属性值");            //根据name获取元素, 获取的是多个.document.getElementsByClassName("元素的class属性值");    //根据class获取元素, 获取的是多个.document.getElementsByTagName("元素的标签名");            //根据标签名获取元素, 获取的是多个.
    创建:document.createElement("元素标签名");    //根据元素标签名创建指定的标签.document.createTextNode("文本值");        //创建指定的文本<select><option>--请选择--</option><option>北京市</option><option>上海市</option>            </select>14. Element对象的功能节点1.appendChild(节点2);            //把节点2添加到节点1中.节点1.insertBefore(新节点, 旧节点);    //把新节点插入到旧节点的前边.
    replaceChild();removeChild();15. Element对象之: 常用属性childNodes:        //获取指定元素下所有的子节点firstChild:        //获取指定元素的 第一个子节点lastChild:        //获取指定元素的 最后一个子节点parentNode:        //获取指定元素的父节点nodeName:        //获取指定的节点名nodeType:        //获取指定的节点类型nodeValue:        //获取指定的节点值

转载于:https://www.cnblogs.com/blazeZzz/p/9210638.html

js的简单介绍及基本用法相关推荐

mvc 框架ember.js的简单介绍
什么是Ember.js Ember.js是一个开源的免费JavaScript客户端框架,用于开发Web应用程序.使用模型-视图-控制器(MVC)模式.该框架提供通用数据绑定,基于网址驱动的方法用于构建 ...
Netty5的例子，简单介绍Netty的用法
转自:http://blog.csdn.net/tjbsl/article/details/51038947 这是一个netty快速入门的例子,也是我的学习笔记,比较简单,翻译于官方的文档整理后把所有 ...
vue之node.js的简单介绍
一.什么是node.js? 它是可以运行JavaScript的服务平台,可以吧它当做一门后端程序,只是它的开发语言是JavaScript 二.安装 1.node.js的特性: - 非阻塞IO模型 - ...
HTML5 JS录音功能,简单介绍recorder.js 基于Html5录音功能的实现
这篇文章主要介绍了recorder.js 基于Html5录音功能的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧 recor ...
node js Bluebird 简单介绍 promise 解决回调地狱
Promise是异步代码实现控制流的一种方式.这一方式可以让你的代码干净.可读并且健壮. 异步回调如下: fs.readFile('directory/file-to-read', function( ...
node.js Promise简单介绍
转自百度: https://baijiahao.baidu.com/s?id=1589455136001194151&wfr=spider&for=pc
Vue.js 内置了10个过滤器，下面简单介绍它们的功能和用法。
Vue.js 内置了10个过滤器,下面简单介绍它们的功能和用法. ①capitalize:字符串首字符转化成大写 ②uppercase:字符串转化成大写 ③lowercase :字符串转化成小写 ...
TS简单介绍以及用法
TS简单介绍以及用法一.什么是TS TS是TypeScript的缩写,是JavaScript的超集 (JS有的TS都有),也可以说TS是 type + js,加了一个类型.比如:JS:let a = ...
求介绍matlab函数用法的书,MATLAB初学者教程--函数用法的简单介绍
1.4 函数用法的简单介绍 1.4.1什么是函数似乎很多人一听到函数这个词就会想到数学中的某个概念,然后对于恐惧数学的同学就开始打退堂鼓.在matlab当中到处可以用到函数,它的出现可以让我们用很简 ...

js的简单介绍及基本用法

js的简单介绍及基本用法相关推荐

最新文章

热门文章