JavaScript基础知识
来源:互联网 发布:c语言编程技巧 编辑:程序博客网 时间:2024/06/16 07:49
JavaScript基础知识
1 JavaScript基础知识
JavaScript的中的6种基本数据类型:number、string、boolean、object、function、undefined:
- number:就是数字值,包括整数、小数、NaN、正负无穷。
- string:就是字符串,单双引号括起来的内容。
- boolean:true/false。
- object:表示所有的javascript对象。
- function:表示我们熟悉的函数,也是函数类型,是javascript特有的数据类型。
- undefined:表示变量声明了但是没有被赋值,也等同于nullalert(undefined == null); 返回true。
1.1 变量范围
//变量:全局、局部两种类型:
javascript:不建议使用全局变量(查找时候,JavaScript总结效率比较低下,大型程序时不安全);
//变量:全局、局部两种类型:
javascript:不建议使用全局变量(查找时候,JavaScript总结效率比较低下,大型程序时不安全);
Function函数创建的三种方式
第一种:function语句形式
function fun1(x,y){ return x+y;};
第二种:函数直接量的形式
var fun2 = functionn(x,y){ return x+y;};
第三种:构造函数形式:
var fun3 = new Function('x','y','returnx+y;');
前两者的区别:
第一种:javascript解释器直接执行
其它的:javascript代码从上到下按顺序执行
第三种:作用域与前两者不同,构造函数形式具有顶级的作用域。
1.2 arguments对象
函数中的arguments对象,每个函数内部都会有的一个argments对象
作用一:接受函数的实际参数:
function fun4(x, y) { // 作用一:接受函数的实际参数: alert(arguments.length); // 输出4 alert(arguments[2]); // 输出3}fun4(1, 2, 3, 4);
作用二:用于递归操作
// 作用二:用于递归操作function fun5(number) { if (number <= 1) { return 1; } else { return number * fun5(number - 1); }}alert(fun5); // 输出的结果120var fun6 = fun5;fun5 = null; // 将fun5置null后,函数将会出现错误fun6(5);
//解决方法:
// arguments.callee 表示引用当前函数对象本身function fun5(number) { if (number <= 1) { return 1; } else { return number * arguments.callee(number - 1); }}fun6(5); // 此时将输出120
1.3 this关键字
this关键字总是指向调用者,谁用户函数this就指向谁。
全局变量就是指window下。
var color = 'red';var obj = { color : 'yellow'};function showColor(x, y, z) { alert(x + y + z); alert(this.color);}// call.apply绑定作用域// call可以传递任意多的参数showColor.call(window, 10, 20, 30); // 输出的结果:red、60showColor.call(obj, 10, 30, 40); // 输出的结果:yellow、80// apply只能传递数组showColor.apply(window, [ 1, 2, 3 ]); // 输出的结果:red、6showColor.apply(obj, [ 1, 3, 4 ]); // 输出的结果为:yello、8
1.4 块的概念
function fun7(){ for(int i =0;i<=5;i++){ alert(i); // 输出1到5 } alert(i);// 输出6}
块的原理:javascript当函数执完之后垃圾回收器,会回收function中没有引用的变量。
function fun8(){ (functionn(){ for(int i=0;i<=5;i++){ alert(i); // 输出1到5 } })(); alert(i); // 报错:i is not defined}
1.5 闭包概念
- 和高级程序语言不同,js没有块的概念,我们一般用小括号包裹块级作用域闭包:掌握闭包必须要深入的清楚的概念
-执行环境
-作用域链
-垃圾回收机制
//函数碰到return直接返回,没有return返回undefined
//在javascript语言中不提倡使用全局变量(1.不安全 2:做变量搜索查找效率比较低)
闭包案例一:
function fun9() { return function() { alert('最简单的闭包函数'); }}alert(fun9); // 返回function内容alert(typeof fun9); // 返回的functionvar temp = fun9();temp(); // 输出结果:最简单的闭包函数
闭包案例二:
function fun10() { var temp = 10; return function() { alert(temp); // 返回10 }}fun10()();
闭包案例三:
<input type="button"value="统计点击次数"onclick="inp.getCount" />
var inp = (function() { var i = 0; return { getCount : function() { alert(++i); // 输出每次i+1的结果 } }});
1.6 使用JSON对象
使用JSON对象(JavaScript Object Notation)
// 定义对象var obj = new Object();// json 对象var obj = { name : 'zhangsan', age : 20};obj.sex = '男'; // 新增属性obj.age = 25; // 修改属生值delete obj.name; // 删除属性// obj =null; //删除对象// 遍历属性、属性值for ( var attr in obj) { alert(attr + ":" + obj[attr]);}// 输出结果 name:zhangsan age:25 sex:男
1.7 面向对象的概念
- 定义一个类、实例化对象、扩展对象(原型prototype)
- 单体模式:简单单体、闭包单体、惰性单体、分支单体
- 对象的定义其它的方式(工厂模式、稳妥对象、聚合对象)
- 原型的使用、原型链
- 原型的继承(多种方式实现:组合继承、借用构造函数继承、混合继承、掺元类等)。
- 链式编程
- javascript契约书:接口(注释法、属性检测法、鸭式辨型法)
- 闭包的缺点:内存一直不会释放,一直被缓存。
// 定义JavaScript中的类var Person = function(name,age){ // 定义属性 this.name = name; this.age = age; // 定义么有属性,一般私有属性以下划线开头 var _sex = '男'; // getter &setter this.getSex = function(){ return _sex; } this.setSex =function(sex){ _sex = sex; } }// 扩展对象(原型prototype)// 扩展属性Person.prototype.id = 10;// 扩展方法Person.prototype.method = function (){ alert('prototype.method()'); }; // 简单原型创建对象形式// 原型对象的构造器,总是指向当前对象的模板Person.prototype = { // 还原来的构造器 constructor :Person, id : 10, method : function(){ alert('method()'); }}// 实例化对象var person = new Person('张三',18);alert(person.name); // 输出:张三alert(person.id); // 扩展属性输出:10person.method(); // 输出:prototype.method()// 简单单体:单体对象var SINGLETON = {};// 定义方法SINGLETON.Array = function(){ each:function(){ alert('each mtheod'); }, filter:function(){ alert('fiter mtheod'); }}// 静态方法SINGLETON.staticMethod = function(){ alert('静态方法');}SINGLETON.each();SINGLETON.staticMethod();// 闭包单体:单体对象var SINGLETON2 = (function(){ var Array = { each:function(){ alert('each method'); } return { arrayEach:Array.each(); }; }})();SINGLETON2.arrayEach();
1.8 学习JavaScript推荐书籍:
1. 《JavaScript高级程序设计》
2. 《JavaScript设计模式》
3. 《JavaScript DOM编程艺术(第2版)》
4. 《学习JavaScript数据结构与算法》
5. 《深入理解ES6》
——厚积薄发(yuanxw)
- javascript基础知识
- JavaScript基础知识
- javascript基础知识
- javascript基础知识
- JavaScript基础知识
- JavaScript基础知识
- JavaScript基础知识
- JavaScript基础知识
- javascript基础知识
- javascript基础知识
- javascript基础知识
- javascript基础知识
- Javascript基础知识
- javascript -基础知识
- JavaScript基础知识
- javascript基础知识
- javascript基础知识
- javascript 基础知识
- 啥是移动广告跨屏
- 第五天
- 动态加载资源简析和实践
- Web项目的WEB-INF目录使用说明
- 四:分支管理
- JavaScript基础知识
- 《ASP.NET MVC企业实战》(二) MVC开发前奏
- Luogu P2240 数的计数数据加强版
- linux命令
- css_day05_修改input中placeholder的默认属性
- CSS 的 弹性布局
- 前端面试题
- TCP三次握手和四次挥手
- 求大区间内素数的个数(区间筛法)