dreamapplehappy/hacking-with-javascript

To be, or not to be, that is a question! :joy: 万剑归宗的无名和独霸天下的雄霸

攀登JavaScript的高峰

欢迎贡献 fork and pull request 😜

📚 多读书

• 📖 Effective JavaScript 完成度: 100%
• 📖 JavaScript: The Good Parts
• 📖 You Don't Know JS

Vanilla JS

• 理解JavaScript的Object.defineProperty()函数

一点一滴:

• 理解prototype和__proto__
• 构造函数内的方法与构造函数prototype属性上方法的对比
• 掌握JavaScript的闭包
• 执行环境以及作用域
• 掌握JavaScript函数的柯里化

翻译的文章

• 你想知道的关于JavaScript作用域的一切

你肯定不会系列

• 你肯定不会这样使用JavaScript: 0x1

系列教程

• Angular2 系列教程
• Vue 系列教程
• ES6 系列教程

工具集合

• 关于动画的库,包括CSS以及JavaScript
• 关于图片
• 关于Ajax/XHR

读书记录

• JavaScript权威指南

hacking-with-javascript's Issues

item 17: 间接调用eval函数优于直接调用 (Prefer Indirect eval to Direct eval)

var str1 = 'hello1'; function test1() { var str1 = 'world1'; //var e = eval; //return e('str1'); return (0, eval)('str1'); // 等同于上面注释的部分 } console.log(test1()); // hello1

悲剧，这段也没有看明白为啥会调用的外部变量

字词错误

作者你好，
使用.call(),.apply()或者.bind()改变作用域的部分的第一个列表出现错字
.call()和.apply() .call()和.apply()函数是非常实用的,它们允许你传递一个作用域到一个函数里面,这个作用与绑定了正确的this值. 让我们来处理上面的那些代码吧,让循环里面的this指向正确的元素值:
应该是:
.call()和.apply() .call()和.apply()函数是非常实用的,它们允许你传递一个作用域到一个函数里面,这个作用域绑定了正确的this值. 让我们来处理上面的那些代码吧,让循环里面的this指向正确的元素值:

将数组里面的循环元素link[i]当做参数传递给了.call()方法, 然后我们就改变了哪个立即执行的函数的作用域
应该是:
将数组里面的循环元素link[i]当做参数传递给了.call()方法, 然后我们就改变了那个立即执行的函数的作用域

请问在《理解prototype和__proto__》中用的是什么画图工具啊

掌握JavaScript函数的柯里化

大家有什么疑问，建议或者批评指正，都可以在下面提出来:grin:

掌握JavaScript函数的柯里化之泡椒凤爪

泡椒凤爪这段代码感觉有问题：

var _ = {};

function showMsg(name, age, fruit, other) {
    console.log('My name is ' + name + ', I\'m ' + age + ' years old, ' + ' and I like eat ' + fruit + ' and ' + other);
}

function crazyCurryingHelper(fn, length, args, holes) {
    length = length || fn.length;
    args   = args   || [];
    holes  = holes  || [];

    return function() {
        var _args       = args.slice(),
            _holes      = holes.slice();

        // 存储接收到的args和holes的长度
        var argLength   = _args.length,
            holeLength  = _holes.length;

        var allArgumentsSpecified = false;

        // 循环
        var arg     = null,
            i       = 0,
            aLength = arguments.length;

        for(; i < aLength; i++) {
            arg = arguments[i];

            if(arg === _ && holeLength) {
                // 循环holes的位置
                holeLength--;
                _holes.push(_holes.shift());
            } else if (arg === _) {
                // 存储hole就是_的位置
                _holes.push(argLength + i);
            } else if (holeLength) {
                // 是否还有没有填补的hole
                // 在参数列表指定hole的地方插入当前参数
                holeLength--;
                _args.splice(_holes.shift(), 0, arg);
            } else {
                // 不需要填补hole,直接添加到参数列表里面
                _args.push(arg);
            }
        }

        // 判断是否所有的参数都已满足
        allArgumentsSpecified = (_args.length >= length);
        if(allArgumentsSpecified) {
            return fn.apply(this, _args);
        }

        // 递归的进行柯里化
        return crazyCurryingHelper.call(this, fn, length, _args, _holes);
    };
}

var crazyShowMsg = crazyCurryingHelper(showMsg);

crazyShowMsg('dreamapple', _, _, 'oranges')(_, 'apple')(22); // My name is dreamapple, I'm 22 years old,  and I like eat apple

我又加了一个参数，应该返回:
My name is dreamapple, I'm 22 years old, and I like eat apple and orange
但是结果返回：
My name is dreamapple, I'm 22 years old, and I like eat oranges and apple

oranges 和 apple 的顺序反了，应该如何修改？

来几发关于RxJS的内容

博主来几发关于RxJS的内容吧~

item 13: 使用立即调用的函数表达式创建新的作用域 (Use Immediately Invoked Function Expressions to Create Local Scopes)

// 测试使用的数组
var testArr = [1, 2, 3];

// @3 使用闭包方式二
function generateFunc2(arr) {
var result = [];
var n = arr.length;
for(var i = 0; i < n; i++) {
(function() {
result[i] = function() {
return arr[i];
}
})()
}
return result;
}
// @3 产生新的函数
var g3 = generateFunc2(testArr);
console.log(g30); // 1
console.log(g31); // 2
console.log(g32); // 3
VM14910:19 undefined
VM14910:20 undefined
VM14910:21 undefined
undefined

chrome版本 54.0.2840.87 m (64-bit)

这里执行的结果还是undefined

理解JavaScript的Object.defineProperty()函数