初学JavaScript从入门到放弃(一)JavaScript介绍、变量、数据类型
程序员文章站
2022-07-04 23:23:57
一、JavaScript介绍 1、JavaScript:轻量级的客户端脚本语音 2、目前js已经不仅仅是客户语音,基于NODE可以做服务器端程序,所以Javascript是全栈编程语音 3、js及部分组成 ECMAScript (ES):js的核心语法 DOM:docment object mode ......
一、javascript介绍
1、javascript:轻量级的客户端脚本语音
2、目前js已经不仅仅是客户语音,基于node可以做服务器端程序,所以javascript是全栈编程语音
3、js及部分组成
- ecmascript (es):js的核心语法
- dom:docment object model 文档对象模型,提供各种api(属性和方法)让js可以获取或操作页面中的html元素(dom和元素)
- bom:browser object model 浏览器对象模型,提供各种api让js可以操作浏览器
- esmascript
- 他是js的语法规范,js中的变量,数据类型,语法规范
二、javascript变量(variable)
它不是指具体值,只是一个用来存储具体容器或者代名词,因为他存储的值可以改变。
1.基于es语法规范,在js中创建变量有以下方式
- 严格区分大小写
- var(es3)
- function (es3) 创建函数(函数名也是变量,只不过存储的值是函数类型的而已)
- let (es6)
- const (es6) 创建的是常量
- class (es6)基于es6创建类
- import (es6)基于es6的模块规范导出需要的信息
/* * 语法: * var [变量名] = 值; * let[变量名] = 值; * const[变量名] = 值; * function 函数名(){ * } * .... */
2、创建变量,命名的时候要遵循一些规范
- 严格区分大小写
var n = 12; var n = 13; //=>两个n不是同一个变量
- 遵循驼峰命名法:第一个小写,后面的单词大写按照数字,字母,下划线来命名(数字不能做为开头)
var studentinfo; / student_info/ var _studentinfo;//(下划线在前端的都是公共变量) var $studentinfo;//(一般存储都是jq元素) function ion tolowerpase(){ }
- 不能使用关键字
三、数据类型
1、基本数据类型
-
基本数据类型(值类型)
- 数字 number
[基本数据类型]
有一个特殊的nan(not a number代表不是一个有效的数字但是属于number类型的)- 字符串 string
- 布尔 boolean
- null
- undefined
-
引用数据类型
- 对象object
- 普通对象
var o = {name:'xie',age:18}
- 数组对象
var ary = [1,2,34];
- 正则对象
var reg = /-?\d|([1-9]\d+))(\.\d+)?/g; 由元字符组成一个完整的正则 // 不是空正则是单行注释
- 日期对象
- ·······
- 函数function
function fn() { }
- 对象object
- es6中新增加的一个特殊的类型:symbol,唯一的值
[symbol] 创建出来的是唯一的值 var a = symbol('谢'); var b = symbol('谢'); a==b =>false
2、浏览器
- elements:在当前页面的元素和样式在这里都可以看到,还可以调节样式修改结构等
- console:控制台,可以在js代码中通过.log输出到这里,也可以在这里直接编写js代码
- sources:当前网站的源文件都在这里
3、扩展:js代码如何被运行以及运行后如何输出结果
[如何被运行]
把代码运行在浏览器中(浏览器内核来渲染解析)
-
基于node来运行(node也是一个基于v8引擎渲染和解析js的工具)
[如何输出结果] -
alert:在浏览器中通过弹框的方式输出(浏览器提示框)
ps:输出的结果是tostring后的结果
//基于alert输出的结果都会转换为字符串:(如果是表达式先计算出结果然后在用tostring方法转换为字符串 var num = 21; alert(num); =>window.alert alert({name:'xxx'});=>['object object'] //为什么tostring后的结果是object??
- confirm:确认提示框
var num = 2; var fiag = confirm(num); alert(fiag);//如果点击的是确定就是true点击的是取消则是false
- prompt:在confirm的基础上增加输入框(不常用)
- console.log:原来的意思是在浏览器工作台输出日志
- console.dir:比log输出的更加详细一些(尤其是输出对象的数据值的时候)
- console.table:把一个json数据按照表格的方式输出